reduce transitions by fixing the state when previous sibling is hovered
This commit is contained in:
parent
344b068c4f
commit
6c3f2db5f4
1 changed files with 17 additions and 6 deletions
|
@ -2,26 +2,37 @@
|
||||||
|
|
||||||
/* Create a placeholder for buttons */
|
/* Create a placeholder for buttons */
|
||||||
toolbar .toolbarbutton-1:not([open]),
|
toolbar .toolbarbutton-1:not([open]),
|
||||||
.titlebar-button{
|
.titlebar-button,
|
||||||
|
#tabbrowser-tabs toolbarbutton{
|
||||||
background-image: radial-gradient(circle at center, var(--lwt-toolbarbutton-icon-fill) 0,var(--lwt-toolbarbutton-icon-fill) 10%,transparent 15% );
|
background-image: radial-gradient(circle at center, var(--lwt-toolbarbutton-icon-fill) 0,var(--lwt-toolbarbutton-icon-fill) 10%,transparent 15% );
|
||||||
}
|
}
|
||||||
/* Hide placeholder on hover */
|
/* Hide placeholder on hover */
|
||||||
toolbar:hover .toolbarbutton-1,.titlebar-buttonbox:hover > .titlebar-button{ background-image: none }
|
toolbar:hover + toolbar .toolbarbutton-1,
|
||||||
|
vbox:hover + toolbar .toolbarbutton-1,
|
||||||
|
toolbar:hover .toolbarbutton-1,
|
||||||
|
#tabbrowser-tabs:hover toolbarbutton,
|
||||||
|
.titlebar-buttonbox:hover > .titlebar-button{ background-image: none }
|
||||||
|
|
||||||
|
|
||||||
toolbar .toolbarbutton-1 > *,
|
toolbar .toolbarbutton-1 > *,
|
||||||
.titlebar-button > *{
|
.titlebar-button > *,
|
||||||
|
#tabbrowser-tabs toolbarbutton > *{
|
||||||
transform: scale(0);
|
transform: scale(0);
|
||||||
transition: transform 82ms linear !important;
|
transition: transform 82ms linear !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toolbar:hover + toolbar .toolbarbutton-1 > *,
|
||||||
|
vbox:hover + toolbar .toolbarbutton-1 > *,
|
||||||
toolbar:hover .toolbarbutton-1 > *,
|
toolbar:hover .toolbarbutton-1 > *,
|
||||||
.toolbarbutton-1[open] > *,
|
.toolbarbutton-1[open] > *,
|
||||||
.titlebar-buttonbox:hover > .titlebar-button > *{
|
.titlebar-buttonbox:hover > .titlebar-button > *,
|
||||||
|
#tabbrowser-tabs:hover toolbarbutton > *{
|
||||||
transform: scale(1)
|
transform: scale(1)
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Urlbar icons, this way they show colors is applicable */
|
/* Urlbar icons, this way they show colors is applicable */
|
||||||
.urlbar-icon{ transition: transform 82ms linear !important; }
|
.urlbar-icon{ transition: transform 82ms linear !important; }
|
||||||
#urlbar:not(:hover) .urlbar-icon{ transform: scale(0.3) }
|
#urlbar:not(:hover) .urlbar-icon:not([open]){ transform: scale(0.3) }
|
||||||
|
|
||||||
/* The menu button has some margin on non-compact density which creates annnoying transitions */
|
/* The menu button has some margin on non-compact density which creates annnoying transitions */
|
||||||
/* Lets remove that as well as border since this is minimal style anyway */
|
/* Lets remove that as well as border since this is minimal style anyway */
|
||||||
|
|
Loading…
Reference in a new issue