Merge branch 'master' into photon-style

This commit is contained in:
alstjr7375 2021-08-25 10:37:22 +09:00
commit 930d134b58
6 changed files with 268 additions and 92 deletions

View file

@ -89,6 +89,10 @@ N: 7k5x
E: 7k5xlp0onfire@gmail.com
W: https://github.com/7k5x
N: Ajith-stark
E: ajith.kum.12342@gmail.com
W: https://github.com/Ajith-stark
N: badprogramshere
W: https://github.com/badprogramshere
@ -96,6 +100,10 @@ N: Burak Yigit Kaya
E: ben@byk.im
W: https://byk.im/
N: dr460nf1r3
E: njcrypted@protonmail.com
W: https://dr460nf1r3.me/
N: hellojaccc
E: kim@taekyeong.me
W: https://github.com/hellojaccc

3
icons/dismiss-filled.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="context-fill" fill-opacity="context-fill-opacity" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg">
<path d="M2.39705 2.55379L2.46967 2.46967C2.73594 2.2034 3.1526 2.1792 3.44621 2.39705L3.53033 2.46967L8 6.939L12.4697 2.46967C12.7626 2.17678 13.2374 2.17678 13.5303 2.46967C13.8232 2.76256 13.8232 3.23744 13.5303 3.53033L9.061 8L13.5303 12.4697C13.7966 12.7359 13.8208 13.1526 13.6029 13.4462L13.5303 13.5303C13.2641 13.7966 12.8474 13.8208 12.5538 13.6029L12.4697 13.5303L8 9.061L3.53033 13.5303C3.23744 13.8232 2.76256 13.8232 2.46967 13.5303C2.17678 13.2374 2.17678 12.7626 2.46967 12.4697L6.939 8L2.46967 3.53033C2.2034 3.26406 2.1792 2.8474 2.39705 2.55379L2.46967 2.46967L2.39705 2.55379Z"/>
</svg>

After

Width:  |  Height:  |  Size: 783 B

View file

@ -1,7 +1,7 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg data-name="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path fill="context-fill" fill-opacity="context-fill-opacity" d="M15.85 12.15l-3-3a0.49 0.49 0 0 0-0.7 0.7L14.29 12H9.5a0.5 0.5 0 0 0 0 1h4.79l-2.14 2.15a0.48 0.48 0 0 0 0 0.7 0.48 0.48 0 0 0 0.7 0l3-3a0.36 0.36 0 0 0 0.11-0.16 0.5 0.5 0 0 0 0-0.38 0.36 0.36 0 0 0-0.11-0.16z"/>
<path fill="context-fill" fill-opacity="context-fill-opacity" d="M13 1H3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h4a1 1 0 0 0 0-2H3a1 1 0 0 1-1-1V6h12v2a1 1 0 0 0 2 0V4a3 3 0 0 0-3-3zM2 5V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1z"/>
<svg data-name="icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="context-fill" fill-opacity="context-fill-opacity">
<path d="M15.85 12.15l-3-3a0.49 0.49 0 0 0-0.7 0.7L14.29 12H9.5a0.5 0.5 0 0 0 0 1h4.79l-2.14 2.15a0.48 0.48 0 0 0 0 0.7 0.48 0.48 0 0 0 0.7 0l3-3a0.36 0.36 0 0 0 0.11-0.16 0.5 0.5 0 0 0 0-0.38 0.36 0.36 0 0 0-0.11-0.16z"/>
<path d="M13 1H3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h4a1 1 0 0 0 0-2H3a1 1 0 0 1-1-1V6h12v2a1 1 0 0 0 2 0V4a3 3 0 0 0-3-3zM2 5V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1z"/>
</svg>

Before

Width:  |  Height:  |  Size: 796 B

After

Width:  |  Height:  |  Size: 763 B

Before After
Before After

View file

