mirror of
https://github.com/vinceliuice/Colloid-gtk-theme.git
synced 2025-09-15 21:08:39 -07:00
update #201
This commit is contained in:
@@ -1,7 +1,11 @@
|
|||||||
@import 'apps/builder';
|
@import 'apps/builder';
|
||||||
@import 'apps/calculator';
|
@import 'apps/calculator';
|
||||||
|
@import 'apps/calendar';
|
||||||
|
@import 'apps/clocks';
|
||||||
|
@import 'apps/console';
|
||||||
@import 'apps/control-center';
|
@import 'apps/control-center';
|
||||||
@import 'apps/editor';
|
@import 'apps/editor';
|
||||||
@import 'apps/nautilus';
|
@import 'apps/nautilus';
|
||||||
|
@import 'apps/software';
|
||||||
@import 'apps/weather';
|
@import 'apps/weather';
|
||||||
@import 'apps/other';
|
@import 'apps/other';
|
||||||
|
@@ -307,9 +307,9 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
#{$_selector} undershoot.#{$p} {
|
#{$_selector} undershoot.#{$p} {
|
||||||
@if $style==default {
|
@if $style == 'default' {
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
} @else if $style==frame {
|
} @else if $style == 'frame' {
|
||||||
box-shadow: inset $_border_pos $border_color;
|
box-shadow: inset $_border_pos $border_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -7,15 +7,15 @@ label {
|
|||||||
&.primary-label, &.month-name, &.secondary-label {
|
&.primary-label, &.month-name, &.secondary-label {
|
||||||
font-size: 16pt;
|
font-size: 16pt;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: $space-size * 2;
|
padding: $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.primary-label, &.month-name {
|
&.primary-label, &.month-name {
|
||||||
color: $primary;
|
color: $accent_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.secondary-label {
|
&.secondary-label {
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -23,7 +23,7 @@ calendar-view {
|
|||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
|
|
||||||
&:selected {
|
&:selected {
|
||||||
color: $primary;
|
color: $accent_color;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -32,26 +32,28 @@ calendar-view.header,
|
|||||||
label.header {
|
label.header {
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
calendar-view.current,
|
calendar-view.current,
|
||||||
weekgrid.current {
|
weekgrid.current {
|
||||||
background-color: gtkalpha($primary, 0.3);
|
background-color: gtkalpha($accent_color, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
popover.events {
|
popover.events {
|
||||||
background-color: $popover;
|
background-color: $popover_bg_color;
|
||||||
|
color: $popover_fg_color;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
||||||
box {
|
box {
|
||||||
border-top-left-radius: $corner-radius;
|
border-top-left-radius: $button_radius;
|
||||||
border-top-right-radius: $corner-radius;
|
border-top-right-radius: $button_radius;
|
||||||
}
|
}
|
||||||
|
|
||||||
list {
|
list {
|
||||||
background-color: $base;
|
color: $view_fg_color;
|
||||||
border-radius: $corner-radius;
|
background-color: $view_bg_color;
|
||||||
|
border-radius: $button_radius;
|
||||||
}
|
}
|
||||||
|
|
||||||
scrolledwindow {
|
scrolledwindow {
|
||||||
@@ -59,7 +61,7 @@ popover.events {
|
|||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
border-radius: $corner-radius;
|
border-radius: $button_radius;
|
||||||
border-top-left-radius: 0;
|
border-top-left-radius: 0;
|
||||||
border-top-right-radius: 0;
|
border-top-right-radius: 0;
|
||||||
border-style: solid none none;
|
border-style: solid none none;
|
||||||
@@ -78,37 +80,25 @@ event {
|
|||||||
|
|
||||||
&.timed,
|
&.timed,
|
||||||
&:not(.slanted):not(.slanted-start):not(.slanted-end) {
|
&:not(.slanted):not(.slanted-start):not(.slanted-end) {
|
||||||
border-radius: $corner-radius;
|
border-radius: $button_radius;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.timed widget.edge {
|
&.timed widget.edge {
|
||||||
border-radius: $corner-radius / 2;
|
border-radius: $button_radius / 2;
|
||||||
min-width: 5px;
|
min-width: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.slanted-start,
|
&.slanted-start,
|
||||||
&.slanted-end:dir(rtl) {
|
&.slanted-end:dir(rtl) {
|
||||||
padding-left: $space-size * 2 + 4px;
|
padding-left: $base_padding * 2 + 4px;
|
||||||
border-radius: 0 $corner-radius / 2 $corner-radius / 2 0;
|
border-radius: 0 $button_radius / 2 $button_radius / 2 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.slanted-end,
|
&.slanted-end,
|
||||||
&.slanted-start:dir(rtl) {
|
&.slanted-start:dir(rtl) {
|
||||||
padding-right: $space-size * 2 + 4px;
|
padding-right: $base_padding * 2 + 4px;
|
||||||
border-radius: $corner-radius / 2 0 0 $corner-radius / 2;
|
border-radius: $button_radius / 2 0 0 $button_radius / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:not(.timed).color-dark {
|
|
||||||
color: white;
|
|
||||||
outline-color: rgba(0, 0, 0, 0.3);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.timed,
|
|
||||||
&:not(.timed).color-light {
|
|
||||||
color: gtkalpha(black, 0.75);
|
|
||||||
outline-color: rgba(255, 255, 255, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Event Popover
|
// Event Popover
|
||||||
@@ -118,7 +108,7 @@ popover.event-popover > contents {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.search-viewport {
|
.search-viewport {
|
||||||
background-color: $base;
|
background-color: $view_bg_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
// calendar popover
|
// calendar popover
|
||||||
@@ -149,27 +139,29 @@ button:checked:not(:backdrop) .calendar-color-image,
|
|||||||
|
|
||||||
// month/year controls
|
// month/year controls
|
||||||
datechooser {
|
datechooser {
|
||||||
|
color: $sidebar_fg_color;
|
||||||
|
|
||||||
navigator { // add some space between the two controls
|
navigator { // add some space between the two controls
|
||||||
margin-right: $space-size;
|
margin-right: $base_padding;
|
||||||
margin-left: $space-size;
|
margin-left: $base_padding;
|
||||||
margin-bottom: $space-size;
|
margin-bottom: $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
navigator {
|
navigator {
|
||||||
label { font-weight: bold; }
|
label { font-weight: bold; }
|
||||||
|
|
||||||
button.flat,
|
button.flat,
|
||||||
button.toggle,
|
button.pill,
|
||||||
button.image-button {
|
button.image-button {
|
||||||
min-height: $medium-size;
|
min-height: 24px;
|
||||||
min-width: $medium-size;
|
min-width: 24px;
|
||||||
padding: 0;
|
padding: $base_padding;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// day names and week numbers
|
// day names and week numbers
|
||||||
.weeknum, .weekday {
|
.weeknum, .weekday {
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
font-size: smaller;
|
font-size: smaller;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -177,45 +169,45 @@ datechooser {
|
|||||||
button.day {
|
button.day {
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
margin: $space-size / 2;
|
margin: 2px;
|
||||||
padding: 0;
|
padding: $base_padding - 2px;
|
||||||
min-height: $medium-size;
|
min-height: 24px;
|
||||||
min-width: $medium-size;
|
min-width: 24px;
|
||||||
transition: none;
|
transition: none;
|
||||||
|
|
||||||
dot {
|
dot {
|
||||||
background-color: $text;
|
background-color: $text_color;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
min-height: $space-size / 2;
|
min-height: $base_padding / 2;
|
||||||
min-width: $space-size / 2;
|
min-width: $base_padding / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:selected, &.today:selected {
|
&:selected, &.today:selected {
|
||||||
background-color: $primary;
|
background-color: $accent_bg_color;
|
||||||
color: on($primary);
|
color: $accent_fg_color;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
||||||
dot { background-color: on($primary); }
|
dot { background-color: $accent_fg_color; }
|
||||||
}
|
}
|
||||||
|
|
||||||
&.today {
|
&.today {
|
||||||
color: $primary;
|
color: $accent_bg_color;
|
||||||
|
|
||||||
dot { background-color: $primary; }
|
dot { background-color: $accent_bg_color; }
|
||||||
}
|
}
|
||||||
|
|
||||||
&.other-month {
|
&.other-month {
|
||||||
&:not(:hover),
|
&:not(:hover),
|
||||||
&:backdrop {
|
&:backdrop {
|
||||||
color: gtkalpha(currentColor, 0.1);
|
color: $secondary_disabled_text_color;
|
||||||
|
|
||||||
dot { background-color: gtkalpha(currentColor, 0.1); }
|
dot { background-color: $secondary_disabled_text_color; }
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover:not(:backdrop) {
|
&:hover:not(:backdrop) {
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
|
|
||||||
dot { background-color: $text-disabled; }
|
dot { background-color: $disabled_text_color; }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -226,38 +218,38 @@ datechooser {
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
||||||
& > box:first-child {
|
& > box:first-child {
|
||||||
border-bottom: 1px solid $border;
|
border-bottom: 1px solid $border_color
|
||||||
}
|
}
|
||||||
|
|
||||||
.week-number {
|
.week-number {
|
||||||
font-size: 16pt;
|
font-size: 16pt;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: $space-size * 2 $space-size * 2 $space-size * 3 $space-size * 2;
|
padding: $base_padding * 2 $base_padding * 2 $base_padding * 3 $base_padding * 2;
|
||||||
color: $track;
|
color: $secondary_disabled_text_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.week-temperature {
|
&.week-temperature {
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.lines {
|
&.lines {
|
||||||
color: $border;
|
color: $border_color
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
weekhourbar > label {
|
weekhourbar > label {
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
padding: 4px $space-size;
|
padding: 4px $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
.week-view .lines {
|
.week-view .lines {
|
||||||
color: $border;
|
color: $border_color
|
||||||
}
|
}
|
||||||
|
|
||||||
weekgrid > widget.now-strip {
|
weekgrid > widget.now-strip {
|
||||||
background-color: gtkalpha($primary, 0.8);
|
background-color: gtkalpha($accent_color, 0.8);
|
||||||
margin: 0 0 0 1px;
|
margin: 0 0 0 1px;
|
||||||
min-height: 3px;
|
min-height: 3px;
|
||||||
}
|
}
|
||||||
@@ -265,28 +257,28 @@ weekgrid > widget.now-strip {
|
|||||||
weekgrid,
|
weekgrid,
|
||||||
.week-header {
|
.week-header {
|
||||||
&:selected, &.dnd {
|
&:selected, &.dnd {
|
||||||
background-color: gtkalpha($primary, 0.25);
|
background-color: gtkalpha($accent_color, 0.25);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Month cell
|
// Month cell
|
||||||
monthcell {
|
monthcell {
|
||||||
border: solid 1px $border;
|
border: solid 1px $border_color;
|
||||||
border-width: 1px 0 0 1px;
|
border-width: 1px 0 0 1px;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
transition: background-color 200ms;
|
transition: background-color 200ms;
|
||||||
|
|
||||||
&:hover:not(.out-of-month):not(.today) {
|
&:hover:not(.out-of-month):not(.today) {
|
||||||
background-color: $base-alt;
|
background-color: $dialog_bg_color;
|
||||||
transition: background-color 200ms;
|
transition: background-color 200ms;
|
||||||
color: $text;
|
color: $text_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:selected {
|
&:selected {
|
||||||
background-color: gtkalpha($primary, 0.1);
|
background-color: gtkalpha($accent_color, 0.1);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: gtkalpha($primary, 0.2);
|
background-color: gtkalpha($accent_color, 0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
label.day-label { font-weight: bold; }
|
label.day-label { font-weight: bold; }
|
||||||
@@ -295,24 +287,24 @@ monthcell {
|
|||||||
&:nth-child(7n + 1) { border-left-width: 0; }
|
&:nth-child(7n + 1) { border-left-width: 0; }
|
||||||
|
|
||||||
&.today {
|
&.today {
|
||||||
background-color: gtkalpha($primary, 0.2);
|
background-color: gtkalpha($accent_color, 0.2);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: gtkalpha($primary, 0.3);
|
background-color: gtkalpha($accent_color, 0.3);
|
||||||
color: $primary;
|
color: $accent_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:selected {
|
&:selected {
|
||||||
background-color: gtkalpha($primary, 0.25);
|
background-color: gtkalpha($accent_color, 0.25);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: gtkalpha($primary, 0.35);
|
background-color: gtkalpha($accent_color, 0.35);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
label {
|
||||||
color: $text;
|
color: $text_color;
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
|
|
||||||
&.day-label {
|
&.day-label {
|
||||||
@@ -321,15 +313,15 @@ monthcell {
|
|||||||
}
|
}
|
||||||
|
|
||||||
&.out-of-month {
|
&.out-of-month {
|
||||||
background-color: $fill;
|
background-color: $button_color;
|
||||||
|
|
||||||
label {
|
label {
|
||||||
color: $text-secondary;
|
color: $secondary_text_color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
padding: 0 $space-size;
|
padding: 0 $base_padding;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
border-right: none;
|
border-right: none;
|
||||||
@@ -344,8 +336,8 @@ monthpopover > box {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.notes-section box > textview {
|
.notes-section box > textview {
|
||||||
border-radius: $corner-radius;
|
border-radius: $button_radius;
|
||||||
padding: $space-size;
|
padding: $base_padding;
|
||||||
|
|
||||||
> text {
|
> text {
|
||||||
background: none;
|
background: none;
|
||||||
@@ -356,11 +348,11 @@ monthpopover > box {
|
|||||||
agenda-view {
|
agenda-view {
|
||||||
list {
|
list {
|
||||||
> row {
|
> row {
|
||||||
padding: 2px $space-size * 2;
|
padding: 2px $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
> label {
|
> label {
|
||||||
padding: $space-size $space-size * 2;
|
padding: $base_padding $base_padding * 2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -381,12 +373,12 @@ searchbutton > popover > arrow {
|
|||||||
|
|
||||||
// Month selector
|
// Month selector
|
||||||
datechooser {
|
datechooser {
|
||||||
padding: $space-size;
|
padding: $base_padding;
|
||||||
|
|
||||||
.current-week {
|
.current-week {
|
||||||
background: gtkalpha($titlebar, 0.7);
|
background: $hover_color;
|
||||||
color: on($titlebar);
|
color: $sidebar_fg_color;
|
||||||
border-radius: $corner-radius;
|
border-radius: $button_radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -394,7 +386,7 @@ menubutton {
|
|||||||
&.sources-button {
|
&.sources-button {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
border-radius: 0;
|
border-radius: $button_radius;
|
||||||
border-top-style: none;
|
border-top-style: none;
|
||||||
border-bottom-style: none;
|
border-bottom-style: none;
|
||||||
|
|
||||||
@@ -404,17 +396,19 @@ menubutton {
|
|||||||
}
|
}
|
||||||
|
|
||||||
> button {
|
> button {
|
||||||
border-radius: 0;
|
border-radius: $button_radius;
|
||||||
|
min-height: 0;
|
||||||
|
padding: 0 $base_padding;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
padding: 0 $space-size;
|
padding: 0 $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
.subtitle {
|
.subtitle {
|
||||||
font-size: 8pt;
|
font-size: 8pt;
|
||||||
padding: 0 $space-size;
|
padding: 0 $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
.calendar-color-image {
|
.calendar-color-image {
|
||||||
@@ -424,12 +418,6 @@ menubutton {
|
|||||||
}
|
}
|
||||||
|
|
||||||
stack > box {
|
stack > box {
|
||||||
border-spacing: $space-size;
|
border-spacing: $base_padding;
|
||||||
}
|
|
||||||
|
|
||||||
.topbar headerbar &.sources-button {
|
|
||||||
> button {
|
|
||||||
border-radius: 0 0 $corner-radius $corner-radius;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
@@ -3,7 +3,7 @@
|
|||||||
//
|
//
|
||||||
|
|
||||||
.large-button {
|
.large-button {
|
||||||
padding: $space-size;
|
padding: $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
// alarms
|
// alarms
|
||||||
|
@@ -4,13 +4,13 @@
|
|||||||
|
|
||||||
.exit-info {
|
.exit-info {
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
border-top: 2px solid $primary;
|
border-top: 2px solid $accent_color;
|
||||||
background: rgba($primary, 0.9);
|
background: gtkalpha($accent_color, 0.9);
|
||||||
color: on($primary);
|
color: $accent_fg_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.error .exit-info {
|
.error .exit-info {
|
||||||
border-top: 2px solid $error;
|
border-top: 2px solid $error_color;
|
||||||
background: rgba($error, 0.9);
|
background: gtkalpha($error_color, 0.9);
|
||||||
color: on($error);
|
color: $error_fg_color;
|
||||||
}
|
}
|
@@ -1,22 +1,64 @@
|
|||||||
//
|
//
|
||||||
// Nautilus
|
// Nautilus
|
||||||
//
|
//
|
||||||
.nautilus-window {
|
.floating-bar {
|
||||||
.floating-bar {
|
min-height: 32px;
|
||||||
min-height: 32px;
|
padding: 0;
|
||||||
padding: 0;
|
margin: $base_padding / 2;
|
||||||
margin: $base_padding;
|
border-style: none;
|
||||||
border-style: none;
|
border-radius: $button_radius;
|
||||||
border-radius: $button_radius;
|
background-color: $accent_color;
|
||||||
background-color: $accent_color;
|
color: $accent_fg_color;
|
||||||
|
box-shadow: $shadow-z3;
|
||||||
|
|
||||||
|
button {
|
||||||
|
margin: (32px - $small_size) / 2;
|
||||||
color: $accent_fg_color;
|
color: $accent_fg_color;
|
||||||
box-shadow: $shadow-z3;
|
|
||||||
|
|
||||||
button {
|
@extend %small_button;
|
||||||
margin: (32px - $small_size) / 2;
|
}
|
||||||
color: $accent_fg_color;
|
}
|
||||||
|
|
||||||
@extend %small_button;
|
.nautilus-list-view {
|
||||||
|
columnview.view {
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
> header > button {
|
||||||
|
border-top: 1px solid $border_color;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
padding-right: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
listview.view {
|
||||||
|
padding: $base_padding;
|
||||||
|
margin: 0;
|
||||||
|
border-spacing: $base_padding / 2;
|
||||||
|
|
||||||
|
> row {
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
> cell {
|
||||||
|
padding: $base_padding - 2px;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
padding-right: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#NautilusViewCell {
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
button.star.circular {
|
||||||
|
margin: 0;
|
||||||
|
min-height: 24px;
|
||||||
|
min-width: 24px;
|
||||||
|
padding: $base_padding / 2;
|
||||||
|
border-radius: $circular_radius;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@@ -3,15 +3,15 @@
|
|||||||
//
|
//
|
||||||
|
|
||||||
.details-page {
|
.details-page {
|
||||||
margin: $space-size * 4 0px;
|
margin: $base_padding * 4 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.installed-overlay-box {
|
.installed-overlay-box {
|
||||||
font-size: smaller;
|
font-size: smaller;
|
||||||
background-color: $primary;
|
background-color: $accent_color;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
color: on($primary);
|
color: $accent_fg_color;
|
||||||
text-shadow: 0 1px 0 rgba(black, 0.2);
|
text-shadow: 0 1px 0 gtkalpha(black, 0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
screenshot-carousel box.frame {
|
screenshot-carousel box.frame {
|
||||||
@@ -21,15 +21,15 @@ screenshot-carousel box.frame {
|
|||||||
|
|
||||||
screenshot-carousel button,
|
screenshot-carousel button,
|
||||||
.featured-carousel button {
|
.featured-carousel button {
|
||||||
margin: $space-size * 2;
|
margin: $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.screenshot-image-main .image1,
|
.screenshot-image-main .image1,
|
||||||
.screenshot-image-main .image2 {
|
.screenshot-image-main .image2 {
|
||||||
margin-top: $space-size;
|
margin-top: $base_padding;
|
||||||
margin-bottom: $space-size * 2;
|
margin-bottom: $base_padding * 2;
|
||||||
margin-left: $space-size;
|
margin-left: $base_padding;
|
||||||
margin-right: $space-size;
|
margin-right: $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-tile-label {
|
.app-tile-label {
|
||||||
@@ -37,13 +37,13 @@ screenshot-carousel button,
|
|||||||
}
|
}
|
||||||
|
|
||||||
.review-textbox {
|
.review-textbox {
|
||||||
padding: $space-size;
|
padding: $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
.origin-rounded-box {
|
.origin-rounded-box {
|
||||||
background-color: $divider;
|
background-color: $hover_color;
|
||||||
border-radius: $circular-radius;
|
border-radius: $circular_radius;
|
||||||
padding: $space-size - 2px;
|
padding: $base_padding - 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.origin-beta {
|
.origin-beta {
|
||||||
@@ -51,7 +51,7 @@ screenshot-carousel button,
|
|||||||
}
|
}
|
||||||
|
|
||||||
.origin-button > button {
|
.origin-button > button {
|
||||||
padding: $space-size / 2 $space-size * 1.5;
|
padding: $base_padding / 2 $base_padding * 1.5;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card flowboxchild {
|
.card flowboxchild {
|
||||||
@@ -64,21 +64,21 @@ screenshot-carousel button,
|
|||||||
}
|
}
|
||||||
|
|
||||||
.category-tile.card {
|
.category-tile.card {
|
||||||
padding: $space-size * 3.5;
|
padding: $base_padding * 3.5;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: $corner-radius;
|
border-radius: $button_radius;
|
||||||
min-width: 140px;
|
min-width: 140px;
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
font-size: larger;
|
font-size: larger;
|
||||||
box-shadow: $shadow-z3;
|
box-shadow: $shadow-z3;
|
||||||
|
|
||||||
&.category-tile-iconless {
|
&.category-tile-iconless {
|
||||||
padding: $space-size * 1.5 $space-size * 2.5;
|
padding: $base_padding * 1.5 $base_padding * 2.5;
|
||||||
min-width: 130px;
|
min-width: 130px;
|
||||||
font-size: 105%;
|
font-size: 105%;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
background-color: $fill;
|
background-color: $button_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Styling for specific category buttons.
|
// Styling for specific category buttons.
|
||||||
@@ -144,7 +144,7 @@ screenshot-carousel button,
|
|||||||
|
|
||||||
&.category-socialize {
|
&.category-socialize {
|
||||||
background: linear-gradient(90deg, #ef4e9b 0%, #f77466 100%);
|
background: linear-gradient(90deg, #ef4e9b 0%, #f77466 100%);
|
||||||
color: $text-secondary;
|
color: $secondary_text_color;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: linear-gradient(90deg, shade(#ef4e9b, 1.08) 0%, shade(#f77466, 1.08) 100%);
|
background: linear-gradient(90deg, shade(#ef4e9b, 1.08) 0%, shade(#f77466, 1.08) 100%);
|
||||||
@@ -159,23 +159,23 @@ screenshot-carousel button,
|
|||||||
padding: 1px; /* FIXME: work around https://gitlab.gnome.org/GNOME/gtk/-/issues/4324 */
|
padding: 1px; /* FIXME: work around https://gitlab.gnome.org/GNOME/gtk/-/issues/4324 */
|
||||||
color: #1c71d8;
|
color: #1c71d8;
|
||||||
background-color:#fdf8d7;
|
background-color:#fdf8d7;
|
||||||
background-image: linear-gradient($border 1px, transparent 1px),
|
background-image: linear-gradient($border_color 1px, transparent 1px),
|
||||||
linear-gradient(90deg, $border 1px, transparent 1px);
|
linear-gradient(90deg, $border_color 1px, transparent 1px);
|
||||||
background-size: 10px 10px, 10px 10px;
|
background-size: 10px 10px, 10px 10px;
|
||||||
background-position: -1px -4px, center -1px;
|
background-position: -1px -4px, center -1px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: #1c71d8;
|
color: #1c71d8;
|
||||||
background-color: lighten(#fdf8d7, 5%);
|
background-color: lighten(#fdf8d7, 5%);
|
||||||
background-image: linear-gradient($border 1px, transparent 1px),
|
background-image: linear-gradient($border_color 1px, transparent 1px),
|
||||||
linear-gradient(90deg, $border 1px, transparent 1px);
|
linear-gradient(90deg, $border_color 1px, transparent 1px);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:active {
|
&:active {
|
||||||
color: #1c71d8;
|
color: #1c71d8;
|
||||||
background-color: darken(#fdf8d7, 5%);
|
background-color: darken(#fdf8d7, 5%);
|
||||||
background-image: linear-gradient($border 1px, transparent 1px),
|
background-image: linear-gradient($border_color 1px, transparent 1px),
|
||||||
linear-gradient(90deg, $border 1px, transparent 1px);
|
linear-gradient(90deg, $border_color 1px, transparent 1px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -189,11 +189,11 @@ clamp.large .category-tile:not(.category-tile-iconless) {
|
|||||||
.featured-tile {
|
.featured-tile {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
color: $text;
|
color: $text_color;
|
||||||
|
|
||||||
label.title-1 {
|
label.title-1 {
|
||||||
margin-top: $space-size;
|
margin-top: $base_padding;
|
||||||
margin-bottom: $space-size;
|
margin-bottom: $base_padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.narrow label.title-1 {
|
&.narrow label.title-1 {
|
||||||
@@ -203,15 +203,15 @@ clamp.large .category-tile:not(.category-tile-iconless) {
|
|||||||
|
|
||||||
.application-details-infobar {
|
.application-details-infobar {
|
||||||
&, &.info {
|
&, &.info {
|
||||||
background-color: $fill;
|
background-color: $button_color;
|
||||||
color: $text;
|
color: $text_color;
|
||||||
border: 1px solid $border;
|
border: 1px solid $border_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.warning {
|
&.warning {
|
||||||
background-color: $warning;
|
background-color: $warning_color;
|
||||||
color: on($warning);
|
color: $warning_fg_color;
|
||||||
border: 1px solid on($warning, divider);
|
border: 1px solid gtkalpha($warning_fg_color, 0.1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -222,12 +222,12 @@ clamp.large .category-tile:not(.category-tile-iconless) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.application-details-description .button {
|
.application-details-description .button {
|
||||||
padding-left: $space-size * 4;
|
padding-left: $base_padding * 4;
|
||||||
padding-right: $space-size * 4;
|
padding-right: $base_padding * 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
.install-progress {
|
.install-progress {
|
||||||
background-image: linear-gradient(to top, $primary 2px, gtkalpha($primary, 0) 2px);
|
background-image: linear-gradient(to top, $accent_color 2px, gtkalpha($accent_color, 0) 2px);
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: 0 bottom;
|
background-position: 0 bottom;
|
||||||
background-size: 0;
|
background-size: 0;
|
||||||
@@ -237,7 +237,7 @@ clamp.large .category-tile:not(.category-tile-iconless) {
|
|||||||
.install-progress:dir(rtl) { background-position: 100% bottom; }
|
.install-progress:dir(rtl) { background-position: 100% bottom; }
|
||||||
|
|
||||||
.review-row > * {
|
.review-row > * {
|
||||||
margin: $space-size * 2;
|
margin: $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.review-row button { font-size: smaller; }
|
.review-row button { font-size: smaller; }
|
||||||
@@ -248,7 +248,7 @@ clamp.large .category-tile:not(.category-tile-iconless) {
|
|||||||
|
|
||||||
// this is the separator between yes and no vote buttons, gtk+ 3.20 only
|
// this is the separator between yes and no vote buttons, gtk+ 3.20 only
|
||||||
.review-row .vote-buttons button:not(:first-child) {
|
.review-row .vote-buttons button:not(:first-child) {
|
||||||
border-image: linear-gradient(to top, $border, $border) 0 0 0 1 / 5px 0 5px 1px;
|
border-image: linear-gradient(to top, $border_color, $border_color) 0 0 0 1 / 5px 0 5px 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.review-row .vote-buttons button:hover,
|
.review-row .vote-buttons button:hover,
|
||||||
@@ -259,13 +259,13 @@ clamp.large .category-tile:not(.category-tile-iconless) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
review-bar {
|
review-bar {
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
background-image: none;
|
background-image: none;
|
||||||
background-color: $track;
|
background-color: $secondary_disabled_text_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.review-histogram star-image {
|
.review-histogram star-image {
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.version-arrow-label {
|
.version-arrow-label {
|
||||||
@@ -274,7 +274,7 @@ review-bar {
|
|||||||
|
|
||||||
.overview-more-button {
|
.overview-more-button {
|
||||||
font-size: smaller;
|
font-size: smaller;
|
||||||
padding: 0 $space-size * 2 + 4px;
|
padding: 0 $base_padding * 2 + 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-row-origin-text {
|
.app-row-origin-text {
|
||||||
@@ -282,8 +282,8 @@ review-bar {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.app-listbox-header {
|
.app-listbox-header {
|
||||||
padding: $space-size;
|
padding: $base_padding;
|
||||||
border-bottom: 1px solid $border;
|
border-bottom: 1px solid $border_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.image-list {
|
.image-list {
|
||||||
@@ -318,12 +318,12 @@ star-image {
|
|||||||
.update-failed-details {
|
.update-failed-details {
|
||||||
font-family: Monospace;
|
font-family: Monospace;
|
||||||
font-size: smaller;
|
font-size: smaller;
|
||||||
padding: $space-size * 2 + 4px;
|
padding: $base_padding * 2 + 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.upgrade-banner {
|
.upgrade-banner {
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
border-radius: $corner-radius;
|
border-radius: $button_radius;
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -333,25 +333,25 @@ star-image {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.upgrade-buttons #button_upgrades_install {
|
.upgrade-buttons #button_upgrades_install {
|
||||||
padding-left: $space-size * 2 + 4px;
|
padding-left: $base_padding * 2 + 4px;
|
||||||
padding-right: $space-size * 2 + 4px;
|
padding-right: $base_padding * 2 + 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
scrolledwindow.list-page > viewport > clamp > box {
|
scrolledwindow.list-page > viewport > clamp > box {
|
||||||
margin: $space-size * 4 $space-size * 2;
|
margin: $base_padding * 4 $base_padding * 2;
|
||||||
border-spacing: $space-size * 4;
|
border-spacing: $base_padding * 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
.update-preferences preferencesgroup > box > box {
|
.update-preferences preferencesgroup > box > box {
|
||||||
margin-top: $space-size * 3;
|
margin-top: $base_padding * 3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.section > label:not(:first-child) { margin-top: $space-size; }
|
.section > label:not(:first-child) { margin-top: $base_padding; }
|
||||||
|
|
||||||
.section > box:not(:first-child) { margin-top: $space-size * 2; }
|
.section > box:not(:first-child) { margin-top: $base_padding * 2; }
|
||||||
|
|
||||||
clamp.status-page {
|
clamp.status-page {
|
||||||
margin: $space-size * 6 $space-size * 2;
|
margin: $base_padding * 6 $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
clamp.status-page .iconbox {
|
clamp.status-page .iconbox {
|
||||||
@@ -360,25 +360,25 @@ clamp.status-page .iconbox {
|
|||||||
}
|
}
|
||||||
|
|
||||||
clamp.status-page .icon {
|
clamp.status-page .icon {
|
||||||
color: $text-disabled;
|
color: $disabled_text_color;
|
||||||
min-height: 32px;
|
min-height: 32px;
|
||||||
min-width: 32px;
|
min-width: 32px;
|
||||||
}
|
}
|
||||||
|
|
||||||
clamp.status-page .icon:not(:last-child) {
|
clamp.status-page .icon:not(:last-child) {
|
||||||
margin-bottom: $space-size * 6;
|
margin-bottom: $base_padding * 6;
|
||||||
}
|
}
|
||||||
|
|
||||||
clamp.status-page .title:not(:last-child) {
|
clamp.status-page .title:not(:last-child) {
|
||||||
margin-bottom: $space-size * 2;
|
margin-bottom: $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
app-context-bar {
|
app-context-bar {
|
||||||
.context-tile {
|
.context-tile {
|
||||||
border: 1px solid $border;
|
border: 1px solid $border_color;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
padding: $space-size * 4 $space-size * 2 $space-size * 3.5 $space-size * 2;
|
padding: $base_padding * 4 $base_padding * 2 $base_padding * 3.5 $base_padding * 2;
|
||||||
outline-offset: 5px;
|
outline-offset: 5px;
|
||||||
transition-property: outline, outline-offset, background-image;
|
transition-property: outline, outline-offset, background-image;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
@@ -386,12 +386,12 @@ app-context-bar {
|
|||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-image: none;
|
background-image: none;
|
||||||
background-color: $overlay-hover;
|
background-color: $hover_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.keyboard-activating,
|
&.keyboard-activating,
|
||||||
&:active {
|
&:active {
|
||||||
background-color: $overlay-active;
|
background-color: $active_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:focus:focus-visible {
|
&:focus:focus-visible {
|
||||||
@@ -413,7 +413,7 @@ app-context-bar {
|
|||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
|
||||||
&:last-child {
|
&:last-child {
|
||||||
border-radius: 0 $corner-radius $corner-radius 0;
|
border-radius: 0 $button_radius $button_radius 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -421,27 +421,27 @@ app-context-bar {
|
|||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
border-radius: $corner-radius 0 0 $corner-radius;
|
border-radius: $button_radius 0 0 $button_radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> box > button.flat {
|
> box > button.flat {
|
||||||
border-left-color: $border;
|
border-left-color: $border_color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
carousel.card {
|
carousel.card {
|
||||||
border: none;
|
border: none;
|
||||||
background-color: $fill;
|
background-color: $button_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.context-tile-lozenge {
|
.context-tile-lozenge {
|
||||||
min-height: 28px;
|
min-height: 28px;
|
||||||
min-width: 28px;
|
min-width: 28px;
|
||||||
padding: $space-size;
|
padding: $base_padding;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
border-radius: $circular-radius;
|
border-radius: $circular_radius;
|
||||||
|
|
||||||
&.large {
|
&.large {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
@@ -458,40 +458,40 @@ carousel.card {
|
|||||||
image { -gtk-icon-style: symbolic; }
|
image { -gtk-icon-style: symbolic; }
|
||||||
|
|
||||||
&.grey {
|
&.grey {
|
||||||
color: $text;
|
color: $text_color;
|
||||||
background-color: $divider;
|
background-color: $hover_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.green, &.details-rating-0 {
|
&.green, &.details-rating-0 {
|
||||||
color: darken($success, 15%);
|
color: gtkmix(black, $success_color, 15%);
|
||||||
background-color: rgba($success, 0.15);
|
background-color: gtkalpha($success_color, 0.15);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.blue,
|
&.blue,
|
||||||
&.details-rating-5 {
|
&.details-rating-5 {
|
||||||
color: $blue-light;
|
color: $blue-light;
|
||||||
background-color: rgba($blue-light, 0.15);
|
background-color: gtkalpha($blue-light, 0.15);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.yellow, &.details-rating-12 {
|
&.yellow, &.details-rating-12 {
|
||||||
color: darken($warning, 15%);
|
color: gtkmix(black, $warning_color, 15%);
|
||||||
background-color: rgba($warning, 0.15);
|
background-color: gtkalpha($warning_color, 0.15);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.details-rating-15 {
|
&.details-rating-15 {
|
||||||
color: $orange-light;
|
color: $orange-light;
|
||||||
background-color: rgba($orange-light, .15);
|
background-color: gtkalpha($orange-light, .15);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.red, &.details-rating-18 {
|
&.red, &.details-rating-18 {
|
||||||
color: darken($error, 15%);
|
color: gtkmix(black, $error_color, 15%);
|
||||||
background-color: rgba($error, 0.15);
|
background-color: gtkalpha($error_color, 0.15);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.eol-red {
|
.eol-red {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: $error;
|
color: $error_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
window.narrow .app-title {
|
window.narrow .app-title {
|
||||||
@@ -507,10 +507,10 @@ window.narrow .app-developer {
|
|||||||
font-feature-settings: "tnum";
|
font-feature-settings: "tnum";
|
||||||
}
|
}
|
||||||
|
|
||||||
scrolledwindow.fake-adw-status-page > viewport > box { margin: $space-size * 6 $space-size * 2; }
|
scrolledwindow.fake-adw-status-page > viewport > box { margin: $base_padding * 6 $base_padding * 2; }
|
||||||
scrolledwindow.fake-adw-status-page > viewport > box > clamp:not(:last-child) > box { margin-bottom: $space-size * 6; }
|
scrolledwindow.fake-adw-status-page > viewport > box > clamp:not(:last-child) > box { margin-bottom: $base_padding * 6; }
|
||||||
scrolledwindow.fake-adw-status-page > viewport > box > clamp > box > .icon:not(:last-child) { margin-bottom: $space-size * 6; }
|
scrolledwindow.fake-adw-status-page > viewport > box > clamp > box > .icon:not(:last-child) { margin-bottom: $base_padding * 6; }
|
||||||
scrolledwindow.fake-adw-status-page > viewport > box > clamp > box > .title:not(:last-child) { margin-bottom: $space-size * 2; }
|
scrolledwindow.fake-adw-status-page > viewport > box > clamp > box > .title:not(:last-child) { margin-bottom: $base_padding * 2; }
|
||||||
|
|
||||||
statuspage.icon-dropshadow image.icon {
|
statuspage.icon-dropshadow image.icon {
|
||||||
-gtk-icon-shadow: 0 1px 12px rgba(0,0,0,0.05),
|
-gtk-icon-shadow: 0 1px 12px rgba(0,0,0,0.05),
|
||||||
@@ -532,17 +532,17 @@ window.info scrollbar.vertical trough {
|
|||||||
|
|
||||||
// GsAppRow
|
// GsAppRow
|
||||||
row.app > box.header {
|
row.app > box.header {
|
||||||
margin-left: $space-size * 2;
|
margin-left: $base_padding * 2;
|
||||||
margin-right: $space-size * 2;
|
margin-right: $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
row.app > box.header {
|
row.app > box.header {
|
||||||
border-spacing: $space-size * 2;
|
border-spacing: $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
row.app > box.header > image {
|
row.app > box.header > image {
|
||||||
margin-top: $space-size * 2;
|
margin-top: $base_padding * 2;
|
||||||
margin-bottom: $space-size * 2;
|
margin-bottom: $base_padding * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
row.app label.warning {
|
row.app label.warning {
|
||||||
@@ -565,16 +565,4 @@ row.app label.warning {
|
|||||||
spinner.fade-in:checked {
|
spinner.fade-in:checked {
|
||||||
animation: pre-delay 0.5s linear 1, fade-in 1s linear 1, spin 1s linear infinite;
|
animation: pre-delay 0.5s linear 1, fade-in 1s linear 1, spin 1s linear infinite;
|
||||||
animation-delay: 0s, 0.5s, 0.5s;
|
animation-delay: 0s, 0.5s, 0.5s;
|
||||||
}
|
|
||||||
|
|
||||||
// Leaflets
|
|
||||||
window > contents > leaflet { // Gnome control center
|
|
||||||
> box > stack.background {
|
|
||||||
background-color: transparent;
|
|
||||||
background-image: linear-gradient(to bottom,
|
|
||||||
transparent,
|
|
||||||
transparent $large-size,
|
|
||||||
$background $large-size,
|
|
||||||
$background);
|
|
||||||
}
|
|
||||||
}
|
}
|
@@ -13,6 +13,7 @@ columnview {
|
|||||||
line-height: 100%;
|
line-height: 100%;
|
||||||
border-left: 1px solid $border_color;
|
border-left: 1px solid $border_color;
|
||||||
border-bottom: 1px solid $border_color;
|
border-bottom: 1px solid $border_color;
|
||||||
|
background-clip: padding-box;
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
border-left-width: 0;
|
border-left-width: 0;
|
||||||
@@ -97,7 +98,11 @@ columnview {
|
|||||||
padding-bottom: $base_padding / 2;
|
padding-bottom: $base_padding / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include undershoot(top, $shade_color, true);
|
@include undershoot(top, $shade_color, $neighbor: true, $style: default);
|
||||||
|
|
||||||
|
~ undershoot.top {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
columnview row:not(:selected) cell editablelabel:not(.editing):focus-within {
|
columnview row:not(:selected) cell editablelabel:not(.editing):focus-within {
|
||||||
|
@@ -14,6 +14,19 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@if $colorscheme != 'default' or $blackness == 'true' or $colortype == 'fixed' {
|
||||||
|
listview,
|
||||||
|
list,
|
||||||
|
list.boxed-list {
|
||||||
|
background-color: gtkmix(white, $sidebar_bg_color, 5%);
|
||||||
|
color: $sidebar_fg_color;
|
||||||
|
}
|
||||||
|
|
||||||
|
list.boxed-list-separate {
|
||||||
|
color: $sidebar_fg_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
flap,
|
flap,
|
||||||
leaflet,
|
leaflet,
|
||||||
navigation-view,
|
navigation-view,
|
||||||
@@ -46,6 +59,10 @@
|
|||||||
.sidebar-pane, .content-pane {
|
.sidebar-pane, .content-pane {
|
||||||
toolbarview.undershoot-top scrolledwindow {
|
toolbarview.undershoot-top scrolledwindow {
|
||||||
@include undershoot(top, $sidebar_shade_color, $style: frame);
|
@include undershoot(top, $sidebar_shade_color, $style: frame);
|
||||||
|
|
||||||
|
columnview.view ~ undershoot.top {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
toolbarview.undershoot-bottom scrolledwindow {
|
toolbarview.undershoot-bottom scrolledwindow {
|
||||||
@@ -104,7 +121,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&.undershoot-bottom {
|
&.undershoot-bottom {
|
||||||
@include undershoot(bottom, $secondary_sidebar_shade_color)
|
@include undershoot(bottom, $secondary_sidebar_shade_color);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.undershoot-start {
|
&.undershoot-start {
|
||||||
|
Reference in New Issue
Block a user