mirror of
https://github.com/black7375/Firefox-UI-Fix.git
synced 2026-02-20 07:01:13 -08:00
Clean: Combined -> URL Bar
This commit is contained in:
parent
09285cc1aa
commit
bc39e2bcfe
8 changed files with 150 additions and 148 deletions
|
|
@ -1,77 +0,0 @@
|
|||
#nav-bar {
|
||||
--uc-backbutton-background: var(--toolbarbutton-hover-background, hsla(0,100%,100%,.5));
|
||||
--uc-backbutton-hover-background: var(--toolbarbutton-active-background);
|
||||
--uc-backbutton-active-background: color-mix(in srgb, currentColor 20%, transparent);
|
||||
}
|
||||
|
||||
#nav-bar-customization-target > {
|
||||
#urlbar-container {
|
||||
/* var(--urlbar-margin-inline) */
|
||||
margin-inline-start: calc(-1 * var(--uc-toolbarbutton-size)) !important;
|
||||
|
||||
> #urlbar:not([breakout][breakout-extend]) {
|
||||
padding-left: var(--uc-toolbarbutton-size);
|
||||
}
|
||||
}
|
||||
|
||||
#forward-button {
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
|
||||
margin-inline-start: calc(-1 * var(--uc-toolbarbutton-boundary) + 1px) !important;
|
||||
padding-inline-end: 0px !important; /* Original: var(--toolbarbutton-outer-padding) */
|
||||
|
||||
> .toolbarbutton-icon {
|
||||
padding-inline-end: var(--urlbar-icon-padding) !important; /* Original: var(--toolbarbutton-inner-padding) */
|
||||
padding-block: var(--urlbar-icon-padding) !important;
|
||||
height: var(--uc-urlbar-icon-size) !important;
|
||||
}
|
||||
}
|
||||
|
||||
#back-button {
|
||||
position: relative;
|
||||
|
||||
z-index: 3 !important;
|
||||
background-color: var(--toolbar-bgcolor) !important;
|
||||
background-clip: content-box !important;
|
||||
border-radius: 100%;
|
||||
|
||||
padding-block: 0 !important;
|
||||
padding-inline-end: 0 !important;
|
||||
|
||||
> menupopup {
|
||||
margin-top: -1px !important;
|
||||
}
|
||||
|
||||
> .toolbarbutton-icon {
|
||||
background-color: var(--uc-backbutton-background);
|
||||
background-origin: padding-box;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid var(--uc-backbutton-border-color);
|
||||
border-radius: 10000px !important;
|
||||
|
||||
padding-inline-end: var(--urlbar-icon-padding) !important;
|
||||
height: auto !important
|
||||
}
|
||||
|
||||
&:not([disabled], [open]):hover > .toolbarbutton-icon {
|
||||
background-color: var(--uc-backbutton-hover-background) !important;
|
||||
box-shadow: 0 1px 6px hsla(0,0%,0%,.1);
|
||||
border-color: hsla(240,5%,5%,.35);
|
||||
}
|
||||
&[open] > .toolbarbutton-icon,
|
||||
&:not([disabled]):hover:active > .toolbarbutton-icon {
|
||||
background-color: var(--uc-backbutton-active-background) !important;
|
||||
border-color: hsla(240,5%,5%,.40);
|
||||
}
|
||||
|
||||
&[disabled="true"] {
|
||||
opacity: 1 !important; /* Original: 0.4 */
|
||||
|
||||
> .toolbarbutton-icon {
|
||||
background-color: color-mix(in srgb, var(--toolbarbutton-hover-background), var(--toolbar-field-background-color) 40%) !important;
|
||||
fill: color-mix(in srgb, var(--toolbarbutton-icon-fill), transparent 60%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
// Init
|
||||
@include Option("userChrome.combined.urlbar_with_reload", "userChrome.combined.urlbar_with_back_forward") {
|
||||
#nav-bar {
|
||||
--uc-toolbarbutton-boundary: calc(var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding));
|
||||
--uc-toolbarbutton-padding: calc(2 * var(--uc-toolbarbutton-boundary));
|
||||
--uc-toolbarbutton-size: calc(12px + var(--uc-toolbarbutton-padding));
|
||||
|
||||
--uc-urlbar-icon-size: calc(16px + 2 * var(--urlbar-icon-padding));
|
||||
}
|
||||
|
||||
#nav-bar-customization-target > * {
|
||||
-moz-box-ordinal-group: 1;
|
||||
}
|
||||
// Preserve
|
||||
// `back` -> 2
|
||||
// `home` -> 3
|
||||
// `forward` -> 4
|
||||
#nav-bar-customization-target > #urlbar-container {
|
||||
-moz-box-ordinal-group: 5;
|
||||
}
|
||||
// `reload` -> 6
|
||||
#nav-bar-customization-target > #urlbar-container ~ * {
|
||||
-moz-box-ordinal-group: 7;
|
||||
}
|
||||
}
|
||||
|
||||
@include Option("userChrome.combined.urlbar_with_reload") {
|
||||
#nav-bar-customization-target > #stop-reload-button {
|
||||
-moz-box-ordinal-group: 6;
|
||||
}
|
||||
|
||||
@import "reload";
|
||||
}
|
||||
|
||||
@include Option("userChrome.combined.urlbar_with_back_forward") {
|
||||
#nav-bar-customization-target > #back-button {
|
||||
-moz-box-ordinal-group: 2;
|
||||
}
|
||||
#nav-bar-customization-target > #forward-button {
|
||||
-moz-box-ordinal-group: 4;
|
||||
}
|
||||
|
||||
@import "back_forward";
|
||||
}
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
// Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/reload_button_in_urlbar.css made available under Mozilla Public License v. 2.0
|
||||
// See the above repository for updates as well as full license text.
|
||||
#urlbar {
|
||||
padding-right: var(--uc-toolbarbutton-size);
|
||||
}
|
||||
|
||||
#nav-bar-customization-target > #stop-reload-button {
|
||||
z-index: 3;
|
||||
position: relative;
|
||||
|
||||
--toolbarbutton-hover-background: var(--urlbar-box-hover-bgcolor);
|
||||
color: var(--urlbar-box-hover-text-color) !important;
|
||||
|
||||
margin-left: calc( -1 * ( #{ 16px - 1px } + var(--urlbar-margin-inline) + var(--uc-toolbarbutton-padding)));
|
||||
}
|
||||
|
||||
#nav-bar-customization-target > #stop-reload-button > .toolbarbutton-1 > .toolbarbutton-icon {
|
||||
width: var(--uc-urlbar-icon-size) !important;
|
||||
height: var(--uc-urlbar-icon-size) !important;
|
||||
|
||||
padding: var(--urlbar-icon-padding) !important;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue