New CSD code
This commit is contained in:
Rafael Mardojai CM
parent
d098170f78
commit
df34cfd613
|
|
@ -1,71 +0,0 @@
|
|||
/* GNOME CSD styles for headerbar on Firefox [tabsintitlebar]+[inFullscreen] */
|
||||
|
||||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
:root[tabsintitlebar][inFullscreen] #nav-bar {
|
||||
margin-right: 123px !important;
|
||||
}
|
||||
|
||||
/* Move window buttons next to the header bar */
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls {
|
||||
-moz-appearance: none !important;
|
||||
background-image: var(--gnome-headerbar-bgimage) !important;
|
||||
border-bottom: var(--gnome-headerbar-border-bottom) !important;
|
||||
box-shadow: var(--gnome-headerbar-box-shadow);
|
||||
height: unset !important;
|
||||
padding-right: 3px;
|
||||
position: absolute !important;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:-moz-window-inactive {
|
||||
background-image: var(--gnome-inactive-headerbar-bgimage) !important;
|
||||
border-bottom: var(--gnome-inactive-headerbar-border-bottom) !important;
|
||||
box-shadow: var(--gnome-inactive-headerbar-box-shadow) !important;
|
||||
}
|
||||
|
||||
/* Window buttons */
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton {
|
||||
-moz-appearance: none !important;
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
border-color: transparent !important;
|
||||
border-radius: 3px !important;
|
||||
height: 34px;
|
||||
margin: 6px 3px !important;
|
||||
padding: 0 2px !important;
|
||||
width: 34px;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton .toolbarbutton-icon {
|
||||
filter: invert(85%);
|
||||
width: 16px;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:-moz-window-inactive toolbarbutton .toolbarbutton-icon {
|
||||
opacity: .7 !important;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:not(:-moz-window-inactive) toolbarbutton:not([disabled]):hover {
|
||||
background-image: var(--gnome-headerbar-button-hover-bgimage);
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:not(:-moz-window-inactive) toolbarbutton:not([disabled]):active {
|
||||
background-image: var(--gnome-headerbar-button-active-bgimage);
|
||||
box-shadow: var(--gnome-headerbar-button-active-box-shadow);
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:not(:-moz-window-inactive) toolbarbutton[disabled] {
|
||||
background-color: var(--gnome-headerbar-button-disabled-bgcolor);
|
||||
box-shadow: var(--gnome-headerbar-button-disabled-box-shadow);
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
}
|
||||
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls #close-button .toolbarbutton-icon {
|
||||
filter: var(--gnome-icons-hack-filter);
|
||||
list-style-image: url("moz-icon://stock/window-close-symbolic?size=dialog") !important;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls #restore-button .toolbarbutton-icon {
|
||||
filter: var(--gnome-icons-hack-filter);
|
||||
list-style-image: url("moz-icon://stock/view-restore-symbolic?size=dialog") !important;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls #minimize-button .toolbarbutton-icon {
|
||||
filter: var(--gnome-icons-hack-filter);
|
||||
list-style-image: url("moz-icon://stock/window-minimize-symbolic?size=dialog") !important;
|
||||
}
|
||||
|
|
@ -1,73 +0,0 @@
|
|||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
@media (-moz-gtk-csd-reversed-placement) {
|
||||
/* Navbar */
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
padding-left: 7px !important;
|
||||
padding-right: 3px !important;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* Window controls separator */
|
||||
:root[tabsintitlebar] #nav-bar::after {
|
||||
left: 3px;
|
||||
right: auto !important;
|
||||
}
|
||||
|
||||
/* Window buttons position */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container {
|
||||
left: 0;
|
||||
right: auto !important;
|
||||
}
|
||||
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox {
|
||||
padding-left: 3px;
|
||||
padding-right: 0 !important;;
|
||||
}
|
||||
|
||||
/* Window controls: at least 1 button */
|
||||
@media (-moz-gtk-csd-minimize-button), (-moz-gtk-csd-maximize-button), (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
margin-left: 43px;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
}
|
||||
/* Window controls: at least 2 buttons */
|
||||
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button),
|
||||
(-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button),
|
||||
(-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
margin-left: 83px;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
}
|
||||
/* Window controls: 3 buttons */
|
||||
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
margin-left: 123px;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* CSD rounded corners */
|
||||
:root[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) #nav-bar {
|
||||
border-top-left-radius: 0 !important;
|
||||
border-top-right-radius: 8px !important;
|
||||
}
|
||||
:root[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) .titlebar-buttonbox {
|
||||
border-top-left-radius: 8px !important;
|
||||
border-top-right-radius: 0 !important;
|
||||
}
|
||||
|
||||
/* Fullscreen */
|
||||
:root[tabsintitlebar][inFullscreen] #nav-bar {
|
||||
margin-left: 123px !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls {
|
||||
padding-left: 3px;
|
||||
padding-right: 0 !important;
|
||||
left: 0;
|
||||
right: auto !important;;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,55 +1,65 @@
|
|||
/* GNOME CSD styles for headerbar on Firefox [tabsintitlebar] */
|
||||
|
||||
@import "csd-fullscreen.css";
|
||||
@import "csd-left-controls.css";
|
||||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
/* Navbar position */
|
||||
/* Navbar */
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
padding-right: 7px !important;
|
||||
border-radius: 6px 6px 0 0;
|
||||
position: relative;
|
||||
}
|
||||
:root[tabsintitlebar] #toolbar-menubar:not([inactive=true]) {
|
||||
height: 30px !important;
|
||||
margin-bottom: 8px;
|
||||
|
||||
/* Window controls: at least 1 button */
|
||||
@media (-moz-gtk-csd-minimize-button), (-moz-gtk-csd-maximize-button), (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
|
||||
padding-right: 50px !important;
|
||||
}
|
||||
}
|
||||
/* Window controls: at least 2 buttons */
|
||||
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button),
|
||||
(-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button),
|
||||
(-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
|
||||
padding-right: 90px !important;
|
||||
}
|
||||
}
|
||||
/* Window controls: 3 buttons */
|
||||
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
|
||||
padding-right: 130px !important;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar {
|
||||
-moz-appearance: none !important;
|
||||
}
|
||||
|
||||
/* Add window controls separator */
|
||||
:root[tabsintitlebar] #nav-bar::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
top: 6px;
|
||||
height: 34px;
|
||||
border-right: 1px solid rgba(0, 0, 0, .1);
|
||||
/* Fullscreen */
|
||||
:root[tabsintitlebar][inFullscreen] #nav-bar {
|
||||
padding-right: 50px !important;
|
||||
}
|
||||
|
||||
/* Move window buttons next to the header bar */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container {
|
||||
/* Window buttons box */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls {
|
||||
padding: 0 3px 0 4px;
|
||||
position: absolute !important;
|
||||
right: 0;
|
||||
top: 0;
|
||||
-moz-appearance: none !important;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox {
|
||||
background-image: var(--gnome-headerbar-bgimage) !important;
|
||||
border-bottom: var(--gnome-headerbar-border-bottom) !important;
|
||||
box-shadow: var(--gnome-headerbar-box-shadow);
|
||||
height: unset !important;
|
||||
padding-right: 3px;
|
||||
-moz-appearance: none !important;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox:-moz-window-inactive {
|
||||
background-image: var(--gnome-inactive-headerbar-bgimage) !important;
|
||||
border-bottom: var(--gnome-inactive-headerbar-border-bottom) !important;
|
||||
box-shadow: var(--gnome-inactive-headerbar-box-shadow) !important;
|
||||
|
||||
/* Window buttons separator */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 6px;
|
||||
height: 34px;
|
||||
border-right: 1px solid rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/* Window buttons */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button {
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton {
|
||||
-moz-appearance: none !important;
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
border-color: transparent !important;
|
||||
|
|
@ -60,23 +70,28 @@
|
|||
transition: all .3s ease-out;
|
||||
width: 34px;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button .toolbarbutton-icon {
|
||||
:root[tabsintitlebar] #titlebar .titlebar-button .toolbarbutton-icon,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton .toolbarbutton-icon {
|
||||
filter: invert(85%);
|
||||
width: 16px;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-button .toolbarbutton-icon {
|
||||
opacity: .7 !important;
|
||||
:root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-button .toolbarbutton-icon,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:-moz-window-inactive toolbarbutton .toolbarbutton-icon {
|
||||
opacity: .5 !important;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar:not(:-moz-window-inactive) .titlebar-button:not([disabled]):hover {
|
||||
:root[tabsintitlebar] #titlebar:not(:-moz-window-inactive) .titlebar-button:not([disabled]):hover,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:not(:-moz-window-inactive) toolbarbutton:not([disabled]):hover {
|
||||
background-image: var(--gnome-headerbar-button-hover-bgimage);
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar:not(:-moz-window-inactive) .titlebar-button:not([disabled]):active {
|
||||
:root[tabsintitlebar] #titlebar:not(:-moz-window-inactive) .titlebar-button:not([disabled]):active,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:not(:-moz-window-inactive) toolbarbutton:not([disabled]):active {
|
||||
background-image: var(--gnome-headerbar-button-active-bgimage);
|
||||
box-shadow: var(--gnome-headerbar-button-active-box-shadow);
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
}
|
||||
:root[tabsintitlebar] #titlebar:not(:-moz-window-inactive) .titlebar-button[disabled] {
|
||||
:root[tabsintitlebar] #titlebar:not(:-moz-window-inactive) .titlebar-button[disabled],
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls:not(:-moz-window-inactive) toolbarbutton[disabled] {
|
||||
background-color: var(--gnome-headerbar-button-disabled-bgcolor);
|
||||
box-shadow: var(--gnome-headerbar-button-disabled-box-shadow);
|
||||
border: var(--gnome-headerbar-button-border) !important;
|
||||
|
|
@ -94,42 +109,67 @@
|
|||
filter: var(--gnome-icons-hack-filter);
|
||||
list-style-image: url("moz-icon://stock/window-minimize-symbolic?size=dialog") !important;
|
||||
}
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls #restore-button .toolbarbutton-icon {
|
||||
filter: var(--gnome-icons-hack-filter);
|
||||
list-style-image: url("moz-icon://stock/view-restore-symbolic?size=dialog") !important;
|
||||
}
|
||||
|
||||
/* Fix the issue when dragging tabs */
|
||||
:root[tabsintitlebar] #navigator-toolbox[movingtab] #TabsToolbar {
|
||||
padding-bottom: 0 !important;
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls #close-button,
|
||||
:root[tabsintitlebar][inFullscreen] #window-controls #minimize-button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Left window buttons */
|
||||
@media (-moz-gtk-csd-reversed-placement) {
|
||||
:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
|
||||
padding-right: 3px !important;
|
||||
}
|
||||
|
||||
/* Window buttons box */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container {
|
||||
padding: 0 3px 0 4px;
|
||||
left: 0;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
/* Window buttons separator */
|
||||
:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container::after {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
/* Window controls: at least 1 button */
|
||||
@media (-moz-gtk-csd-minimize-button), (-moz-gtk-csd-maximize-button), (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
margin-right: 43px;
|
||||
:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
|
||||
padding-left: 50px !important;
|
||||
}
|
||||
}
|
||||
/* Window controls: at least 2 buttons */
|
||||
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button),
|
||||
(-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button),
|
||||
(-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
margin-right: 83px;
|
||||
:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
|
||||
padding-left: 90px !important;
|
||||
}
|
||||
}
|
||||
/* Window controls: 3 buttons */
|
||||
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
|
||||
:root[tabsintitlebar] #nav-bar {
|
||||
margin-right: 123px;
|
||||
:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
|
||||
padding-left: 130px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* CSD rounded corners */
|
||||
:root[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) #navigator-toolbox {
|
||||
border: 1px solid var(--gnome-window-border-color) !important;
|
||||
border-radius: 8px 8px 0 0 !important;
|
||||
margin: -1px -1px 0 -1px !important;
|
||||
/* */
|
||||
:root[tabsintitlebar] #toolbar-menubar:not([inactive=true]) {
|
||||
height: 30px !important;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
:root[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) #nav-bar {
|
||||
border-top-left-radius: 8px;
|
||||
:root[tabsintitlebar] #titlebar {
|
||||
-moz-appearance: none !important;
|
||||
}
|
||||
:root[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) .titlebar-buttonbox {
|
||||
border-top-right-radius: 8px;
|
||||
|
||||
/* Fix the issue when dragging tabs */
|
||||
:root[tabsintitlebar] #navigator-toolbox[movingtab] #TabsToolbar {
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
|
@ -8,22 +8,33 @@
|
|||
@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
|
||||
|
||||
/* Toolbox colors */
|
||||
#navigator-toolbox {
|
||||
background-color: var(--gnome-tabbar-bgcolor) !important;
|
||||
border-bottom: var(--gnome-tabbar-border-bottom);
|
||||
#PersonalToolbar, #toolbar-menubar, #TabsToolbar {
|
||||
background-color: var(--gnome-toolbar-bgcolor) !important;
|
||||
border-bottom: var(--gnome-toolbar-border-bottom) !important;
|
||||
}
|
||||
#navigator-toolbox:-moz-window-inactive {
|
||||
background-color: var(--gnome-inactive-tabbar-bgcolor) !important;
|
||||
border-bottom: var(--gnome-inactive-tabbar-border-bottom);
|
||||
#PersonalToolbar:-moz-window-inactive, #toolbar-menubar:-moz-window-inactive, #TabsToolbar:-moz-window-inactive {
|
||||
background-color: var(--gnome-inactive-toolbar-bgcolor) !important;
|
||||
border-bottom: var(--gnome-inactive-toolbar-border-bottom) !important;
|
||||
}
|
||||
|
||||
/* Menu bar */
|
||||
#navigator-toolbox:-moz-window-inactive label, #navigator-toolbox:-moz-window-inactive image {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#toolbar-menubar:not([inactive=true]) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
#PersonalToolbar {
|
||||
height: 38px;
|
||||
}
|
||||
|
||||
/* Menu bar
|
||||
#toolbar-menubar:not([inactive=true]) {
|
||||
border-bottom: var(--gnome-bookmarkbar-border-bottom) !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
/* Bookmark bar */
|
||||
/* Bookmark bar
|
||||
#PersonalToolbar {
|
||||
border-bottom: var(--gnome-bookmarkbar-border-bottom) !important;
|
||||
height: var(--gnome-bookmarkbar-height);
|
||||
|
|
@ -31,7 +42,7 @@
|
|||
#PersonalToolbar:-moz-window-inactive {
|
||||
background-color: var(--gnome-inactive-tabbar-bgcolor) !important;
|
||||
border-top: var(--gnome-inactive-bookmarkbar-border-bottom) !important;
|
||||
}
|
||||
} */
|
||||
|
||||
/* Overrides: Remove border below the menu bar / above the header bar */
|
||||
#TabsToolbar:not([collapsed="true"]) + #nav-bar {
|
||||
|
|
|
|||
|
|
@ -10,6 +10,10 @@
|
|||
:root {
|
||||
--space-above-tabbar: 0 !important;
|
||||
}
|
||||
#main-window {
|
||||
-moz-appearance: -moz-window-titlebar !important;
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
#search-box {
|
||||
|
|
|
|||
Loading…
Reference in New Issue