Calibrated checkbox animation
This commit is contained in:
parent
c978cbec94
commit
5850e1594d
@ -46,6 +46,14 @@ avatar-element {
|
||||
--color-bottom: var(--peer-avatar-pink-bottom);
|
||||
}
|
||||
|
||||
&.tgico:before {
|
||||
font-size: calc(32px / var(--multiplier));
|
||||
}
|
||||
|
||||
&.tgico-calendarfilter:before {
|
||||
font-size: calc(36px / var(--multiplier));
|
||||
}
|
||||
|
||||
&.tgico-savedmessages:before {
|
||||
font-size: calc(25px / var(--multiplier));
|
||||
}
|
||||
@ -54,10 +62,6 @@ avatar-element {
|
||||
font-size: calc(54px / var(--multiplier));
|
||||
}
|
||||
|
||||
&.tgico-calendarfilter:before {
|
||||
font-size: calc(36px / var(--multiplier));
|
||||
}
|
||||
|
||||
&:before {
|
||||
line-height: inherit !important;
|
||||
}
|
||||
|
@ -191,6 +191,12 @@ $bubble-margin: .25rem;
|
||||
.checkbox-box-background {
|
||||
background-color: #61c642;
|
||||
}
|
||||
|
||||
.checkbox-box-check {
|
||||
use {
|
||||
stroke-width: 3.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
& > &-select-checkbox {
|
||||
|
@ -65,7 +65,7 @@
|
||||
stroke-linecap: round;
|
||||
stroke-dasharray: 24.19, 24.19;
|
||||
stroke-dashoffset: 0;
|
||||
transition: stroke-dasharray .1s .2s ease-in-out, visibility 0s .2s;
|
||||
transition: stroke-dasharray .1s .15s ease-in-out, visibility 0s .15s;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -208,7 +208,7 @@
|
||||
}
|
||||
|
||||
.checkbox-box-background {
|
||||
transition: transform .2s .1s ease-in-out;
|
||||
transition: transform .2s .05s ease-in-out;
|
||||
transform: scale(0);
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user