Submitted
LilMus
@LilMus
All solutions
Submitted
Article preview component
- HTML
- CSS
- JS
It just lacks the hovering and clicking effect on the svg because I realised I had to change all the img for the raw svg code but it's okay
Submitted
FAQ Accordion / JS & SCSS
- HTML
- CSS
- JS
The JS part was okay for me but I had a hard time with the illustration on the left Especially with the parallelograms shadow and borders on the top.
I managed to create the parallelograms with skew but it distorted everything including the border radius but I think I managed to solve it by using border-radius values in percentage. It still feels weird to me but I think it's only because I saw skew distorting everything before
Submitted
Interactive rating component
- HTML
- CSS
- JS
Everything should be okay I tried to have a clear and simple code but this challenge was harder than expected
Submitted
I tried using sass for this one in order to practice, it was ok no real issues I had an issue with the main svg tho it was kinda hard resizing it but by setting a viewbow and deleting height and width value it went ok
Submitted
Singe price grid component
- HTML
- CSS
I tried using less class and div for this one but I believe it works okay anyway and the code should be clearer
Submitted
For this challenge I tried using less classes when it was not necessary in order to make my code easier to read
Submitted
The bottom background doesn't really fit there's still a small white band at the bottom of it I don't know if it's part of the background of I'm doing something wrong.
Except that everything should be okay.
Submitted
Order Summary using Flexbox
- HTML
- CSS
Hi, I mainly used flexbox to do this challenge. I still have a small issue with the "proceed to payment" button. I reduced the opacity to 0.7 when hovered but doing that also reduce the opacity of the box-shadow I put on so it gives a weird result. Do you know how I could have done it differently so it wouldn't look weird ?
Maybe using two <div>, one would blank and only used for the box-shadow and the other one for the actual button. It would be like this :
<div class="button_proceed_blank"> <div class="button_proceed"> </div> </div>And then only applying a box-shadow to .buton_proceed_blank. I just thought about this method while writing this
Submitted
NFT Preview using flexbox
- HTML
- CSS
Submitted
I tried to practice flexbox for this challenge and to make it responsive eventhough it is not needed. I still feel like my css file could be lighter with less lines and less sections what do you think about it ?