From 7a791dcc9aec3df9b2e3f988b2bcbab116ad9fc5 Mon Sep 17 00:00:00 2001 From: Gerome Matilla Date: Thu, 21 May 2020 06:52:45 +0800 Subject: [PATCH] cleanup --- add.svg | 57 ++++++++-------- userChrome.css | 169 ++++++++++++++++++++++++++++++++++++------------ userContent.css | 30 ++++----- 3 files changed, 168 insertions(+), 88 deletions(-) diff --git a/add.svg b/add.svg index 311eb1c..7f49ae4 100644 --- a/add.svg +++ b/add.svg @@ -7,13 +7,13 @@ xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" - inkscape:version="1.0 (4035a4fb49, 2020-05-01)" - sodipodi:docname="ic_add_48px.svg" - id="svg4" - version="1.1" - viewBox="0 0 48 48" + width="48" height="48" - width="48"> + viewBox="0 0 48 48" + version="1.1" + id="svg4" + sodipodi:docname="add.svg" + inkscape:version="1.0 (4035a4fb49, 2020-05-01)"> @@ -22,35 +22,36 @@ image/svg+xml - + + borderopacity="1" + objecttolerance="10" + gridtolerance="10" + guidetolerance="10" + inkscape:pageopacity="0" + inkscape:pageshadow="2" + inkscape:window-width="1321" + inkscape:window-height="740" + id="namedview6" + showgrid="false" + inkscape:pagecheckerboard="true" + inkscape:zoom="12" + inkscape:cx="24" + inkscape:cy="24" + inkscape:window-x="45" + inkscape:window-y="28" + inkscape:window-maximized="0" + inkscape:current-layer="svg4" /> + style="fill:#ffffff;fill-opacity:1;stroke-width:1.14286" /> diff --git a/userChrome.css b/userChrome.css index ec3806b..7a80a80 100644 --- a/userChrome.css +++ b/userChrome.css @@ -1,32 +1,36 @@ :root { - --bf-bg: #00000039; - --bf-bg-hover: #fefefe20; + --bf-bg: #00000066; + --bf-hover-bg: #fefefe20; --bf-color: #f2f2f2; --bf-focused-color: #fefefe; + + --bf-accent-bg: #4C5FF9CC; --bf-icon-color: #f2f2f2; - --bf-switch-tab-color: orange; - --bf-bookmark-color: green; + --bf-switch-tab-color: #6498EF; + --bf-bookmark-color: #53E2AE; --bf-tab-font-size: 11pt; --bf-tab-font-weight: 500; --bf-tab-color: var(--bf-color); - --bf-tab-selected-bg: #00000060; + --bf-tab-selected-bg: var(--bf-bg); --bf-tab-height: 32px; --bf-tab-border-radius: 6px; - --bf-tab-soundplaying-bg: var(--bf-bg-hover); + --bf-tab-soundplaying-bg: #985EFFCC; --bf-navbar-padding: 4px; - + + --bf-urlbar-bg: var(--bf-bg); + --bf-urlbar-active-bg: #000000BB; --bf-urlbar-color: var(--bf-color); --bf-urlbar-focused-color: var(--bf-focused-color); --bf-urlbar-font-size: 12pt; --bf-urlbar-font-weight: 500; --bf-urlbar-results-font-size: 12pt; - --bf-urlbar-results-font-weight: 350; + --bf-urlbar-results-font-weight: 550; --bf-urlbar-results-url-color: var(--bf-color); --bf-sidebar-bg: transparent; @@ -34,6 +38,8 @@ --bf-menupopup-bg: #00000090; --bf-menupopup-color: var(--bf-color); + + --bf-splitter-bg: #00000090; --autocomplete-popup-background: var(--bf-bg) !important; --default-arrowpanel-background: var(--bf-bg) !important; @@ -44,8 +50,6 @@ --urlbar-separator-color: transparent !important; } -@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); - /* ░▀█▀░█▀▄░█▀█░█▀█░█▀▀░█▀█░█▀█░█▀▄░█▀▀░█▀█░█▀▀░█░█ ░░█░░█▀▄░█▀█░█░█░▀▀█░█▀▀░█▀█░█▀▄░█▀▀░█░█░█░░░░█░ @@ -55,7 +59,7 @@ Transparent Window */ #main-window { - background: var(--bf-bg) !important; + background: transparent !important; border: none !important; } @@ -85,6 +89,11 @@ toolbarbutton { margin-left: 2px !important; } +.toolbarbutton-1 { + --toolbarbutton-hover-background: var(--bf-hover-bg) !important; + --toolbarbutton-active-background: var(--bf-hover-bg) !important; +} + #urlbar { max-width: 70% !important; margin: 0 15% !important; @@ -95,7 +104,7 @@ toolbarbutton { } #urlbar-background { - background-color: var(--bf-bg) !important; + background-color: var(--bf-urlbar-bg) !important; border: none !important; } @@ -104,6 +113,10 @@ toolbarbutton { background-color: transparent !important; } +.megabar[open=true] > #urlbar-background { + background: var(--bf-urlbar-active-bg) !important; +} + #navigator-toolbox, toolbaritem { border: none !important; } @@ -121,7 +134,8 @@ toolbarbutton { display: none !important; } -image #star-button { +#star-button { + /* Hide URL bar bookmark button */ display: none; } @@ -143,6 +157,11 @@ image #star-button { color: var(--bf-urlbar-results-color) !important; } +.urlbarView-row-inner:hover { + /* hover background color */ + background: var(--bf-accent-bg) !important; +} + .urlbarView-url, .search-panel-one-offs-container { color: var(--bf-urlbar-results-url-color) !important; font-weight: var(--bf-urlbar-results-font-weight); @@ -156,7 +175,22 @@ image #star-button { text-align: center !important; } -#tracking-protection-icon-container, #identity- +::-moz-selection { + /* URL bar hightlight color */ + background-color: var(--bf-accent-bg) !important; +} + +#searchbar { + background: var(--bf-bg) !important; + border: none !important; +} + +.searchbar-textbox { + color: var(--bf-focus-fg) !important; + font-weight: 700 !important; +} + +#tracking-protection-icon-container, #identity-box { display: none !important; } @@ -241,7 +275,7 @@ The tabs container hbox.tab-content .tab-icon-image { /* Hide tab icon */ - display: initial !important; + display: none !important; } hbox.tab-content[pinned=true] .tab-icon-image { @@ -253,7 +287,7 @@ hbox.tab-content[pinned=true] .tab-text { display: none !important; } -.tab-line { +.tab-line, .tab-bottom-line { /* Hide the tab line */ display: none !important; } @@ -279,7 +313,7 @@ hbox.tab-content[pinned=true] .tab-text { } #tabs-newtab-button { - padding-bottom: 4px !important; + padding-bottom: 5px !important; } #tabs-newtab-button { @@ -292,7 +326,7 @@ tab.tabbrowser-tab { } tab.tabbrowser-tab:hover { - background: var(--bf-bg-hover) !important; + background: var(--bf-hover-bg) !important; box-shadow: 0 1px 4px rgba(0,0,0,.05); } @@ -328,7 +362,9 @@ The findbar Contains history, bookmarks, and etc. */ -#history-panel, #sidebar-search-container { +#history-panel, +#sidebar-search-container, +#bookmarksPanel { background: var(--bf-bg) !important; } @@ -366,13 +402,10 @@ image #sidebar-icon { --sidebar-background-color: var(--bf-sidebar-bg) !important; } -splitter #sidebar-splitter { - opacity: 1 !important; -} - -splitter #sidebar-splitter { +#sidebar-splitter { border: none !important; - background-color: var(--bf-bg) !important; + opacity: 1 !important; + background-color: var(--bf-splitter-bg) !important; } /* @@ -409,34 +442,53 @@ box.panel-arrowcontent { Right-click menu */ - -menupopup { - -moz-appearance: none !important; - background: var(--bf-menupopup-bg) !important; - border: none !important; - border-radius: 4px !important; - padding: 4px 0 !important; +menupopup, popup, +popup > menu > menupopup, +menupopup > menu > menupopup { + -moz-appearance: none !important; + background: var(--bf-menupopup-bg) !important; + border: 0px !important; + border-radius: 4px !important; + padding: 2px 0px 2px 0px !important; } -menupopup label { - color: var(--bf-menupopup-color) !important; +menupopup menuseparator { + -moz-appearance: none !important; + background: #525A6D !important; + margin: 2px 0px 2px 0px !important; + padding: 0 !important; + border-top: none !important; + border-color: transparent !important; } -menupopup menupopup { - margin: -5px 0 0 -4px; +menupopup menu, menuitem { + -moz-appearance: none !important; + color: var(--bf-focused-color) !important; + padding: 5px !important; } -menubar > menu > menupopup { - border-top-left-radius: 0 !important; - border-top-right-radius: 0 !important; +menupopup menu[disabled=true], menuitem[disabled=true] { + /* Disabled button */ + -moz-appearance: none !important; + opacity: 0.5 !important; + color: var(--bf-focused-color) !important; + background-color: transparent !important; } -menuitem[type="checkbox"] image, menuitem[type="radio"] image { - visibility: visible !important; +menupopup menu:hover:not([disabled=false]), menuitem:hover:not([disabled=false]) { + /* Disabled button hover */ + -moz-appearance: none !important; + opacity: 0.5 !important; + color: var(--bf-focused-color) !important; + background-color: transparent !important; } -menuitem[disabled="true"]:hover, menupopup menu[disabled="true"]:hover { - background: transparent !important; +menupopup menu:hover:not([disabled=true]), menuitem:hover:not([disabled=true]) { + /* Enabled button hover */ + -moz-appearance: none !important; + color: var(--bf-focused-color) !important; + opacity: 1 !important; + background-color: var(--bf-accent-bg) !important; } /* @@ -450,3 +502,34 @@ The control buttons. Contains, close, minimize, and maximize buttons #autohide-context, #window-controls { display:none!important; } + +/* +░█▀▀░█░█░█▀▀░▀█▀░█▀█░█▄█░▀█▀░▀▀█░█▀█░▀█▀░▀█▀░█▀█░█▀█░█░█░▀█▀░█▀█░█▀▄░█▀█░█░█ +░█░░░█░█░▀▀█░░█░░█░█░█░█░░█░░▄▀░░█▀█░░█░░░█░░█░█░█░█░█▄█░░█░░█░█░█░█░█░█░█▄█ +░▀▀▀░▀▀▀░▀▀▀░░▀░░▀▀▀░▀░▀░▀▀▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀▀▀░▀░▀░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀░▀░▀ + +The customization window +*/ + +#customization-container { + background: var(--bf-bg) !important; +} + +.customizationmode-button { + -moz-appearance: none !important; + background: var(--bf-bg) !important; + padding: 5px !important; + border-radius: 6px !important; +} + +.customizationmode-button:hover { + -moz-appearance: none !important; + background: var(--bf-hover-bg) !important; + padding: 5px !important; + border-radius: 6px !important; +} + +.customizationmode-button label { + color: var(--bf-color) !important; +} + \ No newline at end of file diff --git a/userContent.css b/userContent.css index 826998d..4b25244 100644 --- a/userContent.css +++ b/userContent.css @@ -2,22 +2,18 @@ /* Removes white loading page */ @-moz-document url(about:blank), url(about:newtab), url(about:home) { - html:not(#ublock0-epicker), html:not(#ublock0-epicker) body, #newtab-customize-overlay { - background: var(--mff-bg) !important; - } - } + html:not(#ublock0-epicker), html:not(#ublock0-epicker) body, #newtab-customize-overlay { + background: var(-bf-bg) !important; + } +} +/* Hide scrollbar */ +:root{ + scrollbar-width: none !important; +} - /* Hide scrollbar */ - - :root{ - scrollbar-width: none !important; - } - - - @-moz-document url(about:privatebrowsing) { - - :root{ - scrollbar-width: none !important; - } - } \ No newline at end of file +@-moz-document url(about:privatebrowsing) { + :root{ + scrollbar-width: none !important; + } +} \ No newline at end of file