White box design

Store Design
, ,
1

Artez_0-1749372892266.png
Artez_0-1749372892266.png906×409 15.3 KB

Hi,
In my contact form I updated the code so I can change backgrounds.

The small issue as you can see is the boxes containing info, rounded corner but i still have a white background

after rounding the corners,

is there a way to fix it please?

https://wmqgez-r2.myshopify.com/

Warm Regards.

2

@Artez

Please add the following code at the bottom of your css file.

.contact .field__input {
    background-color: transparent;
}

Hope this works.

3

base.css

/* Clean rounded contact form inputs */
input,
textarea {
background-color: #ffffff !important;
border-radius: 16px !important;
border: none !important;
box-shadow: none !important;
padding: 12px 16px !important;
outline: none !important;
appearance: none;
-webkit-appearance: none;
font-family: inherit;
}

/* Focus state (optional) */
input:focus,
textarea:focus {
border: 1px solid #000000 !important;
}

/* Remove styling from wrappers */
.form__field-wrapper,
.form__input,
.contact__fields {
background: transparent !important;
border: none !important;
box-shadow: none !important;
overflow: visible !important;
padding: 0 !important;
}

/* Optional: adjust Send button style to match */
button,
.form__submit {
border-radius: 16px;
padding: 12px 24px;
font-weight: 600;
}