From cad4ca02416b4759b4f29c531bf0733276600879 Mon Sep 17 00:00:00 2001
From: amnweb <16545063+forumwt@users.noreply.github.com>
Date: Mon, 26 Feb 2024 16:42:11 +0100
Subject: [PATCH] Update

---
 chrome/content/common.css | 354 +++++++++++++++++++-------------------
 chrome/global/colors.css  |   3 -
 2 files changed, 180 insertions(+), 177 deletions(-)

diff --git a/chrome/content/common.css b/chrome/content/common.css
index 72a2aa5..897720d 100644
--- a/chrome/content/common.css
+++ b/chrome/content/common.css
@@ -1,192 +1,190 @@
 /* colours */
 :root {
-  --in-content-primary-button-text-color: rgb(255, 255, 255) !important;
-  --in-content-primary-button-background: #0055D7 !important;
-  --in-content-primary-button-background-hover: #0960e4 !important;
-  --in-content-primary-button-background-active: #0751be !important;
-}
-
-@-moz-document url-prefix(about:) {
-  :root {
-    --in-content-page-color: light-dark(var(--newtab-background-color), #fff) !important;
-    --in-content-page-background: light-dark(#f7f7f7, var(--newtab-background-color)) !important;
-    --in-content-deemphasized-text: light-dark(#666, #bbb) !important;
-    --in-content-box-background: light-dark(#fff, #333) !important;
-    --in-content-box-background-odd: light-dark(rgb(0 0 0 / .05), rgb(255 255 255 / .05)) !important;
-    --in-content-box-info-background: light-dark(#f7f7f7, rgb(255 255 255 / 0.15)) !important;
-    --in-content-icon-color: light-dark(#666, #fff) !important;
-    --in-content-accent-color: light-dark(#006CBE, #3c90ff) !important;
-    --in-content-accent-color-active: light-dark(#1683D8, #4C98D1) !important;
-    --in-content-border-hover: light-dark(rgb(0 0 0 / .5), rgb(255 255 255 / .3)) !important;
-    --in-content-border-invalid: var(--red-50) !important;
-    --in-content-border-color: light-dark(#bebebe, rgb(255 255 255 / .2)) !important;
-    --in-content-error-text-color: light-dark(#FF848A, #FF9AA2) !important;
-    --in-content-link-color: light-dark(#0078D4, #3c90ff) !important;
-    /* --in-content-link-color-hover: light-dark(#006CBE, #63ADE5) !important; */
-    --in-content-link-color-hover: light-dark(#006CBE, #0078d4) !important;
-    --in-content-link-color-active: light-dark(#0749AC, #4C98D1) !important;
-    --in-content-link-color-visited: light-dark(#0078D4, #3c90ff) !important;
-    --link-color: var(--in-content-link-color) !important;
-    --link-color-hover: var(--in-content-link-color-hover) !important;
-    --link-color-active: var(--in-content-link-color-active) !important;
-    --link-color-visited: var(--in-content-link-color-visited) !important;
-    --in-content-button-text-color: var(--in-content-text-color) !important;
-    --in-content-button-text-color-hover: var(--in-content-text-color) !important;
-    --in-content-button-text-color-active: var(--in-content-button-text-color-hover) !important;
-    --in-content-button-background: light-dark(#EDEDED, #3B3B3B) !important;
-    --in-content-button-background-hover: light-dark(#e5e5e5, #545454) !important;
-    --in-content-button-background-active: light-dark(#d5d5d5, #606060) !important;
-    --in-content-primary-button-text-color: light-dark(#fff, #fff) !important;
-    --in-content-primary-button-background: light-dark(#0061e0, #006CBE) !important;
-    --in-content-primary-button-background-hover: light-dark(#0250bb, #0078D4) !important;
-    --in-content-primary-button-background-active: light-dark(#053e94, #005CA3) !important;
-    --in-content-danger-button-background: light-dark(#DF4951, #E12424) !important;
-    --in-content-danger-button-background-hover: light-dark(#EA656C, #F94343) !important;
-    --in-content-danger-button-background-active: light-dark(#BB353C, #AA1E1E) !important;
-    /* --in-content-focus-outline-color: light-dark(rgb(0 85 215 / .5), #63ADE5) !important; */
-    --in-content-focus-outline-color: light-dark(rgb(0 85 215 / .5), #0078d4) !important;
-    --focus-outline-color: var(--in-content-focus-outline-color) !important;
-    --in-content-table-background: light-dark(#f7f7f7, var(--newtab-background-color)) !important;
-    --in-content-text-color: var(--in-content-page-color) !important;
-    scrollbar-color: light-dark(rgb(37 37 37 / .4), rgb(255 255 255 / .4)) light-dark(#f7f7f7, var(--newtab-background-color)) !important;
-
     --in-content-primary-button-text-color: rgb(255, 255, 255) !important;
     --in-content-primary-button-background: #0055D7 !important;
     --in-content-primary-button-background-hover: #0960e4 !important;
     --in-content-primary-button-background-active: #0751be !important;
+}
 
-
-  }
-
-  #translations-manage-install-list,
-  #handlersView,
-  #handlersViewHeader,
-  #engineList,
-  .web-appearance-choice-image-container,
-  treecol:not([hideheader="true"]),
-  input:where([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]),
-  textarea,
-  search-textbox {
-    background-color: transparent !important;
-  }
-
-  @media (prefers-color-scheme: dark) {
-
-    button:not(.ghost-button):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
-    menulist {
-      border: 1px solid #44434f !important;
-      background-color: light-dark(#EDEDED, #35343e) !important;
-    }
-
-    button:hover:not(.ghost-button):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
-    menulist {
-      border: 1px solid #4c4b57 !important;
-      background-color: light-dark(#EDEDED, #393842) !important;
+@-moz-document url-prefix(about:) {
+    :root {
+        --newtab-primary-element-text-color: rgba(251, 251, 254, 1) !important;
+        --in-content-page-color: light-dark(var(--newtab-background-color), #fff) !important;
+        --in-content-page-background: light-dark(#f7f7f7, var(--newtab-background-color)) !important;
+        --in-content-deemphasized-text: light-dark(#666, #bbb) !important;
+        --in-content-box-background: light-dark(#fff, #333) !important;
+        --in-content-box-background-odd: light-dark(rgb(0 0 0 / .05), rgb(255 255 255 / .05)) !important;
+        --in-content-box-info-background: light-dark(#f7f7f7, rgb(255 255 255 / 0.15)) !important;
+        --in-content-icon-color: light-dark(#666, #fff) !important;
+        --in-content-accent-color: light-dark(#006CBE, #3c90ff) !important;
+        --in-content-accent-color-active: light-dark(#1683D8, #4C98D1) !important;
+        --in-content-border-hover: light-dark(rgb(0 0 0 / .5), rgb(255 255 255 / .3)) !important;
+        --in-content-border-invalid: var(--red-50) !important;
+        --in-content-border-color: light-dark(#bebebe, rgb(255 255 255 / .2)) !important;
+        --in-content-error-text-color: light-dark(#FF848A, #FF9AA2) !important;
+        --in-content-link-color: light-dark(#0078D4, #3c90ff) !important;
+        /* --in-content-link-color-hover: light-dark(#006CBE, #63ADE5) !important; */
+        --in-content-link-color-hover: light-dark(#006CBE, #0078d4) !important;
+        --in-content-link-color-active: light-dark(#0749AC, #4C98D1) !important;
+        --in-content-link-color-visited: light-dark(#0078D4, #3c90ff) !important;
+        --link-color: var(--in-content-link-color) !important;
+        --link-color-hover: var(--in-content-link-color-hover) !important;
+        --link-color-active: var(--in-content-link-color-active) !important;
+        --link-color-visited: var(--in-content-link-color-visited) !important;
+        --in-content-button-text-color: var(--in-content-text-color) !important;
+        --in-content-button-text-color-hover: var(--in-content-text-color) !important;
+        --in-content-button-text-color-active: var(--in-content-button-text-color-hover) !important;
+        --in-content-button-background: light-dark(#EDEDED, #3B3B3B) !important;
+        --in-content-button-background-hover: light-dark(#e5e5e5, #545454) !important;
+        --in-content-button-background-active: light-dark(#d5d5d5, #606060) !important;
+        --in-content-primary-button-text-color: light-dark(#fff, #fff) !important;
+        --in-content-primary-button-background: light-dark(#0061e0, #006CBE) !important;
+        --in-content-primary-button-background-hover: light-dark(#0250bb, #0078D4) !important;
+        --in-content-primary-button-background-active: light-dark(#053e94, #005CA3) !important;
+        --in-content-danger-button-background: light-dark(#DF4951, #E12424) !important;
+        --in-content-danger-button-background-hover: light-dark(#EA656C, #F94343) !important;
+        --in-content-danger-button-background-active: light-dark(#BB353C, #AA1E1E) !important;
+        /* --in-content-focus-outline-color: light-dark(rgb(0 85 215 / .5), #63ADE5) !important; */
+        --in-content-focus-outline-color: light-dark(rgb(0 85 215 / .5), #0078d4) !important;
+        --focus-outline-color: var(--in-content-focus-outline-color) !important;
+        --in-content-table-background: light-dark(#f7f7f7, var(--newtab-background-color)) !important;
+        --in-content-text-color: var(--in-content-page-color) !important;
+        scrollbar-color: light-dark(rgb(37 37 37 / .4), rgb(255 255 255 / .4)) light-dark(#f7f7f7, var(--newtab-background-color)) !important;
+
+        --in-content-primary-button-text-color: rgb(255, 255, 255) !important;
+        --in-content-primary-button-background: #0055D7 !important;
+        --in-content-primary-button-background-hover: #0960e4 !important;
+        --in-content-primary-button-background-active: #0751be !important;
     }
 
-    button:hover:active:not(.ghost-button):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
-    menulist {
-      border: 1px solid #4c4b57 !important;
-      background-color: light-dark(#EDEDED, #403f49) !important;
+    #translations-manage-install-list,
+    #handlersView,
+    #handlersViewHeader,
+    #engineList,
+    .web-appearance-choice-image-container,
+    treecol:not([hideheader="true"]),
+    input:where([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]),
+    textarea,
+    search-textbox {
+        background-color: transparent !important;
     }
 
-    button:active:not(.ghost-button):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
-    menulist {
-      border: 1px solid #44434f !important;
-      background-color: light-dark(#EDEDED, #2d2c35) !important;
+    @media (prefers-color-scheme: dark) {
+
+        button:not(.ghost-button):not(.enable-custom-image-input):not(.external-link):not(.context-menu-button.icon):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
+        menulist {
+            border: 1px solid #44434f !important;
+            background-color: light-dark(#EDEDED, #35343e) !important;
+        }
+
+        button:hover:not(.ghost-button):not(.enable-custom-image-input):not(.external-link):not(.context-menu-button.icon):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
+        menulist {
+            border: 1px solid #4c4b57 !important;
+            background-color: light-dark(#EDEDED, #393842) !important;
+        }
+
+        button:hover:active:not(.ghost-button):not(.enable-custom-image-input):not(.external-link):not(.context-menu-button.icon):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
+        menulist {
+            border: 1px solid #4c4b57 !important;
+            background-color: light-dark(#EDEDED, #403f49) !important;
+        }
+
+        button:active:not(.ghost-button):not(.enable-custom-image-input):not(.external-link):not(.context-menu-button.icon):not(.toggle-button):not(.category):not([role="menuitem"]):not(button[class*='devtools']):not(button[id*='toolbox']),
+        menulist {
+            border: 1px solid #44434f !important;
+            background-color: light-dark(#EDEDED, #2d2c35) !important;
+        }
+
+        .customize-menu {
+            background-color:light-dark(#fff,rgb(28, 27, 34)) !important;
+        }
     }
-  }
 }
 
 
-@-moz-document url("about:newtab"), url("about:blank"), url("about:home") {
-  body {
-    background-color: light-dark(#f7f7f7, rgb(43 42 51)) !important;
-  }
-}
 
 /* preferences */
 @-moz-document url-prefix("about:preferences"), url-prefix("about:preferences#"), url-prefix("about:addons"), url-prefix("about:config") {
-  table#prefs {
-    background: transparent !important;
-  }
+    table#prefs {
+        background: transparent !important;
+    }
 
-  .card {
-    background: light-dark(#fff, #33333e) !important;
-  }
+    .card {
+        background: light-dark(#fff, #33333e) !important;
+    }
 
-  @media (prefers-color-scheme: dark) {
+    @media (prefers-color-scheme: dark) {
 
-    .sticky-container,
-    .table-shown #toolbar {
-      background: #1c1b22 !important;
+        .sticky-container,
+        .table-shown #toolbar {
+            background: #1c1b22 !important;
+        }
     }
-  }
 
-  @media (prefers-color-scheme: light) {
+    @media (prefers-color-scheme: light) {
 
-    .sticky-container,
-    .table-shown #toolbar {
-      background: #ffffff!important;
+        .sticky-container,
+        .table-shown #toolbar {
+            background: #ffffff !important;
+        }
     }
-  }
 
 
 
-  .category[selected] {
-    position: relative !important;
-    border-radius: 4px !important;
-  }
+    .category[selected] {
+        position: relative !important;
+        border-radius: 4px !important;
+    }
 
-  .category[selected]:not(:hover, :active) {
-    background-color: var(--in-content-button-background) !important;
-  }
+    .category[selected]:not(:hover, :active) {
+        background-color: var(--in-content-button-background) !important;
+    }
 
-  .category[selected]::before {
-    content: "";
-    display: block;
-    height: 24px;
-    width: 3px;
-    background-color: var(--in-content-accent-color);
-    border-radius: 3px;
-    position: absolute;
-    left: 2px;
-    top: 50%;
-    translate: 0 -50%;
-  }
+    .category[selected]::before {
+        content: "";
+        display: block;
+        height: 24px;
+        width: 3px;
+        background-color: var(--in-content-accent-color);
+        border-radius: 3px;
+        position: absolute;
+        left: 2px;
+        top: 50%;
+        translate: 0 -50%;
+    }
 
-  button.tab-button:hover {
-    border-block-color: transparent var(--in-content-box-border-color) !important;
-  }
+    button.tab-button:hover {
+        border-block-color: transparent var(--in-content-box-border-color) !important;
+    }
 
-  button.tab-button[selected],
-  button.tab-button[selected]:hover {
-    border-block-color: transparent currentColor !important;
-  }
+    button.tab-button[selected],
+    button.tab-button[selected]:hover {
+        border-block-color: transparent currentColor !important;
+    }
 
 }
 
 /* fix page flashes when loading some websites */
 @-moz-document url("about:newtab"), url("about:blank"), url("about:home") {
-  body {
-    background: var(--in-content-page-background);
-    color: var(--in-content-page-color);
-  }
+    body {
+        background: var(--in-content-page-background);
+        color: var(--in-content-page-color);
+    }
 }
 
 @-moz-document url(about:newtab), url(about:home){
 
 /* Changes the logo on the about:home screen */
 .search-wrapper .logo-and-wordmark .logo {
-  background: url('../icons/firefox-logo.svg') !important;
+    background: url('../icons/firefox-logo.svg') !important;
 }
 
 .search-wrapper .logo-and-wordmark::after {
-  content: "plus";
-  font-size: 16px;
-  margin-top: -8px;
-  margin-left: 4px;
-  opacity: 0.8;
+    content: "plus";
+    font-size: 16px;
+    margin-top: -8px;
+    margin-left: 4px;
+    opacity: 0.8;
 }
 
 }
@@ -196,36 +194,44 @@
 @-moz-document url("about:home"),
 url("about:newtab") {
 
-  #root .outer-wrapper .top-sites-list .top-site-outer {
-    padding: 20px 20px 4px !important;
-  }
-
-  #root .top-site-outer .tile .icon-wrapper,
-  #root .outer-wrapper .top-site-outer .top-site-inner,
-  #root .outer-wrapper .top-site-outer .top-site-inner .tile {
-    border-radius: 50% !important;
-
-  }
-
-  .outer-wrapper .body-wrapper .top-site-outer .top-site-inner .tile {
-    border-bottom: 1px solid #ffffff12 !important;
-    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.35) !important;
-  }
-
-  #root .outer-wrapper .top-site-outer .default-icon {
-    background-size: 48px !important;
-    height: 72px !important;
-    width: 72px !important;
-  }
-
-  #root .top-site-outer .tile .icon-wrapper {
-    width: 72px !important;
-    height: 72px !important;
-  }
-
-  .top-site-outer .tile .icon-wrapper.letter-fallback::before {
-    font-size: 48px !important;
-    top: -3px !important;
-  }
+    #root .outer-wrapper .top-sites-list .top-site-outer {
+        padding: 20px 20px 4px !important;
+    }
+
+    #root .top-site-outer .tile .icon-wrapper,
+    #root .outer-wrapper .top-site-outer .top-site-inner,
+    #root .outer-wrapper .top-site-outer .top-site-inner .tile {
+        border-radius: 50% !important;
+
+    }
+    .top-site-outer .context-menu-button {
+        transform: rotate(90deg);
+        right: -20px !important;
+        top: -16px !important;
+        background-color: transparent !important;
+    }
+    .top-site-outer .context-menu-button:is(:active, :focus) {
+        fill: light-dark(#000, #fff) !important
+    }
+    .outer-wrapper .body-wrapper .top-site-outer .top-site-inner .tile {
+        border-bottom: 1px solid #ffffff12 !important;
+        box-shadow: 0 2px 3px rgba(0, 0, 0, 0.35) !important;
+    }
+
+    #root .outer-wrapper .top-site-outer .default-icon {
+        background-size: 48px !important;
+        height: 72px !important;
+        width: 72px !important;
+    }
+
+    #root .top-site-outer .tile .icon-wrapper {
+        width: 72px !important;
+        height: 72px !important;
+    }
+
+    .top-site-outer .tile .icon-wrapper.letter-fallback::before {
+        font-size: 48px !important;
+        top: -3px !important;
+    }
 
 }
\ No newline at end of file
diff --git a/chrome/global/colors.css b/chrome/global/colors.css
index 76b8c82..1e60c8f 100644
--- a/chrome/global/colors.css
+++ b/chrome/global/colors.css
@@ -71,13 +71,10 @@
   --in-content-primary-button-background: #0055D7 !important;
   --in-content-primary-button-background-hover: #0960e4 !important;
   --in-content-primary-button-background-active: #0751be !important;
-
-
 }
 
 /* ensure that dark mode is enabled completely in private browsing mode. */
 @media (-moz-bool-pref: "browser.theme.dark-private-windows") {
-
   :root[privatebrowsingmode="temporary"],
   :root[privatebrowsingmode="temporary"] #nav-bar,
   :root[privatebrowsingmode="temporary"] #PersonalToolbar {