fliegerjohn/mobile-config-firefox
1
0
Fork 1
mirror of https://codeberg.org/claui/mobile-config-firefox.git synced 2025-11-04 12:35:55 +00:00
Code Issues Projects Releases Packages Wiki Activity

create a copy of minimal toolbarbuttons with slightly different behavior

Browse source
This commit is contained in:
MrOtherGuy 2019-05-01 07:56:13 +03:00
parent 6c3f2db5f4
commit acc7b44d12
1 changed files with 50 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

50
chrome/minimal_toolbarbuttons_v2.css Normal file
View file

@ -0,0 +1,50 @@
/* Create a circular placeholder for toolbarbutton and downscale to hide them */
/*
Difference to minimal_toolbarbuttons.css:
Applies some restrictions on what conditions the real icon is shown,
such as, nav-bar buttons are not shown when urlbar is hovered
*/
/* Create a placeholder for buttons */
#urlbar-container:hover ~ .toolbarbutton-1:not([open]),
#urlbar-container:hover ~ #stop-reload-button > .toolbarbutton-1,
#nav-bar > #nav-bar-customization-target:hover ~ toolbarbutton:not([open]),
#nav-bar > #nav-bar-customization-target:hover ~ toolbaritem:not([open]),
toolbar .toolbarbutton-1:not([open]),
.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% );
}
/* Hide placeholder on hover */
toolbar:hover .toolbarbutton-1,
.titlebar-buttonbox:hover > .titlebar-button,
#tabbrowser-tabs:hover toolbarbutton{ background-image: none }
#urlbar-container:hover ~ .toolbarbutton-1:not([open]) > *,
#urlbar-container:hover ~ #stop-reload-button > .toolbarbutton-1 > *,
#nav-bar > #nav-bar-customization-target:hover ~ toolbarbutton:not([open]) > *,
#nav-bar > #nav-bar-customization-target:hover ~ toolbaritem:not([open]) > *,
#titlebar:hover ~ toolbar .toolbarbutton-1 > *,
toolbar .toolbarbutton-1 > *,
#tabbrowser-tabs toolbarbutton > *,
.titlebar-button > *{
transform: scale(0);
transition: transform 82ms linear !important;
}
toolbar:hover .toolbarbutton-1:not(#PanelUI-menu-button) > *,
#nav-bar-overflow-button:hover + #PanelUI-button > .toolbarbutton-1 > stack,
#PanelUI-menu-button:hover > stack,
#tabbrowser-tabs:hover toolbarbutton > *,
.toolbarbutton-1[open] > *,
.titlebar-buttonbox:hover > .titlebar-button > *{
transform: scale(1)
}
/* Urlbar icons, this way they show colors is applicable */
.urlbar-icon{ transition: transform 82ms linear !important; }
#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 */
/* Lets remove that as well as border since this is minimal style anyway */
#PanelUI-button{ border-left: 0px !important; margin-left: 0px !important; }