@R3ygoski
Posted
Hello again Lyle. First of all, I'd like to say congratulations! Your project looks almost similar to the proposed design, which is great.
Let me start by addressing your question. To create a small text without using @media, you can use clamp(). This way, you can define a minimum, base, and maximum size for your text.
The method you used to resize the image doesn't seem wrong, but instead of using max-width, you could use width: 100%. This is because if the user happens to be using a larger font size, it may cause the image to appear small. To test this, try increasing your browser's font size, and then change max-width to width: 100%.
Regarding the ::hover, you used it correctly; it was meant to be used on the card and the title. And a tip, the title should have a cursor: pointer; because it's clickable.
About the image zoom, you can add an overflow: hidden to your figure, and on your image, add transform: scale(105%), then just add the border-radius to the figure.
Once again, congratulations! If you have any questions or if any doubts arise, please ask below, and I'll try to help.
@Squing0
Posted
Thanks for your feedback! Clamp is pretty useful and you're right about the image width. Only thing I wasn't able to get working was the image zoom in effect.@R3ygoski
