@pikapikamart
Posted
Hey, great work on this one. The layout in desktop is good, though it is smaller than the original, the mobile layout is good as well, but I think making it a bit more stretch will be good, sorry nitpicking on those.
Some suggestions would be:
-
Adding a padding to the top and bottom of the
bodytag, just to make some spacing to prevent touching both ceiling and flooring. -
To achieve that purple or what color is that, hmm. To achieve that, simply add
background-blend-mode: multiply;on therightCardselector, that blends the background-image and the color. Then after that, you will see the color changes, then just tweak the background-color to achieve what you want. -
Lastly, removing the
margin-left: 20pxon thecardselector in mobile state will be good to make it centered properly. Also making thebodyhave more width, like 90% instead of 80%. Since it is mobile state right.
Regarding your concern:
-
On the image part, I don't see any
imgtags being used in here so I can't really help you that much on it. Though there are commentedimgtags, is that what you are referring to? But still, can't tweak if it is commented. -
On the table part, well I think you are right not to use header tags on those since it doesn't really adds up to be heading as well. Also using that table element, it's rare for me to see one of those so really good job on that! Making it work really good, that's awesome. I rarely used it since there are too many, making table datas, table heading and it annoys me :>
Overall, really great job on this^^
@Mekes1670
Posted
@pikamart Hey! Thanks so much for such a detailed reply, nitpicky or not I really appreciate it. The "background blend color" was what I tried but I must have messed it up. I'll give it a second look! I'll make sure I try that out again. I've been trying to use margin but I should really consider looking into padding for spacing on the body, I keep compensating for that by adding too much margin to other things so I'll keep that in mind for next time!
In regards to the images, I had a lot of issues with the images breaking and resizing improperly during the desktop -> mobile view so I ended up trying and making the .rightCard a background image instead of an actual image and I liked that more. But when I collapsed it and went mobile it got rid of the background image altogether and I couldn't figure it out so I ended up just adding the mobile image back and having it display:none until the media query hit and then I just used the mobile image with display: block. This part I had more issues than I thought I would with it.
Thanks so much for taking some time and looking, you cleared up a lot of my issues. :)
