Lucas πΎβ’ 104,420
@correlucas
Posted
πΎHello Luka Liluashvili, congratulations for your new solution!
I've some tips for you:
The stats section needs the text as bold
.
To have the image responsive, add these properties to make the image respect the container responsivity:
Remove these properties:
.header_desktop {
/* float: right; */
/* height: 450px; */
/* border-top-right-radius: 10px; */
border-bottom-right-radius: 10px;
background-color: #80007b;
opacity: 30%;
}
img {
object-fit: cover;
display: block;
max-width: 100%;
}
To add the exact same purple overlay effect for the image, matching the design files you can use, filter
, background-blend-mode
or mix-blend-mode
(the best choice in my opinion). See the code below
img {
mix-blend-mode: multiply;
opacity: 0.8;}
π I hope this helps you and happy coding!
Marked as helpful
0