71 lines
1.6 KiB
CSS
71 lines
1.6 KiB
CSS
.postcode_modal {
|
|
border-radius: 20px;
|
|
box-shadow(10px);
|
|
border: none;
|
|
max-width: 80ch;
|
|
box-shadow: 0 0 20pc black;
|
|
padding: 2rem;
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease, display 0.3s allow-discrete;
|
|
|
|
&[open] {
|
|
opacity: 1;
|
|
transition-behavior: allow-discrete;
|
|
transition: opacity 0.3s ease, display 0.3s allow-discrete;
|
|
}
|
|
|
|
&:not([open]) {
|
|
display: none;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.5rem;
|
|
margin: .6rem;
|
|
}
|
|
|
|
input[type="text"] {
|
|
padding: .3rem;
|
|
font-size: 1.4rem;
|
|
caret-color: hsl(344 98 40);
|
|
}
|
|
|
|
button {
|
|
border: none;
|
|
font-size: 1.4rem;
|
|
color: hsl(233 100 100);
|
|
padding: .4rem 1rem;
|
|
border-radius: 5px;
|
|
background: hsl(344 98 40);
|
|
border: 1px hsl(344 98 40) solid;
|
|
margin: 0 0 0 .3rem;
|
|
transition: .2s all linear;
|
|
|
|
&:hover{
|
|
color: hsl(344 98 40 );
|
|
background: hsl(344 98 100);
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
.form_fields {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
&>{
|
|
display: flex;
|
|
}
|
|
}
|
|
|
|
&::backdrop {
|
|
backdrop-filter: blur(1px);
|
|
background-color: hsl(40deg 100 0 /0.4);
|
|
background: radial-gradient(circle,rgba(33, 33, 33, 0.68) 0%, rgba(15, 15, 15, 0.8) 23%, rgba(0, 0, 0, 0.87) 100%);
|
|
}
|
|
|
|
.error_message_modal_postcode {
|
|
min-height: 1lh;
|
|
color: hsl(344 98 40 );
|
|
}/* HTML: <div class="loader"></div> */
|
|
}
|