69 lines
1.4 KiB
CSS
69 lines
1.4 KiB
CSS
.form-wrap {
|
|
position: relative;
|
|
min-height: 380px;
|
|
overflow: visible;
|
|
.dots {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left:0;
|
|
mask-image: linear-gradient(to bottom, transparent, black);
|
|
}
|
|
}
|
|
|
|
.form-wrap__inner {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
max-height:380px;
|
|
overflow:hidden;
|
|
transition: max-height .25s ease-out;
|
|
}
|
|
|
|
.form-wrap:hover {
|
|
overflow: visible;
|
|
.dots {
|
|
display: none;
|
|
}
|
|
|
|
.form-wrap__inner {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: auto;
|
|
max-height: 900px;
|
|
transition: max-height .25s ease-in;
|
|
}
|
|
}
|
|
|
|
|
|
.clients-form__container {
|
|
.form-loading {
|
|
filter: blur(2px);
|
|
}
|
|
|
|
.loading-spinner {
|
|
position: absolute;
|
|
top: 0;
|
|
height: calc(100% + 10px);
|
|
width: calc(100% + 10px);
|
|
margin: -5px;
|
|
box-shadow: 0 0 5px #08080854;
|
|
background-color: #08080854;
|
|
z-index: 3;
|
|
}
|
|
|
|
.row-fade::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
width: 60px;
|
|
height: calc(100% + 2px);
|
|
pointer-events: none;
|
|
background: linear-gradient(to right, transparent, #fff);
|
|
margin: -1px;
|
|
filter: blur(1px);
|
|
}
|
|
} |