@ -1,7 +1,7 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16">
<path fill="context-fill" fill-opacity="context-fill-opacity" d="M 15.707 4.293 l -4 -4 a 1 1 0 0 0 -1.414 1.414 L 12.585 4 H 11 a 7.008 7.008 0 0 0 -7 7 a 1 1 0 0 0 2 0 a 5.006 5.006 0 0 1 5 -5 h 1.585 l -2.293 2.293 a 1 1 0 1 0 1.414 1.414 l 4 -4 a 1 1 0 0 0 0.001 -1.414 Z"/>
<path fill="context-fill" fill-opacity="context-fill-opacity" d="M 13 11 a 1 1 0 0 0 -1 1 v 1 a 1 1 0 0 1 -1 1 H 3 a 1 1 0 0 1 -1 -1 V 6 a 1 1 0 0 1 1 -1 h 1 a 1 1 0 0 0 0 -2 H 3 a 3 3 0 0 0 -3 3 v 7 a 3 3 0 0 0 3 3 h 8 a 3 3 0 0 0 3 -3 v -1 a 1 1 0 0 0 -1 -1 Z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity">
<path d="M8.25 10.375a.625.625 0 0 1-1.25 0l0-8.323-3.308 3.309a.626.626 0 0 1-.885-.885L7.285 0l.681 0 4.477 4.476a.626.626 0 0 1-.885.885L8.25 2.052l0 8.323z"/>
<path d="M12.25 15a2 2 0 0 0 2-2l0-1.375a.625.625 0 0 0-1.25 0l0 1.525-.6.6-9.55 0-.6-.6 0-1.525a.625.625 0 0 0-1.25 0L1 13a2 2 0 0 0 2 2l9.25 0z"/>
</svg>

Before

Width:  |  Height:  |  Size: 850 B

After

Width:  |  Height:  |  Size: 675 B

Before After
Before After

View file

