@Abhirup-Sarkar
Submitted
@Andrew-Castro
@Abhirup-Sarkar
Submitted
@Andrew-Castro
Posted
Great job Abhirup, you're getting some HTML validation issues because of your class names. I would consider reviewing BEM methodology naming conventions: https://en.bem.info/methodology/css/#naming
TLDR: The modifier should only have one hyphen, but two underscores.
Marked as helpful
@ryanindrjaya
Submitted
Please let me know your opinion on my challenge. Thank you!
@Andrew-Castro
Posted
Hey Ryan,
Great job so far. If you set the card width to 350px your solution gets very close to the design.
As Old mentioned above, there's a bit of heading misuse here. I don't personally believe the eth value, days left or author text are semantically headings and shouldn't be treated as such. You could use paragraph tags here.
Marked as helpful
@Andrew-Castro
Posted
This design works best if this card has a fixed width, in this case it's 350px. Avoid using percentages for widths as it doesn't lend itself well to responsive design (unless you're writing dozens of media queries to deal with it).
Same goes for padding and margin, you can see the desktop and mobile designs have consistent spacing, so you're not going to want to use percentages for these values. Try playing with pixels or rem units for these.
For example, the overall padding on the card is 24px on all sides, right now you're using 1.5% which is causing the padding to be a variable size based on screen width, if you set it to 24px or 1.5rem, this is be consistent with the design.
There's more that could be improved on but I will leave you with this and help further if needed, good luck!
Marked as helpful
@adamghowiba
Submitted
Hello world,
Made this in less than a day. Didn't do any mobile responsiveness as I'm very fluent in frontend and not the goal of what I was trying to learn. I was mainly wanting to increase my skills in Svelte, and dealing with data.
Just wanted to submit the solution non less as it houses all the core features of the app.
@Andrew-Castro
Posted
There's a typo when deleting an invoice: "Confirm Deletoon"
Looks great though
@Pherwerz
Submitted
@Andrew-Castro
Posted
Great job on this one! You can solve 90% of your accessibility issues and HTML issues by switching those ID's of price to classes of price.