muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00
Code Packages Activity Actions

#23 lost fixes

Browse source
This commit is contained in:
Fedor Katurov 2021-03-19 16:35:24 +07:00
parent dddb86c778
commit c939dcbce8
12 changed files with 254 additions and 177 deletions
Download patch file Download diff file Expand all files Collapse all files

108
src/components/editors/EditorPublicSwitch/styles.module.scss
View file

@ -1,63 +1,63 @@
@import "src/styles/variables";
.wrap {
@include outer_shadow();
@include editor_round_button();
transition: all 0.5s;
fill: $content_bg;
background-color: $olive;
&.promoted {
background-color: lighten($content_bg, 4%);
fill: $red;
@keyframes move_1 {
0% {
transform: scale(0) translate(0, 0);
opacity: 0;
}
&:hover {
50% {
transform: scale(1) translate(5px, -5px);
opacity: 1;
}
.tooltip {
opacity: 1;
100% {
transform: scale(1.2) translate(-5px, -10px);
opacity: 0;
}
}
@keyframes move_2 {
0% {
transform: scale(0) translate(0, 0);
opacity: 0;
}
50% {
transform: scale(1) translate(-5px, -5px);
opacity: 1;
}
100% {
transform: scale(1.6) translate(5px, -10px);
opacity: 0;
}
}
.button {
}
.lab_wrapper {
position: relative;
bottom: -2px;
.button:hover & {
&:before,&:after {
content: ' ';
position: absolute;
top: 1px;
left: 10px;
width: 2px;
height: 2px;
box-shadow: white 0 0 0 2px;
border-radius: 4px;
animation: move_1 0.5s infinite linear;
}
&:after {
animation: move_2 0.5s -0.25s infinite linear;
}
}
input {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
opacity: 0;
z-index: 1;
cursor: pointer;
}
}
.icon {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
}
.tooltip {
border-radius: 2px;
background: darken($content_bg, 6%);
padding: $gap;
position: absolute;
font: $font_12_semibold;
bottom: 100%;
right: 0;
transform: translate(0, -$gap);
text-align: center;
touch-action: none;
pointer-events: none;
opacity: 0;
width: 100px;
user-select: none;
transition: all 0.1s;
}