hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Replacing click animations

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-05-05 11:59:05 +03:00
parent 96fd4921ec
commit 24716eaa09
2 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/renderer/components/hotbar/hotbar-icon.scss
View File

@ -7,6 +7,7 @@
cursor: pointer;
transition: none;
text-shadow: 0 0 4px #0000008f;
position: relative;
div.MuiAvatar-colorDefault {
font-weight:500;

21
src/renderer/components/hotbar/hotbar-menu.scss
View File

@ -46,7 +46,7 @@
position: relative;
&.isDraggingOver {
box-shadow: 0 0 0px 3px $clusterMenuBackground, 0 0 0px 6px #fff;
background-color: #3e4148;
&:not(.isDraggingOwner) {
z-index: 50;
@ -61,12 +61,16 @@
transform: translate(0px, -40px)!important;
}
}
&.animateDown {
> div {
transform: translate(0px, 40px);
}
}
}
}
&.animating {
transform: translateZ(0); // Remove flickering artifacts
&:empty {
animation: shake .6s cubic-bezier(.36,.07,.19,.97) both;
transform: translate3d(0, 0, 0);
@ -75,7 +79,9 @@
}
&:not(:empty) {
animation: outline 1s cubic-bezier(0.19, 1, 0.22, 1);
.HotbarIcon {
animation: click .1s;
}
}
}
}
@ -100,13 +106,12 @@
}
}
// TODO: Use theme-aware colors
@keyframes outline {
@keyframes click {
0% {
box-shadow: 0 0 0px 11px $clusterMenuBackground, 0 0 0px 15px #ffffff00;
margin-top: 0;
}
100% {
box-shadow: 0 0 0px 3px $clusterMenuBackground, 0 0 0px 6px #ffffff;
margin-top: 2px;
}
}