This is a solution to the Order summary card challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- See hover states for interactive elements
- Semantic HTML5 markup
- Sass
- Flexbox
- Mobile-first workflow
- Vite (I know this isn't needed 😆)
I'm proud of my background management
main {
&::before {
position: absolute;
content: "";
inset: 0;
z-index: -1;
background-image: url("/img/pattern-background-mobile.svg");
background-size: 100%;
background-repeat: no-repeat;
@include desktop {
background-image: url("/img/pattern-background-desktop.svg");
}
}
}