You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
2125 lines
45 KiB
SCSS
2125 lines
45 KiB
SCSS
/************
|
|
* Nautilus *
|
|
************/
|
|
// based css:
|
|
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/Adwaita.css
|
|
// hard-coded css:
|
|
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/nautilus.css
|
|
|
|
.nautilus-window {
|
|
&.background.csd.unified {
|
|
headerbar { box-shadow: none; } // reset
|
|
}
|
|
|
|
&.background.csd {
|
|
background-color: if($topbar == 'dark' and $variant == 'light', $titlebar, $base);
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
|
|
headerbar {
|
|
padding-left: 12px;
|
|
background-color: if($topbar == 'dark' and $variant == 'light', $titlebar, $base);
|
|
box-shadow: inset 0 1px highlight($titlebar);
|
|
}
|
|
|
|
> grid.horizontal > paned.horizontal > separator,
|
|
> deck > box.vertical > paned.horizontal > separator { margin-left: if($topbar == 'dark' and $variant == 'light', -1px, 0); }
|
|
|
|
placessidebar {
|
|
background-color: transparent;
|
|
border-radius: $window-radius;
|
|
color: $titlebar-text-secondary;
|
|
|
|
> viewport.frame {
|
|
margin: 8px 0 12px 12px;
|
|
border-radius: $window-radius - 6px;
|
|
background-color: if($topbar == 'dark' and $variant == 'light', transparent, rgba($primary, 0.08));
|
|
|
|
> list {
|
|
padding: 12px 0 12px 0;
|
|
background: none;
|
|
border-radius: $window-radius - 6px;
|
|
|
|
> row.activatable {
|
|
border-radius: 0;
|
|
margin: -8px 0 -8px 0;
|
|
|
|
&, &:focus, &:hover, &:active {
|
|
background-image: none;
|
|
box-shadow: none;
|
|
animation: none;
|
|
}
|
|
|
|
&, image.sidebar-icon, label.sidebar-label {
|
|
color: $titlebar-text-secondary;
|
|
}
|
|
|
|
image.sidebar-icon {
|
|
padding-right: 8px;
|
|
}
|
|
|
|
label.sidebar-label {
|
|
color: inherit;
|
|
min-height: 54px;
|
|
padding: 0 0 0 4px;
|
|
}
|
|
|
|
&.sidebar-placeholder-row { background-color: transparent; }
|
|
|
|
&:drop(active) {
|
|
border-radius: 0;
|
|
|
|
@if $topbar == 'dark' {
|
|
border-radius: $circular_radius 0 0 $circular_radius;
|
|
}
|
|
|
|
background-color: rgba($drop_target_color, 0.1);
|
|
|
|
&, image.sidebar-icon, label.sidebar-label {
|
|
color: $drop_target_color;
|
|
}
|
|
}
|
|
|
|
button.sidebar-button {
|
|
@if $topbar == 'dark' { @extend %button-on-dark; }
|
|
}
|
|
|
|
&:hover {
|
|
image.sidebar-icon, label.sidebar-label { color: $primary; }
|
|
}
|
|
|
|
&:selected {
|
|
background-color: transparent;
|
|
font-weight: 700;
|
|
// font-size: larger;
|
|
|
|
image.sidebar-icon { color: $primary; }
|
|
|
|
label.sidebar-label {
|
|
color: $primary;
|
|
background-color: $base;
|
|
box-shadow: 4px 0 $base;
|
|
padding: 0 0 0 14px;
|
|
border-image-width: 10px 10px 10px 18px;
|
|
border-image-slice: 10 10 10 18;
|
|
border-image-repeat: stretch;
|
|
border-image-source: -gtk-scaled(url("assets/row-selected#{$blackness-asset-suffix}#{$theme-asset-suffix}.png"),
|
|
url("assets/row-selected#{$blackness-asset-suffix}#{$theme-asset-suffix}@2.png"));
|
|
}
|
|
|
|
revealer.sidebar-revealer {
|
|
padding-right: 0;
|
|
}
|
|
|
|
button.sidebar-button {
|
|
margin-right: 8px;
|
|
margin-left: -32px;
|
|
|
|
@extend %button-flat-simple;
|
|
}
|
|
}
|
|
|
|
&:disabled {
|
|
&, image.sidebar-icon, label.sidebar-label {
|
|
color: $titlebar-text-secondary-disabled;
|
|
}
|
|
}
|
|
}
|
|
|
|
> separator { background: none; }
|
|
}
|
|
}
|
|
|
|
scrollbar {
|
|
background: none;
|
|
border: none;
|
|
}
|
|
|
|
> undershoot {
|
|
&.top {
|
|
background: none;
|
|
}
|
|
|
|
&.bottom {
|
|
background: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.nautilus-list-view {
|
|
background-color: transparent;
|
|
border-radius: $window-radius;
|
|
|
|
treeview.view:not(:hover):not(:active):not(:selected) {
|
|
background-color: transparent;
|
|
border-radius: 0;
|
|
// @extend %view;
|
|
|
|
> header > button {
|
|
&:first-child { border-top-left-radius: $window-radius; }
|
|
&:last-child { border-top-right-radius: $window-radius; }
|
|
}
|
|
}
|
|
}
|
|
|
|
notebook {
|
|
background: none;
|
|
margin: if($topbar == 'dark' and $variant == 'light', (0 6px 6px 0), 0);
|
|
|
|
> header {
|
|
padding: 0 16px;
|
|
background: none;
|
|
border-color: if($topbar == 'dark' and $variant == 'light', transparent, $solid-border);
|
|
|
|
tab {
|
|
color: $titlebar-text-secondary;
|
|
|
|
&:hover:not(:checked):not(:active) {
|
|
color: $titlebar-text;
|
|
background-color: if($topbar == 'dark', rgba($titlebar-text, 0.05), $fill);
|
|
}
|
|
|
|
&:disabled { color: $titlebar-text-secondary-disabled; }
|
|
|
|
&:checked, &:active {
|
|
color: $text;
|
|
border-color: if($topbar == 'dark' and $variant == 'light', transparent, $solid-border);
|
|
|
|
&:disabled { color: $text-disabled; }
|
|
|
|
button.flat { @extend %button-flat-simple; }
|
|
}
|
|
|
|
button.flat {
|
|
@if $topbar == 'dark' {
|
|
@extend %button-on-dark;
|
|
}
|
|
@else {
|
|
@extend %button-flat-simple;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
> stack {
|
|
background-color: $base;
|
|
border-radius: $window-radius - 2px;
|
|
}
|
|
|
|
scrolledwindow > .view:not(:selected):not(:hover):not(:checked) {
|
|
background-color: transparent;
|
|
}
|
|
|
|
scrolledwindow .view:selected {
|
|
background-color: mix($primary, $base, 15%);
|
|
}
|
|
|
|
placesview {
|
|
> stack > frame > scrolledwindow > viewport > list { background-color: transparent; }
|
|
> actionbar {
|
|
background-color: transparent;
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
|
|
> revealer > box { background-color: transparent; }
|
|
}
|
|
}
|
|
}
|
|
|
|
paned > separator {
|
|
background: none;
|
|
|
|
&.wide {
|
|
min-width: 0;
|
|
min-height: 0;
|
|
background: none;;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.maximized { // No border radius when window maximized
|
|
&, placessidebar { border-radius: 0; }
|
|
}
|
|
|
|
// Floating status bar
|
|
.floating-bar {
|
|
min-height: 32px;
|
|
padding: 0;
|
|
margin: 6px;
|
|
border-style: none;
|
|
border-radius: $window-radius;
|
|
background-color: rgba($background, 0.95);
|
|
|
|
button {
|
|
margin: (32px - $small-size) / 2;
|
|
|
|
@extend %small-button;
|
|
}
|
|
}
|
|
}
|
|
|
|
// .nautilus-canvas-item {
|
|
// border-radius: $corner-radius;
|
|
// }
|
|
|
|
.nautilus-canvas-item.dim-label,
|
|
.nautilus-list-dim-label {
|
|
color: $text-secondary;
|
|
}
|
|
|
|
%desktop-canvas-item,
|
|
.nautilus-desktop.nautilus-canvas-item {
|
|
// background-color: $scrim;
|
|
color: on(dark);
|
|
text-shadow: $text-shadow;
|
|
}
|
|
|
|
// Toolbar
|
|
|
|
@keyframes nautilus-operations-button-needs-attention {
|
|
to { background-color: $overlay-focus; }
|
|
}
|
|
|
|
.nautilus-operations-button-needs-attention {
|
|
animation: nautilus-operations-button-needs-attention $ripple-fade-out-duration $ease 2 alternate;
|
|
}
|
|
|
|
.nautilus-operations-button-needs-attention-multiple {
|
|
animation: nautilus-operations-button-needs-attention $ripple-fade-out-duration $ease 6 alternate;
|
|
}
|
|
|
|
.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):not(:only-child).disclosure-button { @extend %circular-button; }
|
|
|
|
// Path bar
|
|
.path-bar-box {
|
|
transition: background-color $duration $ease-out;
|
|
margin: $container-padding 0;
|
|
border-radius: $circular-radius;
|
|
|
|
button { margin: 0; } // reset the margin
|
|
|
|
&.width-maximized { background-color: $titlebar-fill; }
|
|
|
|
// workaround for 3.30.1
|
|
&.background.frame {
|
|
border-style: none;
|
|
background-color: $titlebar-fill;
|
|
}
|
|
|
|
// for 3.30
|
|
.path-bar button {
|
|
label:not(:only-child) {
|
|
&:first-child { margin-left: 0; }
|
|
|
|
&:last-child { margin-right: 0; }
|
|
}
|
|
}
|
|
|
|
// for 3.32
|
|
.linked.nautilus-path-bar button:not(.suggested-action):not(.destructive-action) {
|
|
padding-left: ($medium-size - 12px) / 2;
|
|
padding-right: ($medium-size - 12px) / 2;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
|
|
label:not(:only-child) {
|
|
&:first-child { margin-left: 0; }
|
|
|
|
&:last-child { margin-right: 0; }
|
|
}
|
|
|
|
&.text-button {
|
|
min-width: 0;
|
|
border-radius: $circular_radius;
|
|
}
|
|
|
|
&.text-button.image-button {
|
|
border-radius: $circular_radius;
|
|
image:not(:only-child) { margin: 0; }
|
|
}
|
|
|
|
&:last-child:dir(ltr),
|
|
&:first-child:dir(rtl) {
|
|
background-color: rgba($titlebar-text, 0.08);
|
|
|
|
&:disabled {
|
|
background-color: transparent;
|
|
color: $titlebar-text-disabled;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.disk-space-display {
|
|
// border-style: solid;
|
|
// border-width: 2px;
|
|
|
|
&.unknown {
|
|
background-color: $track;
|
|
color: $track;
|
|
}
|
|
|
|
&.used {
|
|
background-color: $primary;
|
|
color: $primary;
|
|
}
|
|
|
|
&.free {
|
|
background-color: $track-disabled;
|
|
color: $track-disabled;
|
|
}
|
|
}
|
|
|
|
// View
|
|
// Hide superfluous treeview drop target indication
|
|
.nautilus-list-view .view:not(.dnd) {
|
|
// border-bottom: 1px solid $divider;
|
|
}
|
|
|
|
.search-information {
|
|
padding: 2px;
|
|
border-bottom: 1px solid $divider;
|
|
background-color: $base;
|
|
color: $text;
|
|
}
|
|
|
|
.documents-entry-tag {
|
|
@extend .entry-tag;
|
|
}
|
|
|
|
.conflict-row:not(:selected) { background-color: mix($warning, $base, percentage(0.3)); }
|
|
|
|
// Icon view
|
|
.nautilus-window flowboxchild {
|
|
// .icon-background { background-color: black; }
|
|
|
|
.icon-item-background {
|
|
padding: 4px;
|
|
border-radius: $bar-size;
|
|
}
|
|
|
|
&:selected {
|
|
background-color: transparent;
|
|
|
|
.icon-item-background { @extend %selected_items_color; }
|
|
}
|
|
}
|
|
|
|
.nautilus-window notebook :not(treeview).view {
|
|
border-radius: $bar-size;
|
|
|
|
selection,
|
|
&:selected {
|
|
@extend %selected_items_color;
|
|
}
|
|
}
|
|
|
|
// Batch rename dialog
|
|
dialog.background > box.dialog-vbox.vertical > grid.horizontal {
|
|
> scrolledwindow.frame { border-style: none; }
|
|
|
|
> box.horizontal:last-child {
|
|
margin: -6px 0 0 -6px;
|
|
border-top: 1px solid $divider;
|
|
|
|
> label { margin: 0 8px; }
|
|
|
|
> box > button { border-radius: 0; }
|
|
}
|
|
}
|
|
|
|
// Tweak to fix the messy sizing of the popover menu
|
|
.nautilus-window > popover.menu:not(:last-child) {
|
|
padding: 3px;
|
|
|
|
> stack > box > box > box {
|
|
margin-top: -6px;
|
|
|
|
> box {
|
|
margin-bottom: -6px;
|
|
|
|
&.linked { margin-top: 1px; }
|
|
}
|
|
}
|
|
|
|
separator { margin-bottom: -2px; }
|
|
}
|
|
|
|
.nautilus-menu-sort-heading {
|
|
// min-height: 26px;
|
|
// padding-left: 5px;
|
|
// padding-right: 5px;
|
|
margin: 1px 3px;
|
|
font-weight: 500;
|
|
|
|
&:disabled { color: $text-secondary; }
|
|
}
|
|
|
|
// Make operations button circular
|
|
.nautilus-window headerbar revealer > button { @extend %circular-button; }
|
|
|
|
// Ensure paned separator rendering. See issue #84 for details.
|
|
.nautilus-window paned > separator { background-color: $base-alt; }
|
|
|
|
|
|
/*********
|
|
* gedit *
|
|
*********/
|
|
// based css:
|
|
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit.adwaita.css
|
|
// hard-coded css:
|
|
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit-style.css
|
|
|
|
window.org-gnome-gedit {
|
|
> paned.titlebar {
|
|
> separator { background-color: transparent; }
|
|
}
|
|
|
|
> overlay > box.vertical {
|
|
> paned.gedit-side-panel-paned {
|
|
|
|
// 'file-browser' pane
|
|
> box.vertical > stack > grid.horizontal {
|
|
> box.horizontal { // header-part
|
|
margin: 4px 0;
|
|
}
|
|
|
|
> scrolledwindow { // raised widget
|
|
border-bottom-left-radius: $window-radius;
|
|
|
|
treeview.view:not(:hover):not(:selected) {
|
|
background: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 'files' pane
|
|
stack {
|
|
scrolledwindow {
|
|
viewport.frame {
|
|
list.gedit-document-panel {
|
|
background: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Only normal state is handle
|
|
.open-document-selector-path-label {
|
|
color: $text-secondary;
|
|
font-size: smaller;
|
|
}
|
|
|
|
// Only normal state is handle
|
|
.open-document-selector-match {
|
|
background-color: $warning;
|
|
color: on($warning);
|
|
}
|
|
|
|
.gedit-document-panel {
|
|
background-color: $base-alt;
|
|
|
|
// Try to look as the notebook tab close button
|
|
row button.flat {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
|
|
@extend %small-button;
|
|
}
|
|
}
|
|
|
|
.gedit-document-panel-group-row:not(:first-child) {
|
|
border-top: 1px solid $divider;
|
|
}
|
|
|
|
.gedit-side-panel-paned statusbar {
|
|
border-top: 1px solid $divider;
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
|
|
.gedit-search-slider {
|
|
margin: 4px 4px 8px;
|
|
|
|
.linked:not(.vertical) > entry {
|
|
border-radius: $corner-radius;
|
|
@extend %entry_raised;
|
|
|
|
.gedit-search-entry-occurrences-tag {
|
|
all: unset;
|
|
color: $text-secondary;
|
|
}
|
|
|
|
$buttons_width: $small-size * 2 + $container-padding * 3;
|
|
|
|
&:dir(ltr) {
|
|
margin-right: -$buttons_width;
|
|
padding-right: $buttons_width;
|
|
|
|
.gedit-search-entry-occurrences-tag { margin-left: $container-padding; }
|
|
|
|
image.right { margin-right: 0; }
|
|
}
|
|
|
|
&:dir(rtl) {
|
|
margin-left: -$buttons_width;
|
|
padding-left: $buttons_width;
|
|
|
|
.gedit-search-entry-occurrences-tag { margin-right: $container-padding; }
|
|
|
|
image.left { margin-left: 0; }
|
|
}
|
|
|
|
&:not(.error) { background-color: $surface; }
|
|
|
|
&.error ~ button {
|
|
color: on($error, secondary);
|
|
|
|
&:hover, &:active { color: on($error); }
|
|
|
|
&:disabled { color: on($error, secondary-disabled); }
|
|
}
|
|
}
|
|
|
|
.linked > button {
|
|
border: solid $container-padding transparent;
|
|
border-radius: $circular-radius;
|
|
|
|
@extend %button-flat-simple;
|
|
@extend %small-button;
|
|
|
|
&:last-child:dir(ltr),
|
|
&:not(:first-child):dir(rtl) { margin-left: -$container-padding / 2; }
|
|
|
|
&:first-child:dir(rtl),
|
|
&:not(:last-child):dir(ltr) { margin-right: -$container-padding / 2; }
|
|
}
|
|
}
|
|
|
|
frame.gedit-map-frame > border {
|
|
&:dir(ltr) { border-style: none none none solid; }
|
|
&:dir(rtl) { border-style: none solid none none; }
|
|
}
|
|
|
|
|
|
/**********
|
|
* Tweaks *
|
|
**********/
|
|
|
|
%circular_list {
|
|
border-radius: $corner-radius + 1px;
|
|
box-shadow: none;
|
|
border: 1px solid $divider;
|
|
}
|
|
|
|
%circular_row {
|
|
&:first-child {
|
|
border-top-left-radius: $corner-radius;
|
|
border-top-right-radius: $corner-radius;
|
|
}
|
|
|
|
&:last-child { // Not use ?
|
|
border-bottom-left-radius: $corner-radius;
|
|
border-bottom-right-radius: $corner-radius;
|
|
}
|
|
|
|
&:only-child {
|
|
border-radius: $corner-radius;
|
|
}
|
|
}
|
|
|
|
%sidebar_row {
|
|
margin-right: 4px;
|
|
border-radius: 0 $circular-radius $circular-radius 0;
|
|
|
|
&:selected {
|
|
background-color: $overlay-checked;
|
|
color: $primary;
|
|
|
|
image, label { color: $primary; }
|
|
}
|
|
}
|
|
|
|
// the sidebar
|
|
.tweak-categories {
|
|
// padding: 4px 0;
|
|
// background-color: shade(@theme_bg_color, 0.99);
|
|
background-image: image($base-alt);
|
|
|
|
separator { @extend %hide_separators; }
|
|
|
|
.csd & {
|
|
border-bottom-left-radius: $window-radius;
|
|
}
|
|
}
|
|
|
|
.tweak {
|
|
// padding-top: 3px;
|
|
padding: 3px;
|
|
|
|
&.title:hover { box-shadow: none; }
|
|
}
|
|
|
|
.tweak-group-white,
|
|
.tweak-white,
|
|
.tweak-white:hover {
|
|
// background-color: white;
|
|
background-image: image($base);
|
|
}
|
|
|
|
.tweak-startup,
|
|
.tweak-startup:hover {
|
|
// background-color: lighter(shade(@theme_bg_color, 0.9));
|
|
background-image: image($base);
|
|
}
|
|
|
|
.tweak-group-startup {
|
|
// background-color: @view_separators;
|
|
background-image: image($base);
|
|
// border: 1px solid $frame;
|
|
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
|
|
row.tweak-startup {
|
|
border-radius: $corner-radius;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
}
|
|
}
|
|
|
|
// Workaround for 3.26
|
|
list {
|
|
&.tweak-group {
|
|
list {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
}
|
|
}
|
|
|
|
// Add more spaces between title and list
|
|
row#Focus,
|
|
row#ClickMethod,
|
|
row#PrimaryWorkspaceTweak, // for 3.26.0
|
|
row#workspaces-only-on-primary {
|
|
margin-top: 4px;
|
|
}
|
|
|
|
// See https://github.com/nana-4/materia-theme/issues/432
|
|
leaflet.titlebar > .titlebar.tweak-titlebar-left,
|
|
leaflet.titlebar > .titlebar.tweak-titlebar-right, // Workaround for gnome-tweaks 40.0
|
|
hdyleaflet.titlebar > .titlebar.tweak-titlebar-left,
|
|
hdyleaflet.titlebar > .titlebar.tweak-titlebar-right { // Workaround for gnome-tweaks 3.34
|
|
background-color: inherit;
|
|
box-shadow: inherit;
|
|
// Remove only background-color transition.
|
|
// This shouldn't be necessary, but otherwise it gets lag...
|
|
transition: color $duration $ease-out;
|
|
|
|
+ separator {
|
|
background-color: inherit;
|
|
background-image: image($titlebar-divider);
|
|
}
|
|
}
|
|
|
|
|
|
/************************
|
|
* Gnome Control Center *
|
|
************************/
|
|
window.background.csd {
|
|
> headerbar.titlebar {
|
|
> leaflet,
|
|
> hdyleaflet {
|
|
> headerbar {
|
|
&:first-child:not(:only-child) {
|
|
border-top-left-radius: $window-radius;
|
|
}
|
|
|
|
&:last-child:not(:only-child) {
|
|
border-top-right-radius: $window-radius;
|
|
}
|
|
|
|
&:first-child:only-child, &:last-child:only-child {
|
|
border-top-right-radius: $window-radius;
|
|
border-top-left-radius: $window-radius;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
> stack:not(.titlebar) > stack.background { border-radius: 0 0 $window-radius $window-radius; }
|
|
|
|
> leaflet,
|
|
> hdyleaflet,
|
|
> box.horizontal {
|
|
> stack.background {
|
|
background: none;
|
|
|
|
> widget {
|
|
> box.vertical > box.vertical { // Gnome 3.34 Wallpaper setting
|
|
> scrolledwindow > viewport.frame {
|
|
background-color: $base;
|
|
border-bottom-right-radius: $window-radius;
|
|
|
|
> box.vertical.view {
|
|
background: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
frame.view { // Wifi setting
|
|
border-radius: $corner-radius;
|
|
background: none;
|
|
}
|
|
}
|
|
|
|
> box.vertical > scrolledwindow.view { // > 3.25.90
|
|
background-color: $base;
|
|
border-bottom-left-radius: $window-radius;
|
|
|
|
> viewport.frame > stack {
|
|
background-color: transparent;
|
|
|
|
list { // left-pane
|
|
background-color: transparent;
|
|
|
|
row.activatable:not(:hover):not(:active):not(:selected) {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
stack.background clamp.medium {
|
|
frame > box.vertical > box.vertical { // VPN setting
|
|
> list {
|
|
border-top-width: 0;
|
|
border-bottom-width: 0;
|
|
|
|
&, > row { border-radius: 0; }
|
|
}
|
|
|
|
&:first-child {
|
|
> list {
|
|
border-top-width: 1px;
|
|
|
|
&, > row { border-radius: $corner-radius $corner-radius 0 0; }
|
|
}
|
|
}
|
|
|
|
&:last-child {
|
|
> list {
|
|
border-bottom-width: 1px;
|
|
|
|
&, > row { border-radius: 0 0 $corner-radius $corner-radius; }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
dialog.background.csd {
|
|
> box.vertical.dialog-vbox { // wifi setting
|
|
> notebook > stack > box.horizontal > notebook > stack {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
}
|
|
}
|
|
|
|
hdyleaflet, leaflet, box.horizontal > stack.background {
|
|
frame:not(.view) list:not(.contacts-contact-list) {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
|
|
stack.background, overlay {
|
|
scrolledwindow > viewport {
|
|
list {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
}
|
|
}
|
|
|
|
frame > border { border: none; }
|
|
|
|
> box.vertical > scrolledwindow > viewport.frame {
|
|
list:not(.view):not(.tweak-group) {
|
|
row.activatable {
|
|
@extend %sidebar_row;
|
|
}
|
|
}
|
|
}
|
|
|
|
list.view, list.frame {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
}
|
|
|
|
/************************
|
|
* Gnome system monitor *
|
|
************************/
|
|
window#gnome-system-monitor.background.csd {
|
|
> box.vertical > stack {
|
|
background-color: $base;
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
|
|
> box.vertical {
|
|
> scrolledwindow {
|
|
treeview.view:not(.progressbar):not(.trough) {
|
|
background: none;
|
|
@extend .view;
|
|
}
|
|
}
|
|
|
|
> revealer > actionbar > revealer > box {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
window#gnome-system-monitor.background:not(.csd) {
|
|
> box.vertical > headerbar { box-shadow: none; }
|
|
}
|
|
|
|
|
|
/************************
|
|
* Gnome Sound Recorder *
|
|
************************/
|
|
stack {
|
|
> grid.vertical {
|
|
> scrolledwindow {
|
|
border: none;
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
|
|
> viewport.frame {
|
|
list {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
}
|
|
}
|
|
|
|
scrolledwindow.frame.emptyGrid { border: none; } // Removed ugly borders
|
|
}
|
|
}
|
|
|
|
|
|
/******************
|
|
* Gnome Contacts *
|
|
******************/
|
|
window.background.csd {
|
|
scrolledwindow.contacts-contact-form {
|
|
border-bottom-right-radius: $window-radius;
|
|
}
|
|
}
|
|
|
|
|
|
/************************
|
|
* Epiphany (Gnome Web) *
|
|
************************/
|
|
|
|
tabbox { // Gnome 40.0
|
|
background-color: $background;
|
|
box-shadow: inset 0 -1px $divider;
|
|
padding: ($container-padding / 2) ($container-padding / 2) 0;
|
|
|
|
> tab {
|
|
@extend %tabs_tab;
|
|
border-radius: $corner-radius $corner-radius 0 0;
|
|
border-bottom: none;
|
|
|
|
// close button
|
|
button {
|
|
min-height: 24px;
|
|
min-width: 24px;
|
|
border-radius: $circular-radius;
|
|
border: none;
|
|
padding: 0;
|
|
@extend %button-flat-simple;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/*****************
|
|
* Gnome Weather *
|
|
*****************/
|
|
#weather-page,
|
|
#weekly-forecast-frame {
|
|
border-bottom-right-radius: $window-radius;
|
|
}
|
|
|
|
#weather-page-content-view {
|
|
border-bottom-right-radius: $window-radius;
|
|
border-bottom-left-radius: $window-radius;
|
|
}
|
|
|
|
statuspage.search-view {
|
|
entry.search {
|
|
@if $variant == 'light' { background-color: $base; }
|
|
|
|
&:focus { box-shadow: none; }
|
|
|
|
> window.background treeview.view:selected {
|
|
@extend %selected_items_primary;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/***************
|
|
* Gnome Music *
|
|
***************/
|
|
window.background.csd {
|
|
box.vertical > overlay > stack.background { border-radius: 0 0 $window-radius $window-radius; }
|
|
}
|
|
|
|
|
|
/****************
|
|
* Gnome Clocks *
|
|
****************/
|
|
window.background.csd.unified {
|
|
border-top-left-radius: $window-radius;
|
|
border-top-right-radius: $window-radius;
|
|
|
|
> deck > deck > deck {
|
|
> box.vertical > headerbar.titlebar.windowhandle {
|
|
border-top-left-radius: $window-radius;
|
|
border-top-right-radius: $window-radius;
|
|
box-shadow: inset 0 -1px $divider;
|
|
|
|
> viewswitchertitle > squeezer {
|
|
margin: 0 0;
|
|
background: none;
|
|
|
|
> viewswitcher > box.horizontal {
|
|
> button.radio {
|
|
margin: 0;
|
|
padding: 0;
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
list {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/*************
|
|
* Rhythmbox *
|
|
*************/
|
|
%image-button {
|
|
min-height: 24px;
|
|
min-width: 24px;
|
|
padding: ($medium-size - 24px) / 2;
|
|
margin: 0;
|
|
}
|
|
|
|
.sidebar-paned .inline-toolbar.horizontal.sidebar-toolbar {
|
|
button.image-button {
|
|
border-radius: $circular-radius;
|
|
|
|
&:not(:first-child), &:not(:last-child) {
|
|
border-top-left-radius: $circular-radius;
|
|
border-bottom-left-radius: $circular-radius;
|
|
border-top-right-radius: $circular-radius;
|
|
border-bottom-right-radius: $circular-radius;
|
|
}
|
|
|
|
&.image-button:not(.text-button) {
|
|
&:first-child {
|
|
border-top-left-radius: $circular-radius;
|
|
border-bottom-left-radius: $circular-radius;
|
|
}
|
|
|
|
&:last-child {
|
|
border-top-right-radius: $circular-radius;
|
|
border-bottom-right-radius: $circular-radius;
|
|
}
|
|
}
|
|
|
|
> widget > box > image { padding: 0; }
|
|
}
|
|
}
|
|
|
|
// tweak border and frame in alt-toolbar
|
|
window.csd > box.vertical > box.vertical,
|
|
window.solid-csd > box.vertical > box.vertical {
|
|
> toolbar.horizontal {
|
|
padding: $container-padding;
|
|
// margin: -1px 0;
|
|
border-bottom: none;
|
|
box-shadow: none;
|
|
background-color: transparent;
|
|
|
|
> toolitem > .linked > button,
|
|
> toolitem > box.horizontal > button {
|
|
@extend %circular-button;
|
|
@extend %image-button;
|
|
}
|
|
}
|
|
|
|
> frame {
|
|
margin: -1px 0;
|
|
padding: 0;
|
|
|
|
> border { border: none; }
|
|
}
|
|
}
|
|
|
|
// hard-coded spacing depends on non-scalable unit,
|
|
// seems cover-art widget is the most biggest thing?
|
|
window.background > box.vertical > toolbar.primary-toolbar {
|
|
> toolitem {
|
|
> .linked > button.image-button.raised { // 'shuffle/repeat'
|
|
@extend %circular-button;
|
|
@extend %image-button;
|
|
|
|
> widget > box > image { padding: 0; }
|
|
}
|
|
|
|
button.flat.scale { // 'volume'
|
|
@extend %circular-button;
|
|
@extend %image-button;
|
|
}
|
|
|
|
> box.horizontal:not(.linked) > button.toggle,
|
|
> .linked > button:not(.toggle):not(.raised):not(.flat) {
|
|
@extend %circular-button;
|
|
@extend %image-button;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/**********
|
|
* Polari *
|
|
**********/
|
|
.polari-room-list {
|
|
.sidebar {
|
|
background: none;
|
|
|
|
> row.activatable:selected {
|
|
background-color: $primary;
|
|
color: on($primary);
|
|
|
|
// > widget > box.horizontal > label {
|
|
// color: $text; // not use !
|
|
// }
|
|
}
|
|
}
|
|
}
|
|
|
|
stack.view.polari-entry-area {
|
|
background-color: $background;
|
|
border-top: 1px solid $divider;
|
|
border-bottom-right-radius: $window-radius;
|
|
}
|
|
|
|
stack:disabled.view.polari-entry-area { background-image: image($background); }
|
|
|
|
/***********
|
|
* Builder *
|
|
***********/
|
|
// based css for 3.22:
|
|
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-22/data/theme
|
|
// based css for 3.24:
|
|
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-24/data/theme
|
|
// based css for 3.26:
|
|
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-26/data/themes
|
|
|
|
// Layout tab and tab bar tweaks
|
|
// The following makes the layout stack header look similar to a tab bar.
|
|
layouttabbar {
|
|
border-bottom: 1px solid $divider;
|
|
background-color: $background;
|
|
|
|
button { @extend %button-flat; }
|
|
|
|
> box > button {
|
|
margin: (40px - $medium-size) / 2 0;
|
|
// border-radius: 0;
|
|
}
|
|
}
|
|
|
|
layouttab {
|
|
margin: 0 8px; // not working
|
|
border-style: none solid;
|
|
border-width: 1px;
|
|
border-color: $frame;
|
|
box-shadow: inset 0 -2px $primary;
|
|
background-color: $base;
|
|
|
|
separator.vertical { margin: 8px 4px; }
|
|
|
|
button {
|
|
&.text-button, &.image-button, & {
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
padding: 0 4px;
|
|
}
|
|
}
|
|
|
|
// Close button styling for layouttab.
|
|
// > box > button.close { @extend %circular-button; }
|
|
}
|
|
|
|
layout {
|
|
border: 1px solid $frame;
|
|
-PnlDockBin-handle-size: 1;
|
|
}
|
|
|
|
entry.search-missing {
|
|
background-color: $error;
|
|
color: on($error);
|
|
}
|
|
|
|
// tweak icons for treeviews
|
|
window.workbench treeview.image {
|
|
color: $text-secondary;
|
|
}
|
|
|
|
popover.popover-selector list {
|
|
padding: 8px - 2px;
|
|
|
|
row {
|
|
border-radius: $corner-radius;
|
|
|
|
image {
|
|
&:dir(ltr) { margin-right: 6px; }
|
|
&:dir(rtl) { margin-left: 6px; }
|
|
}
|
|
|
|
.accel {
|
|
&:dir(ltr) { margin-left: 6px; }
|
|
&:dir(rtl) { margin-right: 6px; }
|
|
}
|
|
}
|
|
}
|
|
|
|
omnibar {
|
|
&.linked:not(.vertical) entry { border-radius: $corner-radius; }
|
|
|
|
&:not(:hover):not(:active) entry { color: $text-secondary; }
|
|
}
|
|
|
|
popover.omnibar list row:not(:last-child) {
|
|
border-bottom: 1px solid $divider;
|
|
}
|
|
|
|
entry.preferences-search {
|
|
border-bottom: 1px solid $divider;
|
|
box-shadow: none;
|
|
background-color: $base;
|
|
|
|
// doesn't work properly
|
|
// &:dir(ltr) { border-right: 1px solid $divider; }
|
|
// &:dir(rtl) { border-left: 1px solid $divider; }
|
|
}
|
|
|
|
preferences stacksidebar.sidebar {
|
|
list { background-color: $base-alt; }
|
|
|
|
&:dir(ltr),
|
|
&:dir(rtl) { list { border-style: none; }}
|
|
|
|
list separator { @extend %hide_separators; }
|
|
}
|
|
|
|
preferences > box > box {
|
|
&:dir(ltr) { border-right: 1px solid $divider; }
|
|
&:dir(rtl) { border-left: 1px solid $divider; }
|
|
}
|
|
|
|
popover.messagepopover {
|
|
&.background { padding: 0; }
|
|
|
|
.popover-action-area button {
|
|
@extend %button-flat-simple;
|
|
|
|
padding: 8px 16px;
|
|
border-top: 1px solid $divider;
|
|
border-radius: 0;
|
|
|
|
&:first-child { border-bottom-left-radius: $corner-radius; }
|
|
|
|
&:last-child { border-bottom-right-radius: $corner-radius; }
|
|
}
|
|
|
|
.popover-content-area { margin: 16px; }
|
|
}
|
|
|
|
popover.transfers list {
|
|
background-color: transparent;
|
|
|
|
row:not(:first-child) { border-top: 1px solid $divider; }
|
|
|
|
row > box { padding: 10px; }
|
|
}
|
|
|
|
dockbin {
|
|
border: 1px solid $frame;
|
|
-PnlDockBin-handle-size: 1;
|
|
}
|
|
|
|
dockpaned {
|
|
border: 1px solid $frame;
|
|
}
|
|
|
|
eggsearchbar box.search-bar {
|
|
padding: 0 8px;
|
|
border-bottom: 1px solid $divider;
|
|
background-color: $background;
|
|
}
|
|
|
|
docktabstrip {
|
|
padding: 0 8px;
|
|
border-bottom: 1px solid $divider;
|
|
background-color: $background;
|
|
}
|
|
|
|
docktab {
|
|
transition: $transition,
|
|
background-size 0ms,
|
|
background-image 0ms;
|
|
min-height: $small-size;
|
|
min-width: $small-size;
|
|
margin-bottom: -1px;
|
|
padding: $container-padding 6px;
|
|
|
|
border-width: 1px; // for reorderable tabs
|
|
border-color: transparent; //
|
|
|
|
box-shadow: inset 0 -2px transparent;
|
|
background-image: radial-gradient(circle, $primary 10%, transparent 0%);
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-size: 0% 0%;
|
|
|
|
color: $text-secondary;
|
|
font-weight: 500;
|
|
|
|
&:hover {
|
|
background-color: $overlay-hover;
|
|
color: $text;
|
|
}
|
|
|
|
&:checked {
|
|
transition: $transition,
|
|
background-size $ripple-fade-in-duration $ease-out,
|
|
background-image $ripple-fade-in-duration + $ripple-fade-out-duration $ease-out;
|
|
box-shadow: inset 0 -2px $primary;
|
|
background-color: transparent;
|
|
background-image: radial-gradient(circle, transparent 10%, transparent 0%);
|
|
background-size: 1000% 1000%;
|
|
color: $text;
|
|
}
|
|
}
|
|
|
|
dockoverlayedge {
|
|
background-color: $background;
|
|
|
|
docktabstrip {
|
|
padding: 0;
|
|
border: none;
|
|
}
|
|
|
|
&.left-edge docktab:checked { box-shadow: inset -2px 0 $primary; }
|
|
|
|
&.right-edge docktab:checked { box-shadow: inset 2px 0 $primary; }
|
|
}
|
|
|
|
pillbox {
|
|
background-color: $background;
|
|
border-radius: $corner-radius;
|
|
}
|
|
|
|
buildperspective row {
|
|
// padding: 10px;
|
|
}
|
|
|
|
layoutpane entry.search {
|
|
border-bottom: 1px solid $divider;
|
|
box-shadow: none;
|
|
background-color: $base;
|
|
}
|
|
|
|
editortweak entry.search {
|
|
margin-bottom: -1px;
|
|
box-shadow: none;
|
|
background-color: transparent;
|
|
}
|
|
|
|
//
|
|
// let's tweak hard-coded elements
|
|
//
|
|
|
|
.gb-search-entry-occurrences-tag {
|
|
box-shadow: none;
|
|
background-color: transparent;
|
|
}
|
|
|
|
// Keep search bar and layouttab height in sync.
|
|
// layouttabbar > box,
|
|
// eggsearchbar > revealer > box,
|
|
docktabstrip {
|
|
min-height: 39px;
|
|
}
|
|
|
|
eggsearchbar entry {
|
|
// min-height: 24px;
|
|
}
|
|
|
|
window.workbench preferences preferencesgroup list entry {
|
|
// background: none;
|
|
// min-height: 0px;
|
|
padding-top: 8px;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
button.run-arrow-button {
|
|
// min-width: 12px;
|
|
padding-left: ($medium-size - 16px) / 2;
|
|
padding-right: ($medium-size - 16px) / 2;
|
|
}
|
|
|
|
//
|
|
// Additional styles for 3.26
|
|
//
|
|
|
|
button.dzlmenubutton image {
|
|
min-width: $medium-size - 6px;
|
|
|
|
&.arrow { min-width: $medium-size - 9px; }
|
|
}
|
|
|
|
button.dzlmenubuttonitem {
|
|
color: $text;
|
|
font-weight: normal;
|
|
|
|
&:disabled { color: $text-disabled; }
|
|
}
|
|
|
|
idelayoutstackheader {
|
|
border-bottom: 1px solid $divider;
|
|
|
|
button:checked { color: $text; }
|
|
}
|
|
|
|
// utilities stack switcher
|
|
ideeditorutilities > dzldockpaned > box > stackswitcher {
|
|
padding: 8px 0;
|
|
background-color: $background;
|
|
|
|
&:dir(ltr) { border-right: 1px solid $divider; }
|
|
|
|
&:dir(rtl) { border-left: 1px solid $divider; }
|
|
|
|
button {
|
|
border-radius: 0;
|
|
box-shadow: none;
|
|
background-color: transparent;
|
|
|
|
&:active {
|
|
background-image: radial-gradient(circle, rgba($primary, 0.7) 10%, transparent 0%);
|
|
}
|
|
|
|
&:checked {
|
|
background-color: transparent;
|
|
color: $text;
|
|
}
|
|
|
|
&:dir(ltr) {
|
|
margin-right: -1px;
|
|
|
|
&:checked { box-shadow: inset -2px 0 $primary; }
|
|
}
|
|
|
|
&:dir(rtl) {
|
|
margin-left: -1px;
|
|
|
|
&:checked { box-shadow: inset 2px 0 $primary; }
|
|
}
|
|
}
|
|
}
|
|
|
|
// buildui panel
|
|
ideeditorsidebar notebook header {
|
|
background: transparent;
|
|
}
|
|
|
|
popover.messagepopover {
|
|
// padding: 0;
|
|
|
|
list {
|
|
border: 1px solid $divider;
|
|
|
|
row:not(:last-child) { border-bottom: 1px solid $divider; }
|
|
}
|
|
}
|
|
|
|
|
|
/**********
|
|
* Photos *
|
|
**********/
|
|
// based css:
|
|
// https://gitlab.gnome.org/GNOME/gnome-photos/blob/master/data/Adwaita.css
|
|
|
|
GdMainIconView.content-view {
|
|
-GdMainIconView-icon-size: 48;
|
|
|
|
// Make spinner visible on both dark and bright backgrounds w/o making
|
|
// it look ugly/weird.
|
|
// &.cell:active { color: $text-disabled; }
|
|
}
|
|
|
|
.documents-counter {
|
|
margin: 8px;
|
|
border-radius: $circular-radius;
|
|
box-shadow: $shadow-z4;
|
|
background-color: $primary;
|
|
color: on($primary);
|
|
font-weight: bold;
|
|
}
|
|
|
|
.photos-entry-tag {
|
|
@extend .entry-tag;
|
|
}
|
|
|
|
.documents-scrolledwin.frame {
|
|
border-style: none;
|
|
|
|
frame.content-view > border { border-style: none; }
|
|
}
|
|
|
|
.photos-icon-bg {
|
|
}
|
|
|
|
.photos-fade-in {
|
|
opacity: 1;
|
|
transition: opacity $duration $ease-out;
|
|
}
|
|
|
|
.photos-fade-out {
|
|
opacity: 0;
|
|
transition: opacity $duration $ease-out;
|
|
}
|
|
|
|
.photos-collection-icon {
|
|
}
|
|
|
|
button.photos-filter-preview {
|
|
color: $text;
|
|
font-weight: normal;
|
|
|
|
&:checked {
|
|
background-color: $overlay-selected;
|
|
color: $text;
|
|
|
|
image {
|
|
color: on(dark);
|
|
-gtk-icon-shadow: $text-shadow;
|
|
}
|
|
}
|
|
}
|
|
|
|
overlay grid.horizontal > revealer > scrolledwindow.frame {
|
|
&:dir(ltr) { border-style: none none none solid; }
|
|
&:dir(rtl) { border-style: none solid none none; }
|
|
}
|
|
|
|
|
|
/*********
|
|
* Music *
|
|
*********/
|
|
// hard-coded css:
|
|
// https://gitlab.gnome.org/GNOME/gnome-music/blob/master/data/application.css
|
|
|
|
.side-panel:dir(ltr) {
|
|
// border-width: 0 1px 0 0;
|
|
border-style: solid;
|
|
border-color: $divider;
|
|
}
|
|
|
|
.side-panel:dir(rtl) {
|
|
// border-width: 0 0 0 1px;
|
|
border-style: solid;
|
|
border-color: $divider;
|
|
}
|
|
|
|
.side-panel .view {
|
|
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
|
|
background-image: image($base-alt);
|
|
|
|
&:hover { background-image: image(mix($text, $base-alt, percentage(0.08))); }
|
|
}
|
|
|
|
.side-panel .view:selected {
|
|
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
|
|
background-image: image($primary);
|
|
|
|
&:hover { background-image: image(mix(on($primary), $primary, percentage(0.08))); }
|
|
}
|
|
|
|
.songs-list {
|
|
// box-shadow: inset 0 -1px shade(@borders, 1.30);
|
|
// background-color: @theme_bg_color;
|
|
|
|
&:hover { background-image: image($overlay-hover); }
|
|
}
|
|
|
|
frame.documents-dropdown {
|
|
@extend %toolbar_osd;
|
|
|
|
margin: 8px;
|
|
|
|
> border { border: none; }
|
|
}
|
|
|
|
box.vertical > revealer > toolbar.search-bar {
|
|
border-bottom: 1px solid $divider;
|
|
background-clip: border-box; // avoid black border
|
|
|
|
button > widget {
|
|
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
|
|
// -GtkArrow-arrow-scaling: 1;
|
|
}
|
|
}
|
|
|
|
|
|
/*************
|
|
* Documents *
|
|
*************/
|
|
// documents-scrolledwi (Totem, Documents, EvView)
|
|
.documents-scrolledwin {
|
|
background-color: transparent;
|
|
|
|
.content-view:not(:selected):not(:hover) {
|
|
background-color: transparent;
|
|
// border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
|
|
viewport.frame { // Documents
|
|
background-color: transparent;
|
|
|
|
widget > frame.content-view:not(:selected):not(:hover) {
|
|
border { border: none; }
|
|
|
|
background-color: transparent;
|
|
// border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/*******************
|
|
* Document Viewer *
|
|
*******************/
|
|
window.background.csd {
|
|
> box.vertical {
|
|
> paned.horizontal > box.vertical > scrolledwindow {
|
|
> treeview.view:not(:hover):not(:selected) { background-color: transparent; }
|
|
}
|
|
}
|
|
|
|
evview.view.content-view {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
|
|
&:selected, &:selected:backdrop {
|
|
@extend %selected_items_primary;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/*******************
|
|
* Archive Manager *
|
|
*******************/
|
|
.background.csd {
|
|
> grid.horizontal > paned.horizontal {
|
|
> scrolledwindow {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
background-color: $base;
|
|
|
|
treeview.view:not(:hover):not(:selected) {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
|
|
> box.vertical {
|
|
> scrolledwindow {
|
|
border-radius: 0 0 0 $window-radius;
|
|
background-color: $background;
|
|
|
|
treeview.view:not(:hover):not(:selected) {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/**************
|
|
* Gnome Disk *
|
|
**************/
|
|
window.background.csd {
|
|
> box.vertical > paned.horizontal {
|
|
> scrolledwindow {
|
|
treeview.view:not(:selected):not(:hover) {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/************
|
|
* Terminal *
|
|
************/
|
|
terminal-window {
|
|
&.background.csd {
|
|
border-radius: 0 0 0 0;
|
|
}
|
|
|
|
&.background.csd.maximized { border-radius: 0 0 0 0; } // Fixed gnome 3.32 issue: Unable to restore window size after maximization
|
|
|
|
notebook > header > box {
|
|
// Remove hard-coded margin around button(s)
|
|
margin: -2px -2px -3px;
|
|
|
|
button {
|
|
// margin-bottom: -1px;
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
window.background { // gnome-terminal 3.32 setting
|
|
> box.vertical > box.horizontal > frame {
|
|
> border {
|
|
border-width: 0 1px 0 0;
|
|
}
|
|
|
|
> scrolledwindow > viewport.frame {
|
|
list {
|
|
border-bottom-left-radius: $window-radius;
|
|
}
|
|
}
|
|
}
|
|
|
|
> box.vertical > box.horizontal > stack {
|
|
> widget > notebook.frame {
|
|
border-width: 0;
|
|
|
|
> stack {
|
|
border-bottom-right-radius: $window-radius;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/*********
|
|
* To Do *
|
|
*********/
|
|
// less than 3.28
|
|
task-list-view {
|
|
taskrow {
|
|
transition: $transition;
|
|
margin: 0 -8px;
|
|
|
|
&:hover { transition: none; }
|
|
|
|
label { margin: 0 8px; }
|
|
|
|
image.dim-label { min-width: 16px; }
|
|
}
|
|
|
|
> box > revealer > box > button {
|
|
margin: (12px * 2 - $medium-size) / 2;
|
|
|
|
.dim-label { color: inherit; }
|
|
}
|
|
}
|
|
|
|
// 3.28 or later
|
|
tasklistview {
|
|
taskrow {
|
|
outline: none;
|
|
|
|
entry {
|
|
&, &:focus, &:disabled { box-shadow: none; }
|
|
}
|
|
|
|
image.dim-label { min-width: 16px; }
|
|
}
|
|
|
|
> box > revealer > box > button {
|
|
margin: (12px * 2 - $medium-size) / 2;
|
|
|
|
.dim-label { color: inherit; }
|
|
}
|
|
}
|
|
|
|
|
|
/*******
|
|
* Eog *
|
|
*******/
|
|
#eog-thumb-nav {
|
|
scrolledwindow { border-top: none; }
|
|
}
|
|
|
|
|
|
/*************
|
|
* Evolution *
|
|
*************/
|
|
frame.taskbar > border { border-style: solid none none; }
|
|
|
|
box.vertical > paned.horizontal notebook widget .frame { border-style: none; }
|
|
|
|
|
|
/***********
|
|
* Fractal *
|
|
***********/
|
|
.background.csd.main-window {
|
|
.sidebar.rooms-sidebar {
|
|
border-bottom-left-radius: $window-radius;
|
|
}
|
|
}
|
|
|
|
|
|
/********
|
|
* Gitg *
|
|
********/
|
|
frame.commit-frame > border { border-style: solid none none; }
|
|
|
|
|
|
/**************
|
|
* Characters *
|
|
**************/
|
|
box.dialog-vbox scrolledwindow.related { border: 1px solid $frame; }
|
|
|
|
list.categories { background-image: image($base-alt); }
|
|
|
|
|
|
/*********
|
|
* Boxes *
|
|
*********/
|
|
.transparent-bg + stack overlay > label {
|
|
min-height: 24px;
|
|
padding: 0 4px;
|
|
border-radius: $corner-radius;
|
|
background-color: $scrim;
|
|
color: on($scrim);
|
|
}
|
|
|
|
|
|
/**************
|
|
* Calculator *
|
|
**************/
|
|
button.title label { min-height: $medium-size; }
|
|
|
|
|
|
/*********
|
|
* Geary *
|
|
*********/
|
|
window.background.csd.geary-main-window,
|
|
window#GearyMainWindow.background.csd {
|
|
box.vertical > paned.horizontal > box.sidebar.vertical {
|
|
border-bottom-left-radius: $window-radius;
|
|
|
|
statusbar {
|
|
border-bottom-left-radius: $window-radius;
|
|
}
|
|
}
|
|
|
|
stack#conversation_viewer {
|
|
border-bottom-right-radius: $window-radius;
|
|
|
|
scrolledwindow.geary-conversation-scroller {
|
|
viewport.frame {
|
|
list.conversation-listbox {
|
|
background: none;
|
|
border-bottom-right-radius: $window-radius;
|
|
}
|
|
}
|
|
}
|
|
|
|
.geary-expanded {
|
|
animation: none;
|
|
background-image: none;
|
|
|
|
> .geary-composer-embed {
|
|
actionbar > revealer > box { border-radius: 0; }
|
|
|
|
headerbar {
|
|
color: $text;
|
|
background-color: $background;
|
|
box-shadow: none;
|
|
border-bottom: 1px solid $frame;
|
|
|
|
button { @extend %button-flat; }
|
|
}
|
|
}
|
|
}
|
|
|
|
.geary-composer-box {
|
|
actionbar > revealer > box { border-bottom-left-radius: 0; }
|
|
}
|
|
}
|
|
}
|
|
|
|
preferencesgroup, .geary-accounts-editor-pane {
|
|
list {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
}
|
|
|
|
.geary-accounts-editor-pane {
|
|
frame:not(.geary-signature) > border,
|
|
scrolledwindow.frame { border: none; }
|
|
}
|
|
|
|
.geary-main-window {
|
|
> deck > overlay > .geary-main-layout {
|
|
background-color: $base-alt;
|
|
|
|
> leaflet > separator.sidebar, // centry
|
|
> leaflet > leaflet > separator.sidebar { // left
|
|
// border-right: none;
|
|
background-color: $titlebar;
|
|
box-shadow: inset 0 -1px $divider;
|
|
transition: background-color $duration $ease-out,
|
|
color $duration $ease-out,
|
|
box-shadow $duration $ease-out;
|
|
|
|
&:backdrop { background-color: $titlebar-backdrop; }
|
|
}
|
|
|
|
> leaflet > leaflet > box.vertical + separator.sidebar {
|
|
background-color: $divider;
|
|
}
|
|
|
|
> leaflet > leaflet > box.vertical > .geary-conversation-frame {
|
|
> scrolledwindow {
|
|
margin: -1px 0; // hide .view top border
|
|
// > treeview.view {}
|
|
}
|
|
}
|
|
}
|
|
|
|
geary-conversation-viewer#conversation_viewer { // right side
|
|
list.background.conversation-listbox.content {
|
|
> row.activatable {
|
|
border: 1px solid $divider;
|
|
border-bottom-width: 0;
|
|
background-color: $base;
|
|
|
|
&:first-child {
|
|
border-top-left-radius: 8px;
|
|
border-top-right-radius: 8px;
|
|
}
|
|
}
|
|
|
|
.geary-attachment-pane {
|
|
border-radius: 0 0 8px 8px;
|
|
|
|
actionbar.background {
|
|
background-color: transparent;
|
|
|
|
> revealer > box {
|
|
border-radius: 0 0 6px 6px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/**************
|
|
* Extensions *
|
|
**************/
|
|
window.background.csd {
|
|
> stack, // GameMode setting
|
|
> stack > scrolledwindow > viewport > box, // User Themes (Workspace) setting
|
|
> box > stack > scrolledwindow > viewport > box {
|
|
> list {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
}
|
|
|
|
stack stack stack frame, // ArcMenu setting
|
|
> stack > stack > box > frame, // Night Theme Switcher setting
|
|
> stack > stack > box > box > frame, // Night Theme Switcher setting bottom lists
|
|
> stack > box > stack > box > frame, // ArcMenu setting
|
|
> stack > box > stack > scrolledwindow > viewport frame, // ArcMenu setting
|
|
> stack > box > stack > box > scrolledwindow > viewport > frame, // ArcMenu setting
|
|
> stack > grid > scrolledwindow > viewport > box > frame { // GSConnect setting
|
|
> border { border: none; }
|
|
|
|
> list {
|
|
@extend %circular_list;
|
|
|
|
row.activatable { @extend %circular_row; }
|
|
}
|
|
}
|
|
|
|
> stack > box > box > list,
|
|
> stack > box > stack > scrolledwindow > viewport > list { // ArcMenu setting sidebar
|
|
border-bottom-left-radius: $window-radius;
|
|
}
|
|
|
|
> stack > box > .sidebar > scrolledwindow > viewport > list {
|
|
padding: 0 0;
|
|
}
|
|
}
|
|
|
|
/***********
|
|
* Dialogs *
|
|
***********/
|
|
dialog.background.csd {
|
|
> box.vertical.dialog-vbox {
|
|
> grid.horizontal {
|
|
> scrolledwindow.frame {
|
|
> viewport.frame {
|
|
list:first-child { border-radius: 0 0 0 $window-radius; }
|
|
list:last-child { border-radius: 0 0 $window-radius 0; }
|
|
}
|
|
}
|
|
}
|
|
|
|
> stack,
|
|
> stack > stack {
|
|
> scrolledwindow {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
background-color: $base;
|
|
|
|
iconview.view:not(:hover):not(:selected):not(:active) { // Wallpaper setting window
|
|
// @extend %view;
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
|
|
> stack {
|
|
> scrolledwindow > viewport.frame {
|
|
> list {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
|
|
row.activatable:not(:hover):not(:selected):not(:active) {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
|
|
> box.vertical > stack.view {
|
|
> scrolledwindow > treeview.view:not(:hover):not(:selected):not(:active) {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
|
|
toolbar.toolbar {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
}
|
|
|
|
> notebook {
|
|
> stack {
|
|
border-radius: 0 0 $window-radius $window-radius;
|
|
}
|
|
}
|
|
}
|
|
|
|
stack scrolledwindow {
|
|
&.frame {
|
|
border-radius: $corner-radius;
|
|
|
|
textview.view {
|
|
border-radius: $corner-radius;
|
|
|
|
> text {
|
|
background: none;
|
|
}
|
|
}
|
|
|
|
treeview.view:not(:hover):not(:selected) { background: none; }
|
|
}
|
|
|
|
viewport.frame {
|
|
&.view { border-radius: $corner-radius; }
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
//
|
|
// unified window
|
|
//
|
|
|
|
window.background.csd.unified {
|
|
// Remove the sheen on headerbar...
|
|
headerbar {
|
|
box-shadow: inset 0 -1px $divider;
|
|
|
|
&.selection-mode {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
|
|
// ...and add it on the window itself
|
|
> decoration-overlay {
|
|
box-shadow: inset 0 1px highlight($titlebar);
|
|
}
|
|
|
|
&,
|
|
> decoration,
|
|
> decoration-overlay {
|
|
border-radius: $window-radius;
|
|
}
|
|
|
|
&.tiled,
|
|
&.tiled-top,
|
|
&.tiled-right,
|
|
&.tiled-bottom,
|
|
&.tiled-left,
|
|
&.maximized,
|
|
&.fullscreen {
|
|
> decoration-overlay {
|
|
box-shadow: none;
|
|
}
|
|
|
|
&,
|
|
> decoration,
|
|
> decoration-overlay {
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
|
|
> deck > .view > notebook {
|
|
> header.top {
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
}
|