@ -6,7 +6,7 @@
}
@media not all and ((-moz-os-version: windows-win7) or (-moz-os-version: windows-win8)) { /* Level 4 */
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox {
background-color: var(--lwt-accent-color);
background-color: var(--lwt-accent-color) !important;
}
}
@ -23,6 +23,26 @@
border-radius: 4px;
}
/*= Identity Poup Icon Crop ================================================*/
.identity-popup-security-connection.identity-button {
padding-block: 1px;
}
/*= Zoom in button's plus icon horizontal rate =============================*/
#customization-palette-container #zoom-in-button > .toolbarbutton-icon,
#customization-panel-container #zoom-in-button > .toolbarbutton-icon,
#widget-overflow-mainView #zoom-in-button > .toolbarbutton-icon {
padding-inline-start: 0px !important;
}
/*= Icon Fill Color ========================================================*/
:root:-moz-lwtheme {
/* Auto create --lwt-toolbarbutton-icon-fill-attention, fix for nightly default theme
Default Color: rgb(0,97,224) -> rgb(0, 120, 215) for more light
*/
--lwt-toolbarbutton-icon-fill-attention: var(--button-primary-bgcolor, rgb(0, 120, 215));
}
/*= Light Weight Theme =====================================================*/
/* Header Image */
:root[lwtheme-image] {
@ -294,13 +314,11 @@
--card-outline-color: var(--grey-60);
--dialog-warning-text-color: var(--red-40);
scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
}
}
/*== Menu color ===========================================================*/
menupopup {
html#main-window menupopup {
/* is same as toolbar color https://github.com/mozilla/gecko-dev/blob/master/toolkit/themes/windows/global/global.css#L17-L67 */
--menu-color: var(--arrowpanel-color, var(--in-content-page-color)) !important;
--menu-background-color: var(--arrowpanel-background, var(--in-content-button-background)) !important;
@ -312,23 +330,44 @@
--menuitem-disabled-hover-background-color: color-mix(in srgb, var(--menuitem-hover-background-color) 40%, transparent) !important;
}
@media not all and (-moz-gtk-csd-available) {
window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menupopup {
--panel-color: var(--lwt-sidebar-text-color, var(--menu-color)) !important;
--panel-background: var(--lwt-sidebar-background-color, var(--menu-background-color)) !important;
}
window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menu[_moz-menuactive="true"]:not([disabled="true"]),
window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menuitem[_moz-menuactive="true"]:not([disabled="true"]) {
--menuitem-hover-background-color: color-mix(in srgb, currentColor 17%, transparent); /* Looks like toolbar button */
/* or var(--lwt-sidebar-highlight-background-color)
If this value is used, unset is required in the default theme.
*/
}
}
/* Fallback background */
menupopup:not(.cui-widget-panel.cui-widget-panelview, [placespopup="true"]) {
background-color: var(--lwt-accent-color, var(--in-content-page-background)) !important;
}
/* Default theme color preservation */
:root[lwtheme-mozlightdark] menupopup {
--menu-color: var(--toolbar-color) !important;
--menu-background-color: var(--toolbar-bgcolor) !important;
:root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]) {
--menu-color: var(--toolbar-color, var(--in-content-page-color)) !important;
--arrowpanel-background: var(--toolbar-bgcolor, var(--in-content-button-background)) !important; /* --menu-background-color */
}
@media not all and (-moz-gtk-csd-available) {
window:is(#bookmarksPanel, #history-panel)[style*="--newtab-background-color: rgba(249, 249, 251, 1);"] menupopup, /* Default Light Mode */
window:is(#bookmarksPanel, #history-panel)[style*="--newtab-background-color: rgba(43, 42, 51, 1);"] menupopup { /* Default Dark Mode */
--panel-color: var(--menu-color) !important;
--panel-background: var(--menu-background-color) !important;
}
}
/* Fully Dark Mode **********************************************************/
/*= Remove White Flash =====================================================*/
#tabbrowser-tabbox,
#tabbrowser-tabpanels,
browser[type=content-primary],
browser[type=content] > html {
browser[type="content-primary"],
browser[type="content"] > html {
background: var(--in-content-page-background) !important;
}
@ -445,7 +484,7 @@
/*= Root - Reduce Padding ==================================================*/
:root {
/* Tab Bar */
--proton-tab-block-margin: 0px !important; /* Original: 4px */
--proton-tab-block-margin: 0px !important; /* Original: 4px, Legacy */
--tab-block-margin: 0px !important; /* New version of --proton-tab-block-margin */
--tab-border-radius: 0px !important; /* Original: 4px */
--inline-tab-padding: 6px !important; /* Original: 8px */
@ -457,7 +496,7 @@
--arrowpanel-padding: 0.8em !important; /* Original: 16px or .cui-widget-panel, .cui-widget-panel::part(arrowcontent) => 4px 0 */
}
:root[uidensity=compact] {
:root[uidensity="compact"] {
/* Tool Bar */
--toolbarbutton-outer-padding: 2px !important; /* Original: 3px, General is 2px */
@ -465,7 +504,7 @@
--arrowpanel-menuitem-padding: 3px !important; /* Original: 8px */
}
:root[uidensity=touch] {
:root[uidensity="touch"] {
/* Tab Bar - Like Original */
--proton-tab-block-margin: 4px !important; /* Original: 4px */
--tab-block-margin: 4px !important; /* New version of --proton-tab-block-margin */
@ -509,7 +548,7 @@
margin-inline-start: 0 !important;
}
:root:not([uidensity=touch]) #tabbrowser-arrowscrollbox {
:root:not([uidensity="touch"]) #tabbrowser-arrowscrollbox {
--scrollbtn-inner-padding: 1px;
--scrollbtn-outer-padding: 3px;
}
@ -522,7 +561,7 @@
padding-right: var(--scrollbtn-inner-padding, 4px) !important;
}
:root:not([uidensity=touch]) #new-tab-button, #alltabs-button {
:root:not([uidensity="touch"]) #new-tab-button, #alltabs-button {
--toolbarbutton-outer-padding: 1px; /* Original: 2px*/
}
@ -579,24 +618,24 @@
border-radius: var(--scrollbtn-border-radius, calc(var(--tab-border-radius) + 4px)) !important;
}
:root[tabsintitlebar]:not([uidensity=compact]) #toolbar-menubar[autohide="true"] {
:root[tabsintitlebar]:not([uidensity="compact"]) #toolbar-menubar[autohide="true"] {
height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size) - 2px); /* Compact: 28px, Normal: 33px, Touch: 38px */
}
/* Pinned Tab - Titlechanged Indicator position fix */
:root:not([uidensity=touch]) .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root:not([uidensity=touch]) .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
:root:not([uidensity="touch"]) .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root:not([uidensity="touch"]) .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
/* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */
background-position-y: bottom calc(4.5px + var(--tabs-navbar-shadow-size)) !important;
}
:root[uidensity=compact] .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root[uidensity=compact] .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
:root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root[uidensity="compact"] .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
/* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */
background-position-y: bottom calc(.5px + var(--tabs-navbar-shadow-size)) !important;
}
/*= URL Bar - Reduce Padding ===============================================*/
:root:not([uidensity=touch]) #urlbar-container, #search-container {
:root:not([uidensity="touch"]) #urlbar-container, #search-container {
padding-block: 2px; /* Original: 4px */
margin-inline: 5px; /* Original: 5px */
}
@ -605,19 +644,19 @@
:root:not([uidensity]) .urlbarView-row {
padding-block: 1px; /* Original: 2px */
}
:root[uidensity=compact] .urlbarView-row {
:root[uidensity="compact"] .urlbarView-row {
padding-block: 0px;
}
:root:not([uidensity]) #urlbar .search-one-offs:not([hidden]) {
padding-block: 8px; /* Original: 10px */
}
:root[uidensity=compact] #urlbar .search-one-offs:not([hidden]) {
:root[uidensity="compact"] #urlbar .search-one-offs:not([hidden]) {
padding-block: 2px;
}
/*= BookMark Bar - Reduce Height ===========================================*/
:root[uidensity=compact] #PersonalToolbar toolbarbutton {
:root[uidensity="compact"] #PersonalToolbar toolbarbutton {
margin-top: 0px; /* Original: 2px */
}
@ -625,10 +664,10 @@
:root:not([uidensity]) #tab-notification-deck {
--infobar-message-margin: 0 4px 3px;
}
:root[uidensity=compact] #tab-notification-deck {
:root[uidensity="compact"] #tab-notification-deck {
--infobar-message-margin: 0 4px 2px;
}
#tab-notification-deck notification-message[message-bar-type="infobar"] {
#tab-notification-deck notification-message[message-bar-type="infobar"]:not([style*="margin-top"]) {
margin: var(--infobar-message-margin, 0 4px 4px) !important;
}
@ -636,7 +675,7 @@
--infobar-vertical-margin: 7px;
--infobar-button-vertical-margin: 3px;
}
:root[uidensity=compact] notification-message[message-bar-type="infobar"] {
:root[uidensity="compact"] notification-message[message-bar-type="infobar"] {
--infobar-vertical-margin: 6px;
--infobar-button-vertical-margin: 2px;
}
@ -671,10 +710,10 @@
:root {
--menu-padding: 0.35em; /* Win7, 8: 0px */
}
:root[uidensity=compact] {
:root[uidensity="compact"] {
--menu-padding: 0.25em;
}
:root[uidensity=touch] {
:root[uidensity="touch"] {
--menu-padding: 0.5em;
}
menupopup > menuitem,
@ -687,26 +726,23 @@
}
@supports not -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
:root:not([uidensity=touch]) .menu-text, .menu-iconic-text {
:root:not([uidensity="touch"]) .menu-text,
:root:not([uidensity="touch"]) .menu-iconic-text {
padding-inline-end: 0 !important; /* Original: 2px */
}
:root:not([uidensity=touch]) .menupopup-arrowscrollbox {
:root:not([uidensity="touch"]) .menupopup-arrowscrollbox {
padding-block: 1px !important; /* Original: 4px*/
}
:root:not([uidensity=touch]) #context-navigation:not([hidden]) {
:root:not([uidensity="touch"]) #context-navigation:not([hidden]) {
padding: 0 0 1px !important; /* Original: 0 0 4px*/
}
:root:not([uidensity=touch]) .menu-right {
:root:not([uidensity="touch"]) .menu-right {
margin-right: 6px !important; /* Original: 12px */
}
}
/* Arrow Icon Align to Right */
.subviewbutton.subviewbutton-nav,
.bookmark-item.subviewbutton {
padding-inline-end: 0 !important;
}
.bookmark-item.subviewbutton {
.bookmark-item.subviewbutton > .menu-right {
margin-inline-end: 0 !important;
}
@ -715,8 +751,8 @@
--bookmark-menu-padding: 0.2em;
--bookmark-seperator-margin: 1px 0.5em;
}
:root[uidensity=compact] {
--bookmark-menu-padding: 2px;
:root[uidensity="compact"] {
--bookmark-menu-padding: 1px;
--bookmark-seperator-margin: 0px 0.5em;
}
@ -747,41 +783,40 @@
/** Popup panel - Compact mode */
/* Footer Button Height */
:root[uidensity=compact] .panel-footer.panel-footer-menulike > button {
:root[uidensity="compact"] .panel-footer.panel-footer-menulike > button {
padding: 3px 8px !important;
}
/* Footer Button Height */
:root[uidensity=compact] #protections-popup-trackersView-settings-button {
:root[uidensity="compact"] #protections-popup-trackersView-settings-button {
margin: 4px 8px 0 !important;
}
/* not cut off for Protection popup Footer on windows */
:root[uidensity=compact] #protections-popup-multiView #protections-popup-footer {
:root[uidensity="compact"] #protections-popup-multiView #protections-popup-footer {
padding: 3px 0 20px !important;
}
/* Button and disabed category in Protection popup */
:root[uidensity=compact] #protections-popup-multiView .protections-popup-footer-button,
:root[uidensity=compact] #protections-popup-multiView .protections-popup-category {
:root[uidensity="compact"] #protections-popup-multiView .protections-popup-footer-button,
:root[uidensity="compact"] #protections-popup-multiView .protections-popup-category {
height: 20px !important;
min-height: 20px !important;
}
/* Footer Button in Tracking Content Panel */
:root[uidensity=compact] #protections-popup-multiView .panel-footer.panel-footer-menulike {
:root[uidensity="compact"] #protections-popup-multiView .panel-footer.panel-footer-menulike {
margin: 0 0 3px !important;
}
/* Identity popup header padding */
:root[uidensity=compact] #identity-popup-multiView #identity-popup-mainView-panel-header {
:root[uidensity="compact"] #identity-popup-multiView #identity-popup-mainView-panel-header {
padding: 2px 5px !important;
}
/* Text When There is no trackers */
:root[uidensity=compact] #protections-popup-no-trackers-found-description {
:root[uidensity="compact"] #protections-popup-no-trackers-found-description {
margin: 2em 4em !important;
}
/* Download Item margin */
:root[uidensity=compact] #downloadsListBox {
:root[uidensity="compact"] #downloadsListBox {
margin: 0 !important;
}
/** Tab Bar - Connect to window *********************************************/
.tab-background {
border-radius: var(--tab-border-radius) var(--tab-border-radius) 0px 0px !important;
@ -849,6 +884,7 @@
border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important;
}
<<<<<<< HEAD
.tabbrowser-tab:is([selected], [multiselected]) .tab-context-line {
/* Photon like color
Default: var(--tab-line-color, rgb(10, 132, 255))
@ -871,6 +907,64 @@
}
.tabbrowser-tab:not([selected="true"], [multiselected]) .tab-context-line {
transition: transform 250ms var(--animation-easing-function), opacity 250ms var(--animation-easing-function) !important; /* --animation-easing-function: cubic-bezier(.07, .95, 0, 1); */
=======
/** Selected Tab - Bottom Rounded Corner ************************************/
#tabbrowser-tabs {
--tab-corner-rounding: 4px; /* 10px looks about like chromium - 17px looks close to Australis tabs */
--tab-corner-padding: 1px;
--tab-corner-position: calc(var(--tab-corner-padding) - var(--tab-corner-rounding));
}
:root:not([customizing="true"]) tab[visuallyselected] > stack::before,
:root:not([customizing="true"]) tab[visuallyselected] > stack::after {
/* Box */
display: block !important;
position: absolute !important;
z-index: 1 !important;
/* Shape */
width: var(--tab-corner-rounding) !important;
height: 100% !important;
/* Color */
fill: var(--toolbar-bgcolor) !important;
stroke: var(--tabs-border-color, transparent) !important;
-moz-context-properties: fill, stroke !important;
/* Image */
background-size: var(--tab-corner-rounding);
background-repeat: no-repeat;
background-position-y: bottom;
}
tab[visuallyselected] > stack::before {
left: var(--tab-corner-position) !important;
background-image: url(./icons/tab-bottom-corner-left.svg);
}
tab[visuallyselected] > stack::after {
left: auto;
right: var(--tab-corner-position);
background-image: url(./icons/tab-bottom-corner-right.svg);
}
@media (-moz-gtk-csd-available) {
/* Don't enabled at GTK */
:root:not([customizing="true"])[lwtheme="true"] tab[visuallyselected] > stack::before,
:root:not([customizing="true"])[lwtheme="true"] tab[visuallyselected] > stack::after {
content: "" !important;
}
}
@media not all and (-moz-gtk-csd-available) {
:root:not([customizing="true"]) tab[visuallyselected] > stack::before,
:root:not([customizing="true"]) tab[visuallyselected] > stack::after {
content: "" !important;
}
}
/** Unselected Tab - Divide line ********************************************/
#tabbrowser-arrowscrollbox {
position: absolute;
>>>>>>> master
}
/* Remove side's background color border */
@ -944,17 +1038,17 @@
}
/** Clipped tabs - Letters cleary *******************************************/
#tabbrowser-tabs[closebuttons=activetab] .tab-content:not([pinned]) {
#tabbrowser-tabs[closebuttons="activetab"] .tab-content:not([pinned]) {
padding-inline-start: 8px !important;
}
#tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="ltr"]:not([pinned]),
#tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(ltr):not([pinned]) {
#tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow][labeldirection="ltr"]:not([pinned]),
#tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(ltr):not([pinned]) {
mask-image: linear-gradient(to right, black 70%, transparent) !important;
}
#tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="rtl"]:not([pinned]),
#tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(rtl):not([pinned]) {
#tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow][labeldirection="rtl"]:not([pinned]),
#tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(rtl):not([pinned]) {
mask-image: linear-gradient(to left, black 70%, transparent) !important;
}
@ -963,10 +1057,36 @@
display: -moz-inline-box !important;
}
#tabbrowser-tabs[closebuttons=activetab] .tabbrowser-tab:not([visuallyselected], :hover) .tab-close-button {
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([visuallyselected], :hover) .tab-close-button {
visibility: collapse !important;
}
/* Closed Button's icon thicker */
.tabbrowser-tab .tab-content > .close-icon {
list-style-image: url(./icons/dismiss-filled.svg) !important;
}
/* Closed Button's icon larger */
.tab-close-button {
padding: 6px !important; /* Original: 7px */
}
.tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-close-button {
padding-inline-start: 1px !important; /* Original: 0px */
width: 19px !important; /* Original: 17px */
}
/* Closed Button's padding reduce */
#tabbrowser-tabs[closebuttons="activetab"] .tab-content > .tab-close-button {
margin-inline-end: calc((var(--inline-tab-padding) / -2) + 2px) !important; /* Original: calc(var(--inline-tab-padding) / -2)*/
padding: 4px !important; /* Original: 7px */
width: 20px !important; /* Original: 24px */
height: 20px !important; /* Original: 24px */
}
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-close-button {
padding-inline-start: 3px !important; /* Original: 0px */
width: 19px !important; /* Redefine from 19px !important, Original: 17px = (width - padding) */
}
/** Sound Tab - Hide Label **************************************************/
.tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]){
display: none !important;
@ -1133,8 +1253,8 @@
background-image: var(--dotted-identity-image), var(--dotted-identity-image), var(--dotted-identity-image) !important;
background-position-x: 32%, 50%, 70% !important;
}
:root[uidensity=compact] .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root[uidensity=compact] .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
:root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root[uidensity="compact"] .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
/* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */
background-position-x: 30%, 50%, 70% !important;
}
@ -1144,8 +1264,8 @@
.tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
background-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px) !important;
}
:root[uidensity=compact] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root[uidensity=compact] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
:root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root[uidensity="compact"] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
background-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px) !important;
}
@ -1190,8 +1310,8 @@
.toolbaritem-combined-buttons > .subviewbutton:not(.subviewbutton-iconic) > .toolbarbutton-text {
padding-inline-start: 0 !important;
}
#panelMenu_bookmarksMenu .subviewbutton[disabled=true] .toolbarbutton-text,
#appMenu_historyMenu .subviewbutton[disabled=true] .toolbarbutton-text {
#panelMenu_bookmarksMenu .subviewbutton[disabled="true"] .toolbarbutton-text,
#appMenu_historyMenu .subviewbutton[disabled="true"] .toolbarbutton-text {
padding-inline-start: var(--arrowpanel-menublank-padding) !important;
}
#appMenu-proton-update-banner .toolbarbutton-text {
@ -1202,8 +1322,8 @@
#appMenu-proton-update-banner::before {
display: -moz-inline-box;
margin-inline-end: var(--arrowpanel-menuicon-padding);
width: 16px !important;
height: 16px !important;
width: 16px;
height: 16px;
}
#appMenu-proton-update-banner {
margin-bottom: 2px !important;
@ -1221,7 +1341,7 @@
margin-inline-end: 0 !important;
}
.subviewbutton[type="checkbox"]:not([checked=true]) > .toolbarbutton-text {
.subviewbutton[type="checkbox"]:not([checked="true"]) > .toolbarbutton-text {
margin-left: 16px !important;
}
@ -1243,7 +1363,7 @@
stroke: var(--button-hover-bgcolor) !important;
}
.subviewbutton[disabled=true] > image {
.subviewbutton[disabled="true"] > image {
/* Ghost icons when disabled */
opacity: 0.4;
}
@ -1261,10 +1381,10 @@
#appMenu-fxa-status2::before { /* Don't exist img tag */
content: url(chrome://browser/skin/fxa/avatar-empty.svg);
}
#appMenu-fxa-status2:is([fxastatus=signedin], [fxastatus=unverified], [fxastatus=login-failed])::before {
#appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"])::before {
display: none;
}
#appMenu-fxa-status2:is([fxastatus=signedin], [fxastatus=unverified], [fxastatus=login-failed]) #appMenu-fxa-label2::before {
#appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"]) #appMenu-fxa-label2::before {
/* url("https://profile.accounts.firefox.com/v1/avatar/a") */
content: '';
border-radius: 50% !important;
@ -1321,8 +1441,14 @@
}
/* Default */
#fxa-menu-avatar {
display: -moz-inline-box !important;
#fxa-manage-account-button::before {
content: '';
display: -moz-inline-box;
width: 32px !important;
height: 32px !important;
border-radius: 50%;
background-size: 32px;
background-image: var(--avatar-image-url);
margin-inline-end: var(--arrowpanel-menuicon-padding);
}
@ -1368,10 +1494,12 @@
#PanelUI-sign-out-separator {
display: none;
}
.pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""] {
.pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""], /* Legacy */
.sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""] {
list-style-image: url(./icons/send-to-device.svg);
}
.pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) {
.pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]), /* Legacy */
.sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) {
list-style-image: url(chrome://global/skin/icons/settings.svg);
}
@ -1535,6 +1663,24 @@
--menuitem-image: url(chrome://browser/skin/bookmarks-toolbar.svg);
}
/*= identity-popup =========================================================*/
#identity-popup-clear-sitedata-button,
#identity-popup-more-info {
padding-inline: 5px !important;
}
#identity-popup-securityView-body {
margin-inline-start: 32px !important; /* Original: 10px */
}
#identity-popup-clear-sitedata-button {
list-style-image: url(./icons/broom.svg);
}
#identity-popup-more-info {
list-style-image: url(chrome://global/skin/icons/info.svg);
}
/** Context Menu - Icons ****************************************************/
/*= Layout =================================================================*/
menupopup menuitem:not([type="checkbox"], [type="radio"]),
@ -1605,7 +1751,6 @@
:root {
--context-menu-background-padding: 1em;
--menu-background-padding-default: calc(var(--context-menu-background-padding) + var(--context-menu-text-padding));
--bookmark-menu-margin: 2px;
}
:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
@ -1614,10 +1759,11 @@
padding-inline-start: var(--menu-background-padding-default) !important;
margin-left: 0 !important;
}
menupopup:is(#BMB_bookmarksPopup) > menuitem:not(.menuitem-iconic),
menupopup:is(#BMB_bookmarksPopup) > menu:not(.menu-iconic) {
padding-inline-start: calc(var(--menu-background-padding-default) - var(--bookmark-menu-margin)) !important;
margin-left: var(--bookmark-menu-margin) !important;
menupopup:is(#BMB_bookmarksPopup, [placespopup="true"]) > menuitem:not(.menuitem-iconic, [disabled="true"]),
menupopup:is(#BMB_bookmarksPopup, [placespopup="true"]) > menu:not(.menu-iconic) {
margin-inline: var(--arrowpanel-menuicon-padding) !important;
padding-inline-start: calc(var(--menu-background-padding-default) - var(--arrowpanel-menuicon-padding)) !important;
background-position: left calc(var(--arrowpanel-menuitem-padding) + 1px) center !important;
}
}
@ -1655,7 +1801,7 @@
#context_reloadTab,
#context_reloadSelectedTabs {
--menuitem-image: url(chrome://browser/skin/reload.svg);
/* --menuitem-image: url("chrome://global/skin/icons/reload.svg"); */
}
#context_toggleMuteTab,
#context_toggleMuteSelectedTabs {
@ -1688,7 +1834,9 @@
#context_sendTabToDevice {
--menuitem-image: url(./icons/send-to-device.svg);
}
#context_shareTabURL { /* At windows */
#context_sendTabToDevice:is([disabled="true"]) + #context_shareTabURL, /* Legacy */
#context_sendTabToDevice:is([disabled="true"]) + menuitem.share-tab-url-item { /* At windows */
--menuitem-image: url(./icons/share.svg);
}
#context_reopenInContainer {
@ -2112,7 +2260,8 @@
--menuitem-image: url(chrome://browser/skin/bookmark-star-on-tray.svg);
}
menupopup[context="placesContext"] > .openintabs-menuitem {
menupopup[context="placesContext"] > .openintabs-menuitem,
menuitem.openintabs-menuitem.subviewbutton {
--menuitem-image: url(./icons/movetowindow-16.svg);
}

View file

@ -274,8 +274,6 @@
--card-outline-color: var(--grey-60);
--dialog-warning-text-color: var(--red-40);
scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
}
/*= Addons.org =============================================================*/
@ -311,8 +309,10 @@
color: var(--in-content-text-color) !important;
}
.AutoSearchInput-suggestions-item:is(:active, :focus, :hover),
.AutoSearchInput-suggestions-item--highlighted,
.SecondaryHero-message-link,
.SecondaryHero-module-link,
.Card-contents a:not(.Button),
.Card-footer-link a,
.Card-shelf-footer-in-header a,
.SearchResult-link:is(:active, :focus, :hover),
@ -493,10 +493,12 @@
--color-inverse-bg: var(--in-content-page-color) !important;
--color-inverse: var(--in-content-page-background) !important;
--color-text: var(--in-content-page-color) !important;
--color-moz-text: var(--in-content-page-color) !important;
--color-moz-heading: var(--in-content-page-color) !important;
--color-text-light: var(--in-content-deemphasized-text) !important;
--color-link: var(--in-content-link-color) !important;
--color-success: var(--green-60) !important;
--color-warning: var(--yellow-60) !important;
--color-success: var(--green-70) !important;
--color-warning: var(--yellow-70) !important;
--color-error: var(--red-60) !important;
--color-error-hover: var(--red-50) !important;
--color-moz-heading: #fff;
@ -553,7 +555,7 @@
.sumo-nav--logo,
.sumo-nav--search-button,
.sumo-nav--toggle-button,
.card--icon-sm,
.card:not(.is-inverse) .card--icon-sm,
.mzp-c-menu-item-icon,
.mzp-c-menu-button-close,
.topic-article--icon,
@ -562,6 +564,13 @@
}
/* Others */
.support-callouts > .card.is-inverse {
background: #20133a !important;
}
.support-callouts > .card.is-inverse :is(h1, h2, h3, h4, h5, h6, li, p) {
color: var(--in-content-page-color) !important;
}
.sumo-button.secondary-button {
border-color: none !important;
}
@ -610,6 +619,7 @@
.cta-neutral:hover {
color: var(--in-content-page-color) !important;
}
#main-content.panel a,
.links a,
.link-blue,
.text-blue-500 {
@ -618,6 +628,12 @@
.link-blue:hover {
color: var(--in-content-link-color-hover) !important;
}
.signed-in-email-message,
.verification-email-message,
.verification-message,
.verification-recovery-code-message,
.verification-totp-message,
.input-row input[type="email"],
.input-row input[type="number"],
.input-row input[type="password"],
@ -637,13 +653,13 @@
background-color: unset !important;
}
#main-content,
.modal,
.firefox-family-services,
.input-row input[type="email"],
.input-row input[type="number"],
.input-row input[type="password"],
.input-row input[type="tel"],
.input-row input[type="text"],
.password-row .show-password-label,
header,
.bg-white:not(nav) {
background: var(--in-content-box-background) !important;