Mahmood• 1,070
@MahmoodHashem
Posted
Your project appears to be very well-designed and responsive, and there are no issues with it. However, I have a suggestion to make your project more closely resemble the challenge. You can achieve this by adding rounded corners to the inputs using the mask property in CSS. It's quite simple - just add a .class-name class to the inputs container and include the following code in your CSS:
.class-name{
--size: 20px;
border: 2px solid #b3818444;
background: #f2f2f2 content-box;
mask: conic-gradient(#000 0 0) content-box,
conic-gradient(at var(--size) var(--size), #0000 75%, #000 0) 0 0 /
calc(100% - var(--size)) calc(100% - var(--size));
}
Marked as helpful
1
Francesco• 270
@FraCav99
Posted
@MahmoodHashem thanks a lot! I'll try that for sure! :D
1
