12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 |
- /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/minimal_toolbarbuttons.css made available under Mozilla Public License v. 2.0
- See the above repository for updates as well as full license text. */
- /* Create a circular placeholder for toolbarbutton and downscale to hide them */
- /* Create a placeholder for buttons */
- toolbar .toolbarbutton-1:not([open]),
- .titlebar-button,
- #tabbrowser-tabs toolbarbutton,
- #scrollbutton-up:not(:hover),
- #scrollbutton-down:not(:hover){
- background-image: radial-gradient(circle at center, var(--toolbarbutton-icon-fill,currentColor) 0,var(--toolbarbutton-icon-fill,currentColor) 10%,transparent 15% );
- }
- /* Hide placeholder on hover */
- 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 > *,
- .titlebar-button > *,
- #tabbrowser-tabs toolbarbutton > *{
- transform: scale(0);
- transition: transform 82ms linear !important;
- }
- #scrollbutton-up > .toolbarbutton-icon,
- #scrollbutton-down > .toolbarbutton-icon{ transform: scale(0) !important; transition: transform 82ms linear !important; }
- toolbar:hover + toolbar .toolbarbutton-1 > *,
- vbox:hover + toolbar .toolbarbutton-1 > *,
- toolbar:hover .toolbarbutton-1 > *,
- .toolbarbutton-1[open] > *,
- .titlebar-buttonbox:hover > .titlebar-button > *,
- #tabbrowser-tabs:hover toolbarbutton > *{
- transform: scale(1)
- }
- #scrollbutton-up:hover > .toolbarbutton-icon{ transform: scale(1) !important }
- #scrollbutton-down:hover > .toolbarbutton-icon{ transform: scale(-1) !important }
- /* 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; }
- /* Add a glow-effect to some buttons when it has some "alert" */
- #nav-bar:not(:hover) > #PanelUI-button > #PanelUI-menu-button[badge-status],
- #navigator-toolbox:not(:hover) #downloads-button[attention]{
- filter: brightness(2) drop-shadow(0 0 3px orange) drop-shadow(0 0 1px orange);
- }
- #nav-bar:not(:hover) > #PanelUI-button > #PanelUI-menu-button[badge-status^="update"],
- #navigator-toolbox:not(:hover) #downloads-button[attention="success"]{
- filter: brightness(2) drop-shadow(0 0 2px cyan) drop-shadow(0 0 1px cyan);
- }
|