Fix: Compatibility - -moz-box, -moz-inline-box to flex, inline-flex #696

This commit is contained in:
alstjr7375 2023-04-27 16:14:11 +09:00
parent 0fd4efedb6
commit fea9d8cb11
20 changed files with 64 additions and 23 deletions

24
css/leptonChrome.css generated
View file

@ -2019,6 +2019,7 @@
font-weight: 600 !important;
}
dropmarker {
display: flex !important;
display: -moz-box !important;
appearance: none !important;
width: 12px !important;
@ -2198,6 +2199,7 @@
font-size: inherit !important;
}
xul|menulist::part(dropmarker) {
display: flex;
display: -moz-box;
margin-block: 6px !important;
}
@ -2211,6 +2213,7 @@
display: none !important;
}
xul|menulist::part(dropmarker) {
display: flex !important;
display: -moz-box !important;
margin-block: 1px !important;
}
@ -3049,6 +3052,7 @@
will-change: margin-inline-start, opacity, visibility;
}
#sidebar-box[hidden="true"] {
display: flex !important;
display: -moz-box !important;
margin-inline-start: -18em;
opacity: 0;
@ -5956,6 +5960,7 @@
:root:not([tabsintitlebar="true"])
#tabbrowser-tabs[hasadjacentnewtabbutton]:not([overflow="true"])
~ #new-tab-button {
display: flex !important;
display: -moz-box !important;
}
}
@ -6011,6 +6016,7 @@
> #tabbrowser-arrowscrollbox
> #tabbrowser-arrowscrollbox-periphery
> #tabs-newtab-button {
display: flex !important;
display: -moz-box !important;
}
#alltabs-button,
@ -6590,6 +6596,7 @@
}
@supports -moz-bool-pref("userChrome.tab.photon_like_contextline") {
.tab-context-line {
display: inline-flex !important;
display: -moz-inline-box !important;
height: 2px !important;
border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important;
@ -7173,6 +7180,7 @@
> .tab-stack
> .tab-content
> .tab-close-button:not([selected="true"]) {
display: inline-flex !important;
display: -moz-inline-box !important;
}
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([visuallyselected]) .tab-close-button {
@ -7260,6 +7268,7 @@
}
.tabbrowser-tab[pinned][visuallyselected]:not([style*="transform: translateX"]):hover:not([busy])
.tab-close-button {
display: flex !important;
display: -moz-box !important;
order: -1 !important;
-moz-box-ordinal-group: 0 !important;
@ -7279,6 +7288,7 @@
}
@supports -moz-bool-pref("userChrome.tab.close_button_at_pinned.always") {
.tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-close-button {
display: flex !important;
display: -moz-box !important;
order: -1 !important;
-moz-box-ordinal-group: 0 !important;
@ -7299,6 +7309,7 @@
}
@supports -moz-bool-pref("userChrome.tab.close_button_at_pinned.background") {
.tabbrowser-tab[pinned]:not([style*="transform: translateX"]):hover:not([busy]) .tab-close-button {
display: flex !important;
display: -moz-box !important;
order: -1 !important;
-moz-box-ordinal-group: 0 !important;
@ -7327,6 +7338,7 @@
/** Clipped tabs - Always show tab icon ***************************************/
@supports -moz-bool-pref("userChrome.tab.always_show_tab_icon") {
.tab-icon-image:not([src], [pinned], [crashed], [busy]) {
display: inline-flex !important;
display: -moz-inline-box !important;
}
}
@ -7342,6 +7354,7 @@
/*= Sound Tab - Show Label ===================================================*/
@supports -moz-bool-pref("userChrome.tab.sound_show_label") {
.tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]) {
display: flex !important;
display: -moz-box !important;
}
}
@ -7519,6 +7532,7 @@
}
.tabbrowser-tab[pictureinpicture]:not([pinned]) .tab-content::after {
/* Shape */
display: inline-flex !important;
display: -moz-inline-box !important;
width: 14px;
height: 14px;
@ -8718,6 +8732,7 @@
counter-reset: bookmark-counts 0;
}
menupopup[placespopup="true"] > menu.bookmark-item::after {
display: inline-flex;
display: -moz-inline-box;
content: "(" counter(bookmark-counts) ")";
}
@ -8754,6 +8769,7 @@
}
findbar::before {
content: "";
display: flex;
display: -moz-box;
position: absolute;
flex: 200;
@ -8779,6 +8795,7 @@
margin: 0 !important;
}
.findbar-container > .findbar-find-status {
display: flex;
display: -moz-box;
overflow: hidden;
text-overflow: ellipsis;
@ -9952,6 +9969,7 @@
list-style-image: url("chrome://global/skin/icons/delete.svg") !important;
}
#clearDownloadsButton > .toolbarbutton-icon {
display: inline-flex !important;
display: -moz-inline-box !important;
margin-top: 0;
margin-bottom: 0;
@ -10029,6 +10047,7 @@
}
#appMenu-multiView .subviewbutton::before,
#appMenu-proton-update-banner::before {
display: inline-flex;
display: -moz-inline-box;
margin-inline-end: var(--arrowpanel-menuicon-padding);
width: 16px;
@ -10081,6 +10100,7 @@
}
/*= Panel - Main =============================================================*/
#appMenu-proton-addon-banners > .addon-banner-item > .toolbarbutton-icon {
display: inline-flex !important;
display: -moz-inline-box !important;
margin-inline-start: var(--arrowpanel-menuicon-padding);
order: -1 !important;
@ -10206,6 +10226,7 @@
/* Default */
#fxa-manage-account-button::before {
content: "";
display: inline-flex;
display: -moz-inline-box;
width: 32px !important;
height: 32px !important;
@ -10271,6 +10292,7 @@
/* Change Separator */
#PanelUI-fxa-menu::before {
content: "";
display: flex;
display: -moz-box;
border-bottom: 1px solid var(--panel-separator-color);
margin: var(--panel-separator-margin);
@ -10424,6 +10446,7 @@
list-style-image: url("chrome://browser/skin/downloads/downloads.svg");
}
#downloadsHistory .box-inherit.button-box {
display: inline-flex !important;
display: -moz-inline-box !important;
}
/*= Toolbar - Overflow Menu ==================================================*/
@ -10468,6 +10491,7 @@
list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg") !important;
}
#BMB_bookmarksShowAllTop > .menu-iconic-left {
display: flex !important;
display: -moz-box !important;
}
}

2
css/leptonContent.css generated
View file

@ -410,6 +410,7 @@
}
#contentSearchSettingsButton::before {
content: url("chrome://global/skin/icons/settings.svg") !important;
display: inline-flex;
display: -moz-inline-box;
/* Color */
-moz-context-properties: fill, fill-opacity !important;
@ -2171,6 +2172,7 @@
list-style-image: url("chrome://global/skin/icons/delete.svg") !important;
}
#clearDownloadsButton > .toolbarbutton-icon {
display: inline-flex !important;
display: -moz-inline-box !important;
margin-top: 0;
margin-bottom: 0;

View file

@ -159,7 +159,7 @@
#contentSearchSettingsButton::before {
content: url("chrome://global/skin/icons/settings.svg") !important;
display: -moz-inline-box;
@include InlineBox;
/* Color */
-moz-context-properties: fill, fill-opacity !important;

View file

@ -2,7 +2,7 @@ menupopup[placespopup="true"] > menu.bookmark-item > .menu-right {
counter-reset: bookmark-counts 0;
}
menupopup[placespopup="true"] > menu.bookmark-item::after {
display: -moz-inline-box;
@include InlineBox;
content: "(" counter(bookmark-counts) ")";
}

View file

@ -115,7 +115,7 @@ xul|search-textbox.tabsFilter,
will-change: margin-inline-start, opacity, visibility;
&[hidden="true"] {
display: -moz-box !important;
@include Box(true);
margin-inline-start: -18em;
opacity: 0;
visibility: collapse;

View file

@ -1,6 +1,6 @@
/*= Panel - Main =============================================================*/
#appMenu-proton-addon-banners > .addon-banner-item > .toolbarbutton-icon {
display: -moz-inline-box !important;
@include InlineBox(true);
margin-inline-start: var(--arrowpanel-menuicon-padding);
@include BoxOrder(0, true);
}
@ -133,7 +133,7 @@
/* Default */
#fxa-manage-account-button::before {
content: "";
display: -moz-inline-box;
@include InlineBox;
width: 32px !important;
height: 32px !important;
border-radius: 50%;
@ -199,7 +199,7 @@
/* Change Separator */
#PanelUI-fxa-menu::before {
content: "";
display: -moz-box;
@include Box;
border-bottom: 1px solid var(--panel-separator-color);
margin: var(--panel-separator-margin);
padding: 0;
@ -362,7 +362,7 @@ panelMenuBookmarkThisPage[starred] {
list-style-image: url("chrome://browser/skin/downloads/downloads.svg");
}
#downloadsHistory .box-inherit.button-box {
display: -moz-inline-box !important;
@include InlineBox(true);
}
/*= Toolbar - Overflow Menu ==================================================*/
@ -412,7 +412,7 @@ panelMenuBookmarkThisPage[starred] {
list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg") !important;
}
#BMB_bookmarksShowAllTop > .menu-iconic-left {
display: -moz-box !important;
@include Box(true);
}
}

View file

@ -44,7 +44,7 @@
#appMenu-multiView .subviewbutton::before,
#appMenu-proton-update-banner::before {
display: -moz-inline-box;
@include InlineBox;
margin-inline-end: var(--arrowpanel-menuicon-padding);
width: 16px;
height: 16px;

View file

@ -4,6 +4,7 @@
@use "utils/accent_color" as *;
@use "utils/native_menu" as *;
@use "utils/moz_document" as *;
@use "utils/moz_box" as *;
@use "utils/proton_elements" as Proton;
@use "sass:selector";

View file

@ -24,7 +24,7 @@
list-style-image: url("chrome://global/skin/icons/delete.svg") !important;
}
#clearDownloadsButton > .toolbarbutton-icon {
display: -moz-inline-box !important;
@include InlineBox(true);
margin-top: 0;
margin-bottom: 0;
margin-inline-start: 0;

View file

@ -27,7 +27,7 @@ findbar {
&::before {
content:"";
display: -moz-box;
@include Box;
position: absolute;
@include BoxFlex(200);
}
@ -52,7 +52,7 @@ findbar {
margin: 0 !important;
}
> .findbar-find-status {
display: -moz-box;
@include Box;
overflow: hidden;
text-overflow: ellipsis;
@include BoxFlex(1);

View file

@ -4,7 +4,7 @@
}
.tabbrowser-tab[pictureinpicture]:not([pinned]) .tab-content::after {
/* Shape */
display: -moz-inline-box !important;
@include InlineBox(true);
width: 14px;
height: 14px;
background-size: 14px;

View file

@ -1,3 +1,3 @@
.tab-icon-image:not([src], [pinned], [crashed], [busy]) {
display: -moz-inline-box !important;
@include InlineBox(true);
}

View file

@ -11,7 +11,7 @@
//-- Mixin ---------------------------------------------------------------------
@mixin pinnedCloseButtonShow($prefix: "") {
#{$prefix}:not([busy]) .tab-close-button {
display: -moz-box !important;
@include Box(true);
@include BoxOrder(0, true);
/* Looks like hover */

View file

@ -24,7 +24,7 @@
> .tab-stack
> .tab-content
> .tab-close-button:not([selected="true"]) {
display: -moz-inline-box !important;
@include InlineBox(true);
}
@include _closeButtonAtHover;

View file

@ -1,5 +1,5 @@
.tab-context-line {
display: -moz-inline-box !important;
@include InlineBox(true);
height: 2px !important;
border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important;
}

View file

@ -1,3 +1,3 @@
.tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]){
display: -moz-box !important;
@include Box(true);
}

View file

@ -82,6 +82,6 @@ spacer:is([part="overflow-start-indicator"], [part="overflow-end-indicator"]),
@include Option("browser.tabs.tabmanager.enabled") {
:root:not([tabsintitlebar="true"]) #tabbrowser-tabs:not([overflow="true"], [hashiddentabs]) ~ #alltabs-button,
:root:not([tabsintitlebar="true"]) #tabbrowser-tabs[hasadjacentnewtabbutton]:not([overflow="true"]) ~ #new-tab-button {
display: -moz-box !important;
@include Box(true);
}
}

View file

@ -65,7 +65,7 @@ See the above repository for updates as well as full license text. */
margin-bottom: 0 !important;
}
#tabbrowser-tabs[hasadjacentnewtabbutton][overflow="true"] > #tabbrowser-arrowscrollbox > #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
display: -moz-box !important;
@include Box(true);
}
#alltabs-button,

View file

@ -284,7 +284,7 @@
}
dropmarker {
display: -moz-box !important;
@include Box(true);
appearance: none !important;
width: 12px !important;
height: 12px !important;
@ -486,7 +486,7 @@
font-size: inherit !important;
}
xul|menulist::part(dropmarker) {
display: -moz-box;
@include Box;
margin-block: 6px !important;
}
xul|menulist:-moz-focusring::part(label-box) {
@ -501,7 +501,7 @@
}
xul|menulist::part(dropmarker) {
display: -moz-box !important;
@include Box(true);
margin-block: 1px !important;
}

View file

@ -110,3 +110,17 @@
-moz-box-direction: reverse $important;
}
}
@mixin Box($important: false) {
$important: _important($important);
display: flex $important;
display: -moz-box $important;
}
@mixin InlineBox($important: false) {
$important: _important($important);
display: inline-flex $important;
display: -moz-inline-box $important;
}