Makha• 530
@mbd89
Submitted
So I'd like to know : How can I make the background image look better ? or how can I position it better ?
Thanks in advance.
Iván De León Lino
@Lino-OTM
All comments
- Iván De León Lino• 600
@Lino-OTM
Posted
Hi @Makha! Excellent job with this one!
You might want to use for the background-size properties such as contain and cover, it will help you to reach a pixel-perfect style, and remember to use them depending on the screen device so you might want to change them using media-queries. You also can use the property background-position with any of these values top, right, bottom, left, and more than one at the time.
Marked as helpful
0 - Sté[PH]ane• 160
@Fanou59
Submitted
Let me know if it's good or not :)
Iván De León Lino• 600@Lino-OTM
Posted
Congrats Sté[PH]ane! your project looks amazing. I've checked the mobile version and the desktop one as well and both look perfect!
One little thing while I was studying your code is that in the CSS you made an unnecessary reset using a lot of tags. you can simply use the universal selector " * " you can check more about it here!
-
If you want to improve your compatibility with other browsers you can use normalize.css.
-
Very well use of CSS variables!
-
You can also try to work with any methodology such as BEM. It will help you a lot too.
These improvements are for your future projects if at any moment you come back to work with your old code!
0 -
- Robin• 160
@roleigh1
Submitted
I worked the first time with chartjs.
Iván De León Lino• 600@Lino-OTM
Posted
Excellent work! Looks amazing!
1 - Travolgi 🍕• 31,440
@denielden
Submitted
Hi there! 😀
This is my advanced solution for the Qr Code Component. This app generates Qr Code based on the url entered.
Added features:
- Light / dark mode theme switcher
- Dark color customization
- Font customization
- Qr Code DenielDen profile link default on loading
- Dynamically generating the Qr Code as you type the URL
- Dynamically update the color and background of the Qr Code
- Dynamically update the customized image of the Qr Code
- Removes the custom image of the Qr Code
- You can download the
.pngof the generated Qr Code
Any feedback and advice are welcome!
Happy coding 😁
Iván De León Lino• 600@Lino-OTM
Posted
Man I'm learning React and watching things like these is admirable and inspires me to try something similar with other challenges, congrats!
2 - Coder Jacko• 190
@coderrJacko
Submitted
I used @keyframes for ::before and ::after pseudo elements to create a transition on hover effect, but I didn't know how to make the transition smooth when the image gets "unhovered". If you know how to do that, I would appreciate the answer.
General feedbacks are also welcome.
Iván De León Lino• 600@Lino-OTM
Posted
Hi Jacko! What you are trying to do with the hover effect it can be easily done with
transition: all 500ms ease-in-out;and to set the opacity from 0 to 1 when hovering. Don't forget to use the "all" property that's what makes the smooth transition when you are not putting your mouse over the image, I hope this can help you!0 - Rafael Takano• 180
@rafaeltakano
Submitted
Any feedback is welcome, specially for accessibility with my html/component
Iván De León Lino• 600@Lino-OTM
Posted
Excellent design! You made it pixel perfect that's very nice! I would suggest you use a smooth transition on the buttons so they look prettier! For eg: .btn:hover { transition: 400ms ease }; Of course, you can try any different type of animation for your buttons too! Also you can try putting images/icons inside a <figure> tag instead of a <div> that helps a lot Your code is very clean and easy to understand, very well use of BEM
Marked as helpful
1
