refactor start
This commit is contained in:
parent
bd49791e06
commit
e46d25f0b7
16699 changed files with 2 additions and 1484887 deletions
|
|
@ -1,48 +0,0 @@
|
|||
@import './button';
|
||||
|
||||
@mixin accs-button($flat: false, $reactive: true) {
|
||||
@include unset;
|
||||
color: $fg;
|
||||
|
||||
>* {
|
||||
border-radius: $radius;
|
||||
transition: $transition;
|
||||
|
||||
@if $flat {
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@else {
|
||||
background-color: $widget-bg;
|
||||
box-shadow: inset 0 0 0 $border-width $border-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@if $reactive {
|
||||
|
||||
&:focus>*,
|
||||
&.focused>* {
|
||||
@include button-focus;
|
||||
}
|
||||
|
||||
&:hover>* {
|
||||
@include button-hover;
|
||||
}
|
||||
|
||||
&:active,
|
||||
&.active,
|
||||
&.on,
|
||||
&:checked {
|
||||
>* {
|
||||
@include button-active;
|
||||
}
|
||||
|
||||
&:hover>* {
|
||||
box-shadow: inset 0 0 0 $border-width $border-color,
|
||||
inset 0 0 0 99px $hover-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,70 +0,0 @@
|
|||
@mixin button-focus() {
|
||||
box-shadow: inset 0 0 0 $border-width $primary-bg;
|
||||
background-color: $hover-bg;
|
||||
color: $hover-fg;
|
||||
}
|
||||
|
||||
@mixin button-hover() {
|
||||
box-shadow: inset 0 0 0 $border-width $border-color;
|
||||
background-color: $hover-bg;
|
||||
color: $hover-fg;
|
||||
}
|
||||
|
||||
@mixin button-active() {
|
||||
box-shadow: inset 0 0 0 $border-width $border-color;
|
||||
background-image: $active-gradient;
|
||||
background-color: $primary-bg;
|
||||
color: $primary-fg;
|
||||
}
|
||||
|
||||
@mixin button-disabled() {
|
||||
box-shadow: none;
|
||||
background-color: transparent;
|
||||
color: transparentize($fg, 0.7);
|
||||
}
|
||||
|
||||
@mixin button($flat: false, $reactive: true, $radius: $radius, $focusable: true) {
|
||||
all: unset;
|
||||
transition: $transition;
|
||||
border-radius: $radius;
|
||||
color: $fg;
|
||||
|
||||
@if $flat {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@else {
|
||||
background-color: $widget-bg;
|
||||
box-shadow: inset 0 0 0 $border-width $border-color;
|
||||
}
|
||||
|
||||
@if $reactive {
|
||||
@if $focusable {
|
||||
&:focus {
|
||||
@include button-focus;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include button-hover;
|
||||
}
|
||||
|
||||
&:active,
|
||||
&.on,
|
||||
&.active,
|
||||
&:checked {
|
||||
@include button-active;
|
||||
|
||||
&:hover {
|
||||
box-shadow: inset 0 0 0 $border-width $border-color,
|
||||
inset 0 0 0 99px $hover-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
@include button-disabled;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
@mixin floating-widget {
|
||||
@if $shadows {
|
||||
box-shadow: 0 0 5px 0 $shadow-color;
|
||||
}
|
||||
|
||||
margin: max($spacing, 8px);
|
||||
border: $border-width solid $popover-border-color;
|
||||
background-color: $bg;
|
||||
color: $fg;
|
||||
border-radius: $popover-radius;
|
||||
padding: $popover-padding;
|
||||
}
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
@mixin hidden {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border-color: transparent;
|
||||
box-shadow: none;
|
||||
-gtk-icon-transform: scale(0);
|
||||
|
||||
* {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border-color: transparent;
|
||||
box-shadow: none;
|
||||
-gtk-icon-transform: scale(0);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
@mixin media() {
|
||||
@include widget;
|
||||
padding: $padding;
|
||||
|
||||
.cover {
|
||||
@if $shadows {
|
||||
box-shadow: 2px 2px 2px 0 $shadow-color;
|
||||
}
|
||||
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: $radius*0.8;
|
||||
margin-right: $spacing;
|
||||
}
|
||||
|
||||
button {
|
||||
@include button($flat: true);
|
||||
padding: $padding * .5;
|
||||
|
||||
&.play-pause {
|
||||
margin: 0 ($spacing * .5);
|
||||
}
|
||||
|
||||
image {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
.artist {
|
||||
color: transparentize($fg, .2);
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
scale {
|
||||
@include slider($width: .5em, $slider: false, $gradient: linear-gradient($fg, $fg));
|
||||
margin-bottom: $padding * .5;
|
||||
|
||||
trough {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
@mixin scrollable($top: false, $bottom: false) {
|
||||
|
||||
@if $top and $shadows {
|
||||
undershoot.top {
|
||||
background: linear-gradient(to bottom, $shadow-color, transparent, transparent, transparent, transparent, transparent);
|
||||
}
|
||||
}
|
||||
|
||||
@if $bottom and $shadows {
|
||||
undershoot.bottom {
|
||||
background: linear-gradient(to top, $shadow-color, transparent, transparent, transparent, transparent, transparent);
|
||||
}
|
||||
}
|
||||
|
||||
scrollbar,
|
||||
scrollbar * {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
scrollbar.vertical {
|
||||
transition: $transition;
|
||||
background-color: transparentize($bg, 0.7);
|
||||
|
||||
&:hover {
|
||||
background-color: transparentize($bg, 0.3);
|
||||
|
||||
slider {
|
||||
background-color: transparentize($fg, 0.3);
|
||||
min-width: .6em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
scrollbar.vertical slider {
|
||||
background-color: transparentize($fg, 0.5);
|
||||
border-radius: $radius;
|
||||
min-width: .4em;
|
||||
min-height: 2em;
|
||||
transition: $transition;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,74 +0,0 @@
|
|||
@import './unset';
|
||||
|
||||
@mixin slider($width: 0.7em, $slider-width: .5em, $gradient: $active-gradient, $slider: true, $focusable: true, $radius: $radius) {
|
||||
@include unset($rec: true);
|
||||
|
||||
trough {
|
||||
transition: $transition;
|
||||
border-radius: $radius;
|
||||
border: $border;
|
||||
background-color: $widget-bg;
|
||||
min-height: $width;
|
||||
min-width: $width;
|
||||
|
||||
highlight,
|
||||
progress {
|
||||
border-radius: max($radius - $border-width, 0);
|
||||
background-image: $gradient;
|
||||
min-height: $width;
|
||||
min-width: $width;
|
||||
}
|
||||
}
|
||||
|
||||
slider {
|
||||
box-shadow: none;
|
||||
background-color: transparent;
|
||||
border: $border-width solid transparent;
|
||||
transition: $transition;
|
||||
border-radius: $radius;
|
||||
min-height: $width;
|
||||
min-width: $width;
|
||||
margin: -$slider-width;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
trough {
|
||||
background-color: $hover-bg;
|
||||
}
|
||||
|
||||
slider {
|
||||
@if $slider {
|
||||
background-color: $fg;
|
||||
border-color: $border-color;
|
||||
|
||||
@if $shadows {
|
||||
box-shadow: 0 0 3px 0 $shadow-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
|
||||
highlight,
|
||||
progress {
|
||||
background-color: transparentize($fg, 0.4);
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
@if $focusable {
|
||||
trough:focus {
|
||||
background-color: $hover-bg;
|
||||
box-shadow: inset 0 0 0 $border-width $primary-bg;
|
||||
|
||||
slider {
|
||||
@if $slider {
|
||||
background-color: $fg;
|
||||
box-shadow: inset 0 0 0 $border-width $primary-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
@mixin spacing($multiplier: 1, $spacing: $spacing, $rec: false) {
|
||||
&.horizontal>* {
|
||||
margin: 0 calc($spacing * $multiplier / 2);
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.vertical>* {
|
||||
margin: calc($spacing * $multiplier / 2) 0;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@if $rec {
|
||||
box {
|
||||
&.horizontal>* {
|
||||
margin: 0 $spacing * $multiplier / 2;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.vertical>* {
|
||||
margin: $spacing * $multiplier / 2 0;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
@import './button';
|
||||
|
||||
@mixin switch {
|
||||
@include button;
|
||||
|
||||
slider {
|
||||
background-color: $primary-fg;
|
||||
border-radius: $radius;
|
||||
min-width: 24px;
|
||||
min-height: 24px;
|
||||
}
|
||||
|
||||
image {
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
@mixin unset($rec: false) {
|
||||
all: unset;
|
||||
|
||||
@if $rec {
|
||||
* {
|
||||
all: unset
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
@mixin widget {
|
||||
transition: $transition;
|
||||
border-radius: $radius;
|
||||
color: $fg;
|
||||
background-color: $widget-bg;
|
||||
border: $border;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue