Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Product page builded with Svelte and WindiCss

#accessibility#svelte#tailwind-css
Ivan 2,630

@isprutfromua

Desktop design screenshot for the E-commerce product page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Please add feedback about my work, if you familiar with css, svelte, js technologies. I'll be appreciate for it

Community feedback

@lipe11

Posted

hi, your solution looks pretty good!... I used svelte in mine as well.

Overall looks good in my opinion, I'll just leave a couple of suggestions.

I think the lib folder could be a little bit misleading (they're mostly used for organizing modules), instead, I think you can omit it, and leave your components like this

src/components
src/components/cart
src/components/icons
src/stores

Another good recommendation to follow I think it's to avoid modifying stores directly, instead, have "action" functions that you can reuse in your components, something like this

const isVisible = writable(false)

function show() {
  isVisible.set(true)
}

function hide() {
  isVisible.set(false)
}

export default { isVisible, show, hide }

Hope this is useful

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord