mirrors/Firefox-UI-Fix
1
Fork 0
mirror of https://github.com/black7375/Firefox-UI-Fix.git synced 2026-01-02 15:23:59 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'master' into photon-style

Browse source
This commit is contained in:
alstjr7375 2021-12-18 22:16:38 +09:00
commit 2fe8f4db97
3 changed files with 117 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

3
CREDITS
View file

@ -119,6 +119,9 @@ N: Ajith-stark
E: ajith.kum.12342@gmail.com
W: https://github.com/Ajith-stark
N: Andmagdo
W: https://github.com/andmagdo
N: badprogramshere
W: https://github.com/badprogramshere

74
userChrome.css
View file

@ -3,18 +3,26 @@
/** Default Thme - Contrast ***************************************************/
/*= Lightmode - Color darker =================================================*/
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) {
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), /* Legacy */
:root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] {
--lwt-accent-color: rgb(229, 229, 235) !important; /* Original: rgb(240, 240, 244) */
}
@media not all and ((-moz-os-version: windows-win7) or (-moz-os-version: windows-win8) or (-moz-gtk-csd-available)) {
/* Level 4 */
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox {
@media (-moz-os-version: windows-win10) {
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, /* Legacy */
:root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] {
background-color: var(--lwt-accent-color) !important;
}
}
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, /* Legacy */
:root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] {
background-color: var(--lwt-accent-color) !important;
}
}
/*= Darkmode - Color lighter =================================================*/
:root[lwtheme-mozlightdark][lwthemetextcolor="bright"] {
:root[lwtheme-mozlightdark][lwthemetextcolor="bright"], /* Legacy */
:root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] {
--toolbar-bgcolor: rgba(43, 42, 51, 5) !important; /* Original: rgba(43, 42, 51, 1) */
}
@ -185,13 +193,29 @@
}
}
/*= Linux - Global Menubar Active Color ======================================*/
@media (-moz-gtk-csd-available) {
/*= Linux - Global Menubar Active Color ====================================*/
#main-menubar > menu[open="true"],
#main-menubar > menu[_moz-menuactive="true"] {
color: inherit !important; /* Original: -moz-menubarhovertext */
background-color: color-mix(in srgb, currentColor 20%, transparent) !important; /* Original: -moz-menuhover */
}
/*= Linux - Titlebar button at lwtheme =====================================*/
.titlebar-button:-moz-lwtheme {
appearance: auto !important;
}
.titlebar-min:-moz-lwtheme,
.titlebar-max:-moz-lwtheme,
.titlebar-restore:-moz-lwtheme,
.titlebar-close:-moz-lwtheme {
list-style-image: none !important;
}
.titlebar-button:-moz-lwtheme:hover,
.titlebar-button:-moz-lwtheme:hover:active {
background-color: unset !important;
color: unset !important;
}
}
/*= Linux - Light System Default Theme's Selected Tab ========================*/
@ -509,7 +533,9 @@
/*- Others -----------------------------------------------------------------*/
/* For overwrite */
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]):not(:-moz-lwtheme) {
:root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]):not(:-moz-lwtheme), /* Legacy */
:root:not(:-moz-lwtheme) {
/* Light Theme */
--lwt-accent-color: var(--win-bgcolor) !important;
}
@media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) {
@ -523,12 +549,18 @@
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]):not(:-moz-lwtheme),
:root[lwtheme-mozlightdark]
:root[lwtheme-mozlightdark] /* Legacy */
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]) {
> .tab-background[multiselected]:not([selected]),
:root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]) {
background-image: linear-gradient(
color-mix(in srgb, currentColor 11%, transparent),
color-mix(in srgb, currentColor 11%, transparent)
@ -787,7 +819,13 @@
}
/* Hard Coded */
:root[lwtheme-mozlightdark][lwt-default-theme-in-dark-mode]
:root[lwtheme-mozlightdark][lwt-default-theme-in-dark-mode] /* Legacy */
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected="true"],
:root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode]
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
@ -798,12 +836,8 @@
:root:not([customizing="true"]):not(:-moz-lwtheme) tab[visuallyselected] > stack::before,
:root:not([customizing="true"]):not(:-moz-lwtheme) tab[visuallyselected] > stack::after,
:root:not([customizing="true"])[lwtheme-mozlightdark][lwt-default-theme-in-dark-mode]
tab[visuallyselected]
> stack::before,
:root:not([customizing="true"])[lwtheme-mozlightdark][lwt-default-theme-in-dark-mode]
tab[visuallyselected]
> stack::after {
:root:not([customizing="true"])[lwt-default-theme-in-dark-mode] tab[visuallyselected] > stack::before,
:root:not([customizing="true"])[lwt-default-theme-in-dark-mode] tab[visuallyselected] > stack::after {
fill: color-mix(in srgb, rgb(255, 255, 255) 15%, -moz-dialog) !important;
}
}
@ -1019,8 +1053,10 @@ html#main-window menupopup {
}
/* Default theme color preservation */
:root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]),
:root[lwtheme-mozlightdark] menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) {
:root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), /* Legacy */
:root[lwtheme-mozlightdark] menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup), /* Legacy */
:root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]),
:root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) {
--menu-color: var(--toolbar-color, var(--in-content-page-color)) !important;
--arrowpanel-background: var(
--toolbar-bgcolor,
@ -2043,7 +2079,7 @@ browser[type="content"] > html {
--organizer-pane-field-border-color: ThreeDShadow;
}
@media not (prefers-contrast) {
@media not all and (prefers-contrast) {
:root {
--organizer-color: var(--in-content-page-color);
--organizer-deemphasized-color: var(--in-content-deemphasized-text);

62
userContent.css
View file

@ -634,6 +634,20 @@
.blogpost-nav-arrow-right .cls-1 {
stroke: var(--in-content-text-color) !important;
}
/* /developers/ */
.DevHub-Navigation {
background: var(--in-content-page-background) !important;
}
.DevHub-Navigation.scheme-light ul li a,
.DevHub-content-copy h2,
.content p {
color: var(--in-content-page-color) !important;
}
.DevHub-callout-box {
background: var(--in-content-box-background) !important;
color: var(--in-content-page-color) !important;
}
}
/*= Support.org ============================================================*/
@ -673,7 +687,8 @@
#main-content,
#instant-search-content,
#mzp-c-menu-panel-help,
.mzp-c-navigation {
.mzp-c-navigation,
.kbox-container {
color: var(--in-content-page-color) !important;
background: var(--in-content-page-background) !important;
}
@ -685,7 +700,8 @@
.mzp-c-menu-item .mzp-c-menu-item-list a,
#doc-content .menu,
.document--content .menu,
.forum--entry-content .menu {
.forum--entry-content .menu,
.tag-name a {
color: var(--in-content-page-color) !important;
}
@ -710,11 +726,38 @@
color: var(--in-content-deemphasized-text) !important;
}
.tag-list a {
color: var(--color-marketing-gray-10) !important;
}
.tag-list a:hover,
.sidebar-nav a:hover {
color: var(--color-link) !important;
}
.tag-list li {
background: var(--in-content-page-color) !important;
}
.tag-list li:hover {
background: var(--in-content-deemphasized-text) !important;
}
/* Background */
.sidebar-nav.topics,
.sidebar-nav.topics > li {
background: var(--in-content-page-background) !important;
}
.mzp-c-menu-panel {
color: var(--in-content-page-color) !important;
background: var(--in-content-page-background) !important;
}
.mzp-c-menu-list-list,
.mzp-c-menu-list-list:hover {
color: var(--in-content-page-color) !important;
background: var(--in-content-box-background) !important;
}
.mzp-c-menu-list-item:focus,
.mzp-c-menu-list-item:hover {
background: var(--in-content-button-background-hover) !important;
}
/* Fill */
.sumo-nav--logo,
@ -732,6 +775,11 @@
.search-button {
filter: invert(95%) !important;
}
button.markup-toolbar-button,
.mzp-c-modal-close .mzp-c-modal-button-close {
/*using 0.5 because in middle*/
filter: invert(0.5) !important;
}
/* Others */
.support-callouts > .card.is-inverse {
@ -819,6 +867,9 @@
}
/* Background */
.flex .flex-wrap {
background: var(--in-content-page-background);
}
.password-row .show-password-label {
background-color: unset !important;
}
@ -843,6 +894,11 @@
.hover\:bg-grey-100:hover {
background: var(--in-content-button-background-hover) !important;
}
.text-blue-500 .cta-neutral,
.text-blue-500 .bg-grey-50,
.text-blue-500 .hover\:bg-grey-100 {
background: var(--in-content-button-background) !important;
}
.hover\:bg-grey-200:hover {
background: var(--in-content-button-background-active) !important;
}
@ -1751,7 +1807,7 @@
--organizer-pane-field-border-color: ThreeDShadow;
}
@media not (prefers-contrast) {
@media not all and (prefers-contrast) {
:root {
--organizer-color: var(--in-content-page-color);
--organizer-deemphasized-color: var(--in-content-deemphasized-text);