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