mirror of
https://gitlab.winehq.org/wine/wine-gecko.git
synced 2024-09-13 09:24:08 -07:00
Bug 1185362 - Fix and consolidate margin and padding styling around the identity block. r=paolo
This commit is contained in:
parent
ea36f00dd7
commit
325f491709
@ -19,6 +19,8 @@
|
||||
%define conditionalForwardWithUrlbarWidth 30
|
||||
|
||||
:root {
|
||||
--backbutton-urlbar-overlap: 5px;
|
||||
|
||||
--toolbarbutton-hover-background: hsla(0,0%,100%,.3) linear-gradient(hsla(0,0%,100%,.7), hsla(0,0%,100%,.2));
|
||||
--toolbarbutton-hover-boxshadow: 0 1px 0 hsla(0,0%,100%,.3) inset, 0 0 0 1px hsla(0,0%,100%,.2) inset, 0 1px 0 hsla(0,0%,0%,.03);
|
||||
--toolbarbutton-hover-bordercolor: rgb(154,154,154);
|
||||
@ -846,7 +848,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
#urlbar,
|
||||
.searchbar-textbox {
|
||||
-moz-appearance: none;
|
||||
padding: 1px;
|
||||
padding: 0;
|
||||
border: 1px solid ThreeDShadow;
|
||||
border-radius: 2px;
|
||||
margin: 0 3px;
|
||||
@ -895,7 +897,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
|
||||
@conditionalForwardWithUrlbar@ {
|
||||
clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");
|
||||
-moz-margin-start: -5px;
|
||||
margin-inline-start: calc(-1 * var(--backbutton-urlbar-overlap));
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:-moz-locale-dir(rtl),
|
||||
@ -973,14 +975,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
|
||||
/* identity box */
|
||||
|
||||
#identity-box {
|
||||
margin: -1px;
|
||||
-moz-margin-end: 4px;
|
||||
padding: 2px;
|
||||
-moz-padding-end: 1px;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
#identity-box:-moz-locale-dir(ltr) {
|
||||
border-top-left-radius: 1.5px;
|
||||
border-bottom-left-radius: 1.5px;
|
||||
@ -991,42 +985,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
border-bottom-right-radius: 1.5px;
|
||||
}
|
||||
|
||||
#notification-popup-box:not([hidden]) + #identity-box {
|
||||
-moz-padding-start: 10px;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #urlbar > #identity-box {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not([switchingtabs]) > #urlbar > #identity-box {
|
||||
transition: padding-left, padding-right;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box {
|
||||
/* forward button hiding is delayed when hovered */
|
||||
transition-delay: 100s;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
/* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
|
||||
padding-left: 5.01px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
/* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
|
||||
padding-right: 5.01px;
|
||||
}
|
||||
|
||||
#identity-box.verifiedIdentity:not(:-moz-lwtheme):not(:hover):not([open=true]) {
|
||||
background-color: var(--verified-identity-box-backgroundcolor);
|
||||
}
|
||||
@ -1036,20 +994,8 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
outline-offset: -3px;
|
||||
}
|
||||
|
||||
#identity-icon-labels {
|
||||
-moz-padding-start: 2px;
|
||||
-moz-padding-end: 5px;
|
||||
}
|
||||
|
||||
%include ../shared/identity-block/identity-block.inc.css
|
||||
|
||||
#page-proxy-favicon {
|
||||
margin-top: 1px;
|
||||
margin-bottom: 1px;
|
||||
-moz-margin-start: 3px;
|
||||
-moz-margin-end: 1px;
|
||||
}
|
||||
|
||||
%include ../shared/notification-icons.inc.css
|
||||
|
||||
.popup-notification-body[popupid="addon-progress"],
|
||||
@ -1065,8 +1011,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
/* Notification icon box */
|
||||
#notification-popup-box {
|
||||
border-radius: 2.5px 0 0 2.5px;
|
||||
margin-top: -1px;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
.notification-anchor-icon:-moz-focusring {
|
||||
|
@ -7,11 +7,6 @@
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
.searchbar-textbox {
|
||||
min-height: 22px;
|
||||
background-color: -moz-field;
|
||||
}
|
||||
|
||||
.autocomplete-textbox-container {
|
||||
-moz-box-align: stretch;
|
||||
}
|
||||
@ -81,6 +76,8 @@ menuitem[cmd="cmd_clearhistory"][disabled] {
|
||||
.searchbar-search-button {
|
||||
list-style-image: url("chrome://browser/skin/search-indicator.png");
|
||||
-moz-image-region: rect(0, 20px, 20px, 0);
|
||||
margin-top: 1px;
|
||||
margin-bottom: 1px;
|
||||
-moz-margin-start: 2px;
|
||||
}
|
||||
|
||||
|
@ -18,8 +18,10 @@
|
||||
|
||||
:root {
|
||||
--space-above-tabbar: 9px;
|
||||
|
||||
--tabs-toolbar-color: #333;
|
||||
|
||||
--backbutton-urlbar-overlap: 6px;
|
||||
|
||||
--toolbarbutton-hover-background: hsla(0,0%,100%,.1) linear-gradient(hsla(0,0%,100%,.3), hsla(0,0%,100%,.1)) padding-box;
|
||||
--toolbarbutton-hover-bordercolor: hsla(0,0%,0%,.2);
|
||||
--toolbarbutton-hover-boxshadow: 0 1px 0 hsla(0,0%,100%,.5),
|
||||
@ -1633,7 +1635,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
|
||||
@conditionalForwardWithUrlbar@ {
|
||||
clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");
|
||||
-moz-margin-start: -6px;
|
||||
margin-inline-start: calc(-1 * var(--backbutton-urlbar-overlap));
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:-moz-locale-dir(rtl),
|
||||
@ -1646,24 +1648,19 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
-moz-box-direction: reverse;
|
||||
}
|
||||
|
||||
#identity-box {
|
||||
margin: 0;
|
||||
-moz-margin-end: 3px;
|
||||
padding: 1px 4px;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
#urlbar:not([focused="true"]) > #identity-box {
|
||||
margin: -1px 0;
|
||||
-moz-margin-end: 3px;
|
||||
padding: 2px 4px;
|
||||
margin-top: -1px;
|
||||
margin-bottom: -1px;
|
||||
padding-top: 3px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
|
||||
@media (-moz-mac-yosemite-theme) {
|
||||
#urlbar:not([focused="true"]):not(:-moz-window-inactive) > #identity-box {
|
||||
margin: -2px 0;
|
||||
-moz-margin-end: 3px;
|
||||
padding: 3px 4px;
|
||||
margin-top: -2px;
|
||||
margin-bottom: -2px;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
#identity-box {
|
||||
--identity-box-selected-background-color: rgb(240,237,237);
|
||||
@ -1680,40 +1677,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
border-bottom-right-radius: 2px;
|
||||
}
|
||||
|
||||
#notification-popup-box:not([hidden]) + #identity-box {
|
||||
-moz-padding-start: 10px !important;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #urlbar > #identity-box {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not([switchingtabs]) > #urlbar > #identity-box {
|
||||
transition: padding-left, padding-right;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box {
|
||||
/* forward button hiding is delayed when hovered */
|
||||
transition-delay: 100s;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
padding-left: 10.01px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
padding-right: 10.01px;
|
||||
}
|
||||
|
||||
#identity-box:-moz-focusring {
|
||||
box-shadow: 0 0 2px 1px -moz-mac-focusring inset,
|
||||
0 0 2px 2px -moz-mac-focusring;
|
||||
@ -1721,10 +1684,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
-moz-padding-end: 5px;
|
||||
}
|
||||
|
||||
#identity-icon-labels {
|
||||
-moz-margin-start: 4px;
|
||||
}
|
||||
|
||||
.urlbar-input-box {
|
||||
-moz-margin-start: 0;
|
||||
padding: 3px 0 2px;
|
||||
@ -1807,11 +1766,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
|
||||
%include ../shared/identity-block/identity-block.inc.css
|
||||
|
||||
#page-proxy-favicon {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
#wrapper-urlbar-container[place="palette"] {
|
||||
max-width: 20em;
|
||||
}
|
||||
|
@ -48,6 +48,9 @@
|
||||
background-size: 1px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: var(--identity-box-background-image);
|
||||
font-size: .9em;
|
||||
padding: 2px 5px;
|
||||
margin-inline-end: 4px;
|
||||
}
|
||||
|
||||
#identity-box:-moz-locale-dir(rtl) {
|
||||
@ -69,11 +72,52 @@
|
||||
background-image: var(--identity-box-chrome-background-image);
|
||||
}
|
||||
|
||||
#identity-icon-labels {
|
||||
padding-inline-start: 2px;
|
||||
}
|
||||
|
||||
#notification-popup-box:not([hidden]) + #identity-box {
|
||||
-moz-padding-start: 10px;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #urlbar > #identity-box {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not([switchingtabs]) > #urlbar > #identity-box {
|
||||
transition: padding-left, padding-right;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
padding-left: calc(var(--backbutton-urlbar-overlap) + 4px);
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
padding-right: calc(var(--backbutton-urlbar-overlap) + 4px);
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box {
|
||||
/* forward button hiding is delayed when hovered */
|
||||
transition-delay: 100s;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
/* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
|
||||
padding-left: calc(var(--backbutton-urlbar-overlap) + 4.01px);
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
/* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
|
||||
padding-right: calc(var(--backbutton-urlbar-overlap) + 4.01px);
|
||||
}
|
||||
|
||||
/* TRACKING PROTECTION ICON */
|
||||
|
||||
#tracking-protection-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-inline-end: 2px;
|
||||
list-style-image: url(chrome://browser/skin/tracking-protection-16.svg);
|
||||
}
|
||||
|
||||
|
@ -20,6 +20,8 @@
|
||||
:root {
|
||||
--space-above-tabbar: 15px;
|
||||
|
||||
--backbutton-urlbar-overlap: 5px;
|
||||
|
||||
--toolbarbutton-vertical-inner-padding: 2px;
|
||||
--toolbarbutton-vertical-outer-padding: 8px;
|
||||
|
||||
@ -1303,13 +1305,16 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba
|
||||
|
||||
@conditionalForwardWithUrlbar@ {
|
||||
clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");
|
||||
-moz-margin-start: -5px;
|
||||
margin-inline-start: calc(-1 * var(--backbutton-urlbar-overlap));
|
||||
}
|
||||
|
||||
@media (-moz-os-version: windows-win10) {
|
||||
@conditionalForwardWithUrlbar@ {
|
||||
clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path-win10");
|
||||
-moz-margin-start: -8px;
|
||||
}
|
||||
|
||||
:root {
|
||||
--backbutton-urlbar-overlap: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1419,12 +1424,6 @@ html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
|
||||
|
||||
/* identity box */
|
||||
|
||||
#identity-box {
|
||||
padding: 2px;
|
||||
font-size: .9em;
|
||||
-moz-margin-end: 4px;
|
||||
}
|
||||
|
||||
#identity-box:-moz-locale-dir(ltr) {
|
||||
border-top-left-radius: 1.5px;
|
||||
border-bottom-left-radius: 1.5px;
|
||||
@ -1435,42 +1434,6 @@ html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
|
||||
border-bottom-right-radius: 1.5px;
|
||||
}
|
||||
|
||||
#notification-popup-box:not([hidden]) + #identity-box {
|
||||
-moz-padding-start: 10px;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #urlbar > #identity-box {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not([switchingtabs]) > #urlbar > #identity-box {
|
||||
transition: padding-left, padding-right;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box {
|
||||
/* forward button hiding is delayed when hovered */
|
||||
transition-delay: 100s;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
|
||||
/* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
|
||||
padding-left: 5.01px;
|
||||
}
|
||||
|
||||
@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
|
||||
/* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
|
||||
padding-right: 5.01px;
|
||||
}
|
||||
|
||||
#identity-box.verifiedIdentity:not(:-moz-lwtheme):not(:hover):not([open=true]) {
|
||||
background-color: var(--verified-identity-box-backgroundcolor);
|
||||
}
|
||||
@ -1480,11 +1443,6 @@ html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
|
||||
outline-offset: -3px;
|
||||
}
|
||||
|
||||
#identity-icon-labels {
|
||||
-moz-padding-start: 2px;
|
||||
-moz-padding-end: 5px;
|
||||
}
|
||||
|
||||
/* Location bar dropmarker */
|
||||
|
||||
.urlbar-history-dropmarker {
|
||||
@ -1532,19 +1490,6 @@ html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
|
||||
|
||||
%include ../shared/identity-block/identity-block.inc.css
|
||||
|
||||
#page-proxy-favicon {
|
||||
margin-top: 1px;
|
||||
margin-bottom: 1px;
|
||||
-moz-margin-start: 3px;
|
||||
-moz-margin-end: 1px;
|
||||
}
|
||||
|
||||
@media (-moz-os-version: windows-win10) {
|
||||
#page-proxy-favicon {
|
||||
-moz-margin-start: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
/* autocomplete */
|
||||
|
||||
#treecolAutoCompleteImage {
|
||||
|
Loading…
Reference in New Issue
Block a user