mirror of
https://github.com/vinceliuice/Colloid-gtk-theme.git
synced 2025-09-15 21:08:39 -07:00
422 lines
8.3 KiB
SCSS
422 lines
8.3 KiB
SCSS
//
|
|
// Tilix *
|
|
//
|
|
overlay > revealer {
|
|
&.left > scrolledwindow.frame,
|
|
&.right > scrolledwindow.frame {
|
|
border-style: none;
|
|
box-shadow: $shadow-z16;
|
|
}
|
|
|
|
&.left > scrolledwindow.frame { margin-right: 32px; }
|
|
|
|
&.right > scrolledwindow.frame { margin-left: 32px; }
|
|
}
|
|
|
|
.terminix-session-sidebar, // for backward compatibility
|
|
.tilix-session-sidebar { background-image: image($surface); }
|
|
|
|
.terminal-titlebar button { border-radius: 0; }
|
|
|
|
button.image-button.session-new-button { min-width: $medium-size - 4px; }
|
|
|
|
// Remove extra padding
|
|
notebook.tilix-background tab > box > stack { margin: -6px; }
|
|
|
|
button.flat.tilix-small-button {
|
|
// NOTE: padding is hard-coded with:
|
|
// padding: 2px 4px;
|
|
min-height: $small-size - 2px * 2;
|
|
min-width: $small-size - 4px * 2;
|
|
}
|
|
|
|
//
|
|
// Terminator *
|
|
//
|
|
.terminator-terminal-window {
|
|
paned > separator { background-color: $background; }
|
|
|
|
// this should be fixed by the upstream
|
|
notebook.frame { border-style: none; }
|
|
}
|
|
|
|
//
|
|
// Ubitquity *
|
|
//
|
|
#live_installer .menubar progressbar trough {
|
|
border-radius: 4px; // Adjust to hard-coded progress border-radius
|
|
background-color: $titlebar-track-disabled;
|
|
}
|
|
|
|
//
|
|
// Meld *
|
|
//
|
|
.meld-notebook {
|
|
&, > stack {
|
|
background: none;
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
}
|
|
|
|
.meld-notebook-child {
|
|
background-color: $base-alt;
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
|
|
statusbar.meld-status-bar {
|
|
background: none;
|
|
}
|
|
|
|
|
|
//
|
|
// Eclipse *
|
|
//
|
|
window.background > box.vertical > scrolledwindow > widget toolbar {
|
|
padding: 2px;
|
|
|
|
separator,
|
|
button { margin: 2px; }
|
|
|
|
button { border-radius: $corner-radius; }
|
|
}
|
|
|
|
|
|
//
|
|
// Chromium *
|
|
//
|
|
window.background.chromium {
|
|
background-color: $surface;
|
|
|
|
// FIXME: There is no way to change the color of the toolbar buttons
|
|
// toolbar button { color: $text-secondary; }
|
|
|
|
// toolbar's border-bottom refers to button's border
|
|
// FIXME: Chrome's button border ignores theme's alpha value :(
|
|
entry,
|
|
> button { border: 1px solid $solid-border; }
|
|
|
|
> button {
|
|
color: $primary;
|
|
|
|
&:disabled { color: $text-secondary-disabled; }
|
|
}
|
|
|
|
menubar,
|
|
headerbar { color: $titlebar-text-secondary; }
|
|
|
|
headerbar.titlebar {
|
|
padding: 0 $space-size * 2;
|
|
|
|
button:active { background-color: $overlay-active; } // Workaround for non-animatable buttons in headerbar
|
|
}
|
|
|
|
spinner { color: $primary; }
|
|
|
|
// For text field
|
|
textview.view { background-color: transparent; }
|
|
|
|
// For prominent button, starred icon, etc.
|
|
treeview.view.cell:selected:focus {
|
|
background-color: $primary;
|
|
color: on($primary);
|
|
}
|
|
|
|
// For table header
|
|
treeview.view button {
|
|
border: 1px solid $track;
|
|
background-color: $base; // FIXME: This should not be necessary
|
|
// color: $text-secondary;
|
|
}
|
|
|
|
menu {
|
|
border-color: if($variant == 'light', darken($background, 20%), lighten($background, 16%));
|
|
|
|
menuitem { border-radius: 0; }
|
|
}
|
|
}
|
|
|
|
tooltip.background.chromium { background-color: rgba($tooltip, 1); }
|
|
|
|
|
|
//
|
|
// Firefox
|
|
//
|
|
#MozillaGtkWidget {
|
|
decoration { border: none; }
|
|
|
|
&.background headerbar.titlebar.default-decoration button.titlebutton {
|
|
@extend %firefox_window_button;
|
|
}
|
|
|
|
> widget {
|
|
// For popover, entry in toolbar, etc.
|
|
text { background-color: $surface; }
|
|
|
|
// For selection, active tab indicator, etc.
|
|
text:selected {
|
|
// Use traditional selection style as workaround
|
|
background-color: $primary;
|
|
color: on($primary);
|
|
}
|
|
|
|
// For separators in bookmark toolbar
|
|
> separator { color: $solid-border; }
|
|
|
|
// avoid black border
|
|
> scrollbar { background-clip: border-box; }
|
|
|
|
// Emphasize toolbar's border-bottom
|
|
> frame > border { border-color: $solid-border; }
|
|
|
|
> entry,
|
|
> button > button {
|
|
border: 1px solid $solid-border;
|
|
border-radius: $corner-radius;
|
|
box-shadow: none;
|
|
|
|
&:disabled { border-color: $track-disabled; }
|
|
}
|
|
|
|
> entry {
|
|
min-height: 32px - 2px;
|
|
background-color: $base;
|
|
|
|
&:focus {
|
|
border-color: $primary;
|
|
box-shadow: inset 0 0 0 1px $primary;
|
|
}
|
|
|
|
&:disabled { background-color: $base-alt; }
|
|
}
|
|
|
|
> button > button {
|
|
padding: 4px 8px;
|
|
background-size: auto;
|
|
|
|
&:hover { box-shadow: inset 0 0 0 9999px $overlay-hover; }
|
|
|
|
&:active { background-image: image($overlay-active); }
|
|
}
|
|
|
|
// use 16px assets for hard-coded sizing
|
|
> checkbutton > check { @extend %small_check; }
|
|
|
|
> radiobutton > radio { @extend %small_radio; }
|
|
|
|
> checkbutton > check,
|
|
> radiobutton > radio {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
// make check/radio visible regardless of whether the background is bright or dark
|
|
> checkbutton > check:not(:checked):not(:indeterminate),
|
|
> radiobutton > radio:not(:checked):not(:indeterminate) {
|
|
color: $grey-600;
|
|
|
|
&:hover, &:active { color: $grey-500; }
|
|
|
|
&:disabled { color: rgba($grey-600, 0.5); }
|
|
}
|
|
}
|
|
|
|
// remove ugly border around the menus
|
|
menu { border: none; }
|
|
}
|
|
|
|
// for backward compatibility
|
|
#MozillaGtkWidget {
|
|
> widget {
|
|
> menubar {
|
|
color: $titlebar-text-secondary;
|
|
|
|
&:hover { color: $titlebar-text; }
|
|
|
|
&:disabled { color: $titlebar-text-secondary-disabled; }
|
|
}
|
|
|
|
> frame { color: $solid-border; }
|
|
}
|
|
|
|
menu > separator { color: $solid-border; }
|
|
}
|
|
|
|
//
|
|
// plank
|
|
//
|
|
|
|
window.background:not(.csd) {
|
|
> window > menu {
|
|
menuitem {
|
|
transition: none; // Fixed plank menu background issue
|
|
}
|
|
}
|
|
}
|
|
|
|
//
|
|
// Inkscape
|
|
//
|
|
|
|
#ToolboxCommon {
|
|
> #AuxToolbox {
|
|
#StyleSwatch { font-size: smaller; }
|
|
|
|
#Kludge { padding: 0; }
|
|
|
|
spinbutton,
|
|
entry { min-height: 32px; }
|
|
|
|
button:not(.up):not(.down) {
|
|
min-height: 24px;
|
|
min-width: 16px;
|
|
padding: 4px 8px;
|
|
// border-radius: $corner-radius;
|
|
}
|
|
|
|
spinbutton button { border-width: 4px; }
|
|
}
|
|
|
|
> toolbar.vertical {
|
|
margin-top: -4px;
|
|
|
|
button {
|
|
min-height: 24px;
|
|
min-width: 24px;
|
|
padding: 4px;
|
|
// border-radius: $corner-radius;
|
|
}
|
|
}
|
|
}
|
|
|
|
#TopToolbars .toolbar {
|
|
background: none;
|
|
}
|
|
|
|
#Statusbar {
|
|
padding: 3px 0 3px 8px;
|
|
|
|
spinbutton, box > button.flat {
|
|
margin: 3px 0;
|
|
}
|
|
}
|
|
|
|
#CanvasTable {
|
|
button {
|
|
min-height: 16px;
|
|
min-width: 16px;
|
|
padding: 0;
|
|
}
|
|
|
|
#HorizontalScrollbar { border-top: 1px solid $divider; }
|
|
|
|
#VerticalScrollbar {
|
|
&:dir(ltr) { border-left: 1px solid $divider; }
|
|
|
|
&:dir(rtl) { border-right: 1px solid $divider; }
|
|
}
|
|
}
|
|
|
|
#Canvas_and_Dock {
|
|
frame > border { border: none; }
|
|
|
|
// each canvases' titlebar
|
|
widget > widget {
|
|
> button.flat {
|
|
min-height: 16px;
|
|
min-width: 16px;
|
|
padding: 4px;
|
|
}
|
|
|
|
> box.horizontal image { padding: 4px; }
|
|
}
|
|
|
|
// vertical dock buttons
|
|
box.horizontal > box.vertical > button.flat {
|
|
min-height: 16px;
|
|
min-width: 24px;
|
|
padding: 8px 4px;
|
|
}
|
|
}
|
|
|
|
window.bright.symbolic {
|
|
scrolledwindow > viewport.frame > notebook {
|
|
tabs > tab {
|
|
padding: $space-size / 2 $space-size;
|
|
|
|
button.close-button {
|
|
margin: 4px 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
popover#ContextMenu { // not use ?
|
|
border-radius: $menu-radius;
|
|
background-clip: content-box;
|
|
|
|
modelbutton.flat {
|
|
border-radius: $corner-radius;
|
|
}
|
|
}
|
|
|
|
|
|
//
|
|
// Synapse
|
|
//
|
|
box.vertical > widget > widget:selected { @extend %selected_items; }
|
|
|
|
|
|
//
|
|
// Libreoffice
|
|
//
|
|
window.background {
|
|
> grid > widget > widget > scrolledwindow > viewport > grid > box > box > frame > box {
|
|
background-color: $base;
|
|
}
|
|
}
|
|
|
|
|
|
//
|
|
// Pamac
|
|
//
|
|
window.background.csd {
|
|
> box.vertical > overlay > stack > box.vertical > box.horizontal {
|
|
> revealer > stack {
|
|
&, // Search left side
|
|
> scrolledwindow > viewport.frame, // Installed left side
|
|
> box.vertical > stack > scrolledwindow > viewport.frame { // Browse left side
|
|
> list {
|
|
border: none;
|
|
border-radius: 0;
|
|
|
|
> row.activatable {
|
|
border-radius: $corner-radius;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
//
|
|
// KiCad / SLADE
|
|
//
|
|
|
|
window.background:not(.csd):not(.solid-csd) {
|
|
> button:not(:hover):not(:active):not(:checked):not(:disabled):not(.flat) { // Why this ?
|
|
background-color: $base-alt;
|
|
}
|
|
}
|
|
|
|
//
|
|
// FileZilla
|
|
//
|
|
|
|
window.background:not(.csd) {
|
|
> box > widget > widget > widget > widget > widget > widget > widget > scrolledwindow {
|
|
entry:focus {
|
|
background-color: if($variant == 'light', mix(black, $background, 5%), mix(white, $background, 5%));
|
|
}
|
|
}
|
|
}
|