From 77e013f956eaa7cf3d9d12f54c13ed765fc04e2f Mon Sep 17 00:00:00 2001 From: Rafael Mardojai CM Date: Tue, 2 Jul 2019 18:03:48 -0500 Subject: [PATCH] Remove old buttons styling --- theme/parts/headerbar-buttons.css | 197 ------------------------------ theme/parts/popups-contents.css | 131 ++++---------------- theme/parts/popups.css | 108 ---------------- 3 files changed, 24 insertions(+), 412 deletions(-) delete mode 100755 theme/parts/headerbar-buttons.css diff --git a/theme/parts/headerbar-buttons.css b/theme/parts/headerbar-buttons.css deleted file mode 100755 index c988879..0000000 --- a/theme/parts/headerbar-buttons.css +++ /dev/null @@ -1,197 +0,0 @@ -/* Header bar's buttons */ -@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; - -/* Overrides: Make the back button the same as other buttons */ -:root:not([uidensity=compact]) #back-button { - border-radius: var(--toolbarbutton-border-radius) !important; -} -:root:not([uidensity=compact]) #back-button > .toolbarbutton-icon { - background-color: unset !important; - border: unset !important; - width: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important; - height: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important; - padding: var(--toolbarbutton-inner-padding) !important; - border-radius: var(--toolbarbutton-border-radius); - box-shadow: none !important; -} -:root:not([uidensity=compact]) #back-button:not([disabled]):not([open]):hover > .toolbarbutton-icon { - background-color: var(--toolbarbutton-hover-background) !important; - box-shadow: unset; - border-color: unset; -} -:root:not([uidensity=compact]) #back-button[open] > .toolbarbutton-icon, -:root:not([uidensity=compact]) #back-button:not([disabled]):hover:active > .toolbarbutton-icon { - background-color: var(--toolbarbutton-active-background) !important; - border-color: unset; -} - -/* Remove the header bar buttons' hover styles */ -#nav-bar { - --toolbarbutton-active-background: transparent !important; - --toolbarbutton-hover-background: transparent !important; -} - -/* Header bar buttons */ -#nav-bar toolbarbutton:not(#urlbar-zoom-button):not(.subviewbutton) { - border: 1px solid var(--gnome-button-border-color); - border-bottom-color: var(--gnome-button-border-accent-color); - border-radius: 5px !important; - margin: 6px 3px !important; - padding: 0 2px !important; - width: 34px; - height: 34px; - color: var(--gnome-toolbar-color) !important; -} -/* Inactive window */ -:root:-moz-window-inactive #nav-bar toolbarbutton:not(#urlbar-zoom-button):not(.subviewbutton) { - border: 1px solid var(--gnome-inactive-button-border-color); -} -:root:-moz-window-inactive #nav-bar toolbarbutton:not(#urlbar-zoom-button):not(.subviewbutton) image, -/* Glitch: Downloads button's icon */ -:root:-moz-window-inactive #downloads-indicator-anchor { - opacity: .7 !important; -} - -/* Enabled header bar buttons */ -#nav-bar toolbarbutton:not(#urlbar-zoom-button):not(.subviewbutton):not([disabled]), -/* Glitch: Reload button */ -:root[customizing] #nav-bar > hbox toolbaritem toolbarbutton { - background-image: var(--gnome-button-background); - box-shadow: var(--gnome-button-box-shadow); -} -/* Glitch: Cut / Copy / Paste buttons' icons - * :not(#hack) is there just to elevate rule priority */ -:root[customizing] #nav-bar > hbox toolbaritem toolbarbutton image:not(#hack) { - opacity: 1 !important; -} -/* Hovered */ -#nav-bar toolbarbutton:not(#urlbar-zoom-button):not(.subviewbutton):not([open]):not([disabled]):hover { - background-image: var(--gnome-button-hover-background); -} -/* Active */ -#nav-bar toolbarbutton:not(#urlbar-zoom-button):not([disabled]):active, -#nav-bar toolbarbutton:not(#urlbar-zoom-button):not([disabled])[open] { - background-image: var(--gnome-button-active-background); - box-shadow: var(--gnome-button-active-box-shadow); - border-color: var(--gnome-button-active-border-color); - border-bottom-color: var(--gnome-button-active-border-color); - border-top-color: var(--gnome-button-active-border-accent-color); -} -/* Inactive window */ -:root:-moz-window-inactive #nav-bar toolbarbutton:not(#urlbar-zoom-button):not([disabled]) { - background-image: var(--gnome-inactive-button-background); - box-shadow: var(--gnome-inactive-button-box-shadow); -} -/* Glitch: Reload and Cut / Copy / Paste buttons */ -:root:-moz-window-inactive[customizing] #nav-bar #stop-reload-button toolbarbutton, -:root:-moz-window-inactive[customizing] #nav-bar #edit-controls toolbarbutton { - background-image: var(--gnome-inactive-button-background); - box-shadow: var(--gnome-inactive-button-box-shadow); -} -/* Glitch: Reload and Cut / Copy / Paste buttons' icons */ -:root:-moz-window-inactive[customizing] #nav-bar #stop-reload-button image.toolbarbutton-icon, -:root:-moz-window-inactive[customizing] #nav-bar #edit-controls image.toolbarbutton-icon { - opacity: .7 !important; -} - -/* Disabled header bar buttons */ -#nav-bar toolbarbutton:not(#urlbar-zoom-button)[disabled] { - background-color: var(--gnome-button-disabled-background); - border: 1px solid var(--gnome-button-disabled-border-color) !important; - box-shadow: var(--gnome-button-disabled-box-shadow); - opacity: 1 !important; -} -#nav-bar toolbarbutton:not(#urlbar-zoom-button)[disabled]:hover { - background-color: var(--gnome-button-disabled-background) !important; -} -#nav-bar toolbarbutton:not(#urlbar-zoom-button)[disabled] image { - opacity: .4 !important; -} -/* Glitch: Overflow and Burger buttons - * :not(#hack) is there just to elevate rule priority */ -:root[customizing] #nav-bar > toolbarbutton[disabled]:not(#hack), -:root[customizing] #nav-bar > toolbaritem > toolbarbutton[disabled]:not(#hack) { - opacity: .5 !important; -} -/* Glitch: Overflow button's icon */ -:root[customizing] #nav-bar toolbarbutton:not(#urlbar-zoom-button)[disabled] image { - fill-opacity: var(--toolbarbutton-icon-fill-opacity) !important; -} -/* Inactive window */ -:root:-moz-window-inactive #nav-bar toolbarbutton:not(#urlbar-zoom-button)[disabled] { - background-color: var(--gnome-inactive-button-disabled-background); - border: var(--gnome-inactive-button-disabled-border); - box-shadow: var(--gnome-inactive-button-disabled-box-shadow); -} -:root:-moz-window-inactive #nav-bar toolbarbutton:not(#urlbar-zoom-button)[disabled] image { - opacity: .3 !important; -} - -/* Combined buttons - * :not(#hack) is there just to elevate rule priority */ -#nav-bar .toolbaritem-combined-buttons toolbarbutton:not(:last-child):not(#hack), -#nav-bar #back-button:not(#hack) { - border-top-right-radius: 0 !important; - border-bottom-right-radius: 0 !important; - border-right-width: 0 !important; - margin-right: 0 !important; -} -#nav-bar .toolbaritem-combined-buttons toolbarbutton:not(:first-child):not(#hack), -#nav-bar #forward-button:not(#hack) { - border-top-left-radius: 0 !important; - border-bottom-left-radius: 0 !important; - margin-left: 0 !important; -} -/* Glitch: Combined buttons' margin */ -#nav-bar .toolbaritem-combined-buttons { - margin-left: 0 !important; - margin-right: 0 !important; -} -/* Remove combined buttons' separators */ -#nav-bar .toolbaritem-combined-buttons separator { - display: none !important; -} - -/* Bookmark buttons */ -#nav-bar toolbarbutton.bookmark-item { - width: auto !important; -} -#nav-bar toolbarbutton.bookmark-item .toolbarbutton-icon { - margin-left: 6px; -} -#nav-bar toolbarbutton.bookmark-item .toolbarbutton-text { - padding-right: 6px; -} - -/* Remove Burger button's left separator */ -#PanelUI-button { - border: 0 !important; - margin: 0 !important; -} - -/* Space main menu button from other headerbar buttons -#nav-bar #PanelUI-menu-button:not(#hack) { - margin-left: 10px !important; -}*/ - -/* User sync menu, bigger avatar */ -#fxa-toolbar-menu-button .toolbarbutton-badge-stack { - padding: 0 !important; - margin: 0 !important; -} -#fxa-avatar-image { - height: 26px !important; - margin: 0 !important; - padding: 0 !important; - width: 26px !important; -} - -/* Fix library animation */ -#library-animatable-box { - --library-button-height: 46px !important; - --library-icon-x: 1716px !important; - /*--library-icon-x: 1715.9833984375px !important;*/ -} -#library-button[animate] > .toolbarbutton-icon { - fill: transparent !important; -} \ No newline at end of file diff --git a/theme/parts/popups-contents.css b/theme/parts/popups-contents.css index 46cf0ef..1e6c389 100755 --- a/theme/parts/popups-contents.css +++ b/theme/parts/popups-contents.css @@ -2,21 +2,10 @@ @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; -/* Style main context menu buttons */ +/* Style main context menu & buttons */ #context-navigation { padding: 4px 8px 8px; } -#context-navigation menuitem { - -moz-appearance: none !important; - background-image: var(--gnome-button-background); - box-shadow: var(--gnome-button-box-shadow); - border-width: 1px 1px 1px 0; - border-style: solid; - border-color: var(--gnome-button-border-color); - border-bottom-color: var(--gnome-button-border-accent-color); - height: 34px; - text-align: center !important; -} #context-navigation > menuitem > .menu-iconic-left { margin: auto !important; } @@ -24,24 +13,6 @@ --toolbarbutton-active-background: transparent !important; --toolbarbutton-hover-background: transparent !important; } -#context-navigation menuitem:hover:not([disabled]) { - background-image: var(--gnome-button-hover-background); - color: var(--gnome-toolbar-color) !important; -} -#context-navigation menuitem:active:not([disabled]) { - background-image: var(--gnome-button-active-background) !important; - box-shadow: var(--gnome-button-active-box-shadow) !important; - border-color: var(--gnome-button-active-border-color) !important; - border-bottom-color: var(--gnome-button-active-border-color) !important; - border-top-color: var(--gnome-button-active-border-accent-color) !important; -} -#context-navigation menuitem:first-child { - border-radius: 5px 0 0 5px; - border-left-width: 1px; -} -#context-navigation menuitem:last-child { - border-radius: 0 5px 5px 0; -} /* Remove icons from the main context menu */ #contentAreaContextMenu menuitem image, @@ -52,60 +23,6 @@ visibility: visible; } -/* Main menu combined buttons */ -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton { - -moz-appearance: none !important; - background: var(--gnome-button-background) !important; - box-shadow: var(--gnome-button-box-shadow) !important; - border-width: 1px 1px 1px 0 !important; - border-style: solid !important; - border-color: var(--gnome-button-border-color) !important; - border-bottom-color: var(--gnome-button-border-accent-color) !important; - border-radius: 0 !important; - height: 34px !important; - min-width: 34px !important; - margin: 0 !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton:first-of-type, -#appMenu-popup #appMenu-fullscreen-button { - border-top-left-radius: 5px !important; - border-bottom-left-radius: 5px !important; - border-left-width: 1px !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton:last-of-type, -#appMenu-popup #appMenu-zoomEnlarge-button { - border-top-right-radius: 5px !important; - border-bottom-right-radius: 5px !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton[disabled] { - background: var(--gnome-button-disabled-background) !important; - border-color: var(--gnome-button-disabled-border-color) !important; - box-shadow: var(--gnome-button-disabled-box-shadow) !important; - opacity: 1 !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton[disabled]:hover { - background: var(--gnome-button-disabled-background) !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton[disabled] image { - opacity: .4 !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton:hover { - background: var(--gnome-button-hover-background) !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarbutton:active { - background-image: var(--gnome-button-active-background) !important; - box-shadow: var(--gnome-button-active-box-shadow) !important; - border-color: var(--gnome-button-active-border-color) !important; - border-bottom-color: var(--gnome-button-active-border-color) !important; - border-top-color: var(--gnome-button-active-border-accent-color) !important; -} -#appMenu-popup .toolbaritem-combined-buttons toolbarseparator { - border: 0 !important; -} -#appMenu-zoomReset-button { - padding: 2px 16px !important; -} - /* Main menu remove items icons */ panelview vbox.panel-subview-body > toolbarbutton image { display: none; @@ -175,29 +92,6 @@ panelview vbox.panel-subview-body > toolbarbutton label { flex-direction: column; } -#downloadsPanel-mainView .download-state .downloadButton { - -moz-appearance: none !important; - background-image: var(--gnome-button-background) !important; - box-shadow: var(--gnome-button-box-shadow) !important; - border: 1px solid var(--gnome-button-border-color) !important; - border-bottom-color: var(--gnome-button-border-accent-color) !important; - border-radius: 100%; - min-width: 34px !important; - width: 34px !important; - height: 34px !important; - margin: auto; -} -#downloadsPanel-mainView .download-state .downloadButton:hover { - background: var(--gnome-button-hover-background) !important; -} -#downloadsPanel-mainView .download-state .downloadButton:active { - background-image: var(--gnome-button-active-background) !important; - box-shadow: var(--gnome-button-active-box-shadow) !important; - border-color: var(--gnome-button-active-border-color) !important; - border-bottom-color: var(--gnome-button-active-border-color) !important; - border-top-color: var(--gnome-button-active-border-accent-color) !important; -} - #downloadsPanel-mainView .download-state .downloadButton .button-box { padding: 0 !important; margin: 0 !important; @@ -205,3 +99,26 @@ panelview vbox.panel-subview-body > toolbarbutton label { #downloadsPanel-mainView .download-state toolbarseparator { display: none; } + +/* Customization overflow menu position */ +#customization-panel-container { + padding: 0 75px 25px !important; + margin-top: 10px; + z-index: 10; +} +#customization-panelWrapper > .panel-arrowbox { + margin-bottom: -5px !important; +} + +/* Confirmation Hint */ +#confirmation-hint .panel-arrowcontent { + background: var(--gnome-button-suggested-action-background) !important; + border-color: var(--gnome-button-suggested-action-border-color) !important; +} +#confirmation-hint .panel-arrow { + fill: var(--gnome-button-suggested-action-border-color) !important; + stroke: var(--gnome-button-suggested-action-border-color) !important; +} +#confirmation-hint-message { + color: white !important; +} diff --git a/theme/parts/popups.css b/theme/parts/popups.css index 93c6635..51f41b2 100755 --- a/theme/parts/popups.css +++ b/theme/parts/popups.css @@ -91,112 +91,4 @@ toolbarseparator[orient="vertical"] { /* Style popover header */ .panel-header { border-bottom: 1px solid var(--gnome-popover-separator-color) !important; -} - -/* Style popovers buttons */ -.subviewbutton.panel-subview-footer, -.panel-footer button, -#downloadsHistory, -#overflowMenu-customize-button, -#appMenu-popup .panel-banner-item { - -moz-appearance: none !important; - background: var(--gnome-button-background) !important; - box-shadow: var(--gnome-button-box-shadow) !important; - border: 1px solid var(--gnome-button-border-color) !important; - border-bottom-color: var(--gnome-button-border-accent-color) !important; - border-radius: 5px !important; - padding: 2px 16px !important; - height: 34px !important; - min-height: 34px !important; -} - -.subviewbutton.panel-subview-footer:not(:only-of-type), -.panel-footer button:not(:only-of-type) { - border-right-width: 0 !important; - border-radius: 0 !important; -} -.subviewbutton.panel-subview-footer:not(:only-of-type):first-of-type, -.panel-footer button:not(:only-of-type):first-of-type { - border-radius: 5px 0 0 5px !important; -} -.subviewbutton.panel-subview-footer:not(:only-of-type):last-of-type, -.panel-footer button:not(:only-of-type):last-of-type { - border-right-width: 1px !important; - border-radius: 0 5px 5px 0 !important; -} - -.subviewbutton.panel-subview-footer:hover, -.panel-footer button:hover, -#downloadsHistory:hover, -#overflowMenu-customize-button:hover, -#appMenu-popup .panel-banner-item:hover { - outline: 0 !important; - background: var(--gnome-button-hover-background) !important; -} - -.subviewbutton.panel-subview-footer:active, -.panel-footer button:active, -#downloadsHistory:active, -#overflowMenu-customize-button:active, -#appMenu-popup .panel-banner-item:active { - background-image: var(--gnome-button-active-background) !important; - box-shadow: var(--gnome-button-active-box-shadow) !important; - border-color: var(--gnome-button-active-border-color) !important; - border-bottom-color: var(--gnome-button-active-border-color) !important; - border-top-color: var(--gnome-button-active-border-accent-color) !important; -} - -/* Style popovers buttons with suggested action */ -button.popup-notification-primary-button, -#editBookmarkPanelDoneButton { - color: white !important; - background: var(--gnome-button-suggested-action-background) !important; - border-color: var(--gnome-button-suggested-action-border-color) !important; - border-bottom-color: var(--gnome-button-suggested-action-border-bottom-color) !important; - box-shadow: var(--gnome-button-suggested-action-box-shadow) !important; - text-shadow: 0 -1px rgba(0, 0, 0, 0.543529); -} -button.popup-notification-primary-button.popup-notification-button:hover, -#editBookmarkPanelDoneButton:hover { - background: var(--gnome-button-suggested-action-hover-background) !important; -} -button.popup-notification-primary-button:active { - -} - -/* Style popovers footer buttons with destructive action */ -#editBookmarkPanelRemoveButton { - color: white !important; - background: var(--gnome-button-destructive-action-background) !important; - border-radius: 3px 0 0 3px !important; - border-color: var(--gnome-button-destructive-action-border-color) !important; - border-bottom-color: var(--gnome-button-destructive-action-border-bottom-color) !important; - box-shadow: var(--gnome-button-destructive-action-box-shadow) !important; - text-shadow: 0 -1px rgba(0, 0, 0, 0.560784); -} -#editBookmarkPanelRemoveButton:hover { - background: var(--gnome-button-destructive-action-hover-background) !important; -} - -/* Customization overflow menu position */ -#customization-panel-container { - padding: 0 75px 25px !important; - margin-top: 10px; - z-index: 10; -} -#customization-panelWrapper > .panel-arrowbox { - margin-bottom: -5px !important; -} - -/* Confirmation Hint */ -#confirmation-hint .panel-arrowcontent { - background: var(--gnome-button-suggested-action-background) !important; - border-color: var(--gnome-button-suggested-action-border-color) !important; -} -#confirmation-hint .panel-arrow { - fill: var(--gnome-button-suggested-action-border-color) !important; - stroke: var(--gnome-button-suggested-action-border-color) !important; -} -#confirmation-hint-message { - color: white !important; } \ No newline at end of file