1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00

fixed modal close button

This commit is contained in:
Fedor Katurov 2022-01-10 16:08:03 +07:00
parent 03ab52f814
commit c2154e930c

View file

@ -22,7 +22,6 @@
flex-direction: column; flex-direction: column;
min-width: $cell; min-width: $cell;
max-width: 400px; max-width: 400px;
max-height: 100%;
max-height: calc(100vh - 75px); max-height: calc(100vh - 75px);
width: 100%; width: 100%;
position: relative; position: relative;
@ -43,7 +42,6 @@
.footer { .footer {
@include outer_shadow(); @include outer_shadow();
// padding: 10px;
background: darken($content_bg, 2%); background: darken($content_bg, 2%);
} }
@ -66,13 +64,15 @@
} }
.close { .close {
background: darken($content_bg, 2%); @include outer_shadow;
width: 48px;
height: 48px; background: lighten($content_bg, 4%);
width: 36px;
height: 36px;
position: absolute; position: absolute;
top: -58px; top: -14px;
right: 50%; right: 4px;
transform: translate(50%, 0); transform: translate(50%, 0) scale(1);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -80,15 +80,21 @@
cursor: pointer; cursor: pointer;
transition: transform 0.25s, background-color 0.25s; transition: transform 0.25s, background-color 0.25s;
animation: appear 0.5s forwards; animation: appear 0.5s forwards;
z-index: 10;
@include tablet {
top: -16px;
right: 16px;
}
&:hover { &:hover {
background-color: $red; background-color: $red;
transform: translate(50%, -5px); transform: translate(50%, 0) scale(1.25);
} }
svg { svg {
width: 24px; width: 20px;
height: 24px; height: 20px;
} }
} }