Price/dots
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(waybar): do not use gtk @colors for color variables

Browse Source 
This makes css lsp throw a fit, not worth using anyhow with the
non-generic method of coloration we're doing anyways.
This commit is contained in:
Price Hiller 2023-05-28 03:23:33 -05:00
parent d3bf2b7c62
commit 6f187d3854
Signed by: Price
SSH Key Fingerprint: SHA256:Y4S9ZzYphRn1W1kbJerJFO6GGsfu9O70VaBSxJO7dF8
1 changed files with 89 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

182
dots/.config/waybar/style.css
View File

@ -1,39 +1,39 @@
@define-color fujiWhite #DCD7BA; /* fujiWhite #DCD7BA; */
@define-color oldWhite #C8C093; /* oldWhite #C8C093; */
@define-color sumiInk0 #16161D; /* sumiInk0 #16161D; */
@define-color sumiInk1 #1F1F28; /* sumiInk1 #1F1F28; */
@define-color sumiInk2 #2A2A37; /* sumiInk2 #2A2A37; */
@define-color sumiInk3 #363646; /* sumiInk3 #363646; */
@define-color sumiInk4 #54546D; /* sumiInk4 #54546D; */
@define-color waveBlue1 #223249; /* waveBlue1 #223249; */
@define-color waveBlue2 #2D4F67; /* waveBlue2 #2D4F67; */
@define-color winterGreen #2B3328; /* winterGreen #2B3328; */
@define-color winterYellow #49443C; /* winterYellow #49443C; */
@define-color winterRed #43242B; /* winterRed #43242B; */
@define-color winterBlue #252535; /* winterBlue #252535; */
@define-color autumnGreen #76946A; /* autumnGreen #76946A; */
@define-color autumnRed #C34043; /* autumnRed #C34043; */
@define-color autumnYellow #DCA561; /* autumnYellow #DCA561; */
@define-color samuraiRed #E82424; /* samuraiRed #E82424; */
@define-color roninYellow #FF9E3B; /* roninYellow #FF9E3B; */
@define-color waveAqua1 #6A9589; /* waveAqua1 #6A9589; */
@define-color dragonBlue #658594; /* dragonBlue #658594; */
@define-color fujiGray #727169; /* fujiGray #727169; */
@define-color springViolet1 #938AA9; /* springViolet1 #938AA9; */
@define-color oniViolet #957FB8; /* oniViolet #957FB8; */
@define-color crystalBlue #7E9CD8; /* crystalBlue #7E9CD8; */
@define-color springViolet2 #9CABCA; /* springViolet2 #9CABCA; */
@define-color springBlue #7FB4CA; /* springBlue #7FB4CA; */
@define-color lightBlue #A3D4D5; /* lightBlue #A3D4D5; */
@define-color waveAqua2 #7AA89F; /* waveAqua2 #7AA89F; */
@define-color springGreen #98BB6C; /* springGreen #98BB6C; */
@define-color boatYellow1 #938056; /* boatYellow1 #938056; */
@define-color boatYellow2 #C0A36E; /* boatYellow2 #C0A36E; */
@define-color carpYellow #E6C384; /* carpYellow #E6C384; */
@define-color sakuraPink #D27E99; /* sakuraPink #D27E99; */
@define-color waveRed #E46876; /* waveRed #E46876; */
@define-color peachRed #FF5D62; /* peachRed #FF5D62; */
@define-color surimiOrange #FFA066; /* surimiOrange #FFA066; */
* { * {
min-height: 0; min-height: 0;
@ -51,45 +51,44 @@
background: transparent; background: transparent;
font-family: JetBrainsMono; font-family: JetBrainsMono;
font-size: medium; font-size: medium;
color: @fujiWhite; color: #dcd7ba;
} }
#custom-media { #custom-media {
background: @sumiInk0; background: #16161d;
border-top: 2px solid @oniViolet; border-top: 2px solid #957fb8;
border-left: 2px solid @oniViolet; border-left: 2px solid #957fb8;
border-right: 2px solid @oniViolet; border-right: 2px solid #957fb8;
color: @fujiWhite; color: #dcd7ba;
} }
#custom-asusmode { #custom-asusmode {
background: @sumiInk0; background: #16161d;
border-top: 2px solid @oniViolet; border-top: 2px solid #957fb8;
border-left: 2px solid @oniViolet; border-left: 2px solid #957fb8;
color: @fujiWhite; color: #dcd7ba;
} }
#custom-audio-device { #custom-audio-device {
background: @sumiInk0; background: #16161d;
border-top: 2px solid @oniViolet; border-top: 2px solid #957fb8;
border-left: 2px solid @oniViolet; border-left: 2px solid #957fb8;
color: @fujiWhite; color: #dcd7ba;
} }
#custom-sway-mode { #custom-sway-mode {
background: @sumiInk0; background: #16161d;
border-bottom: 2px solid @oniViolet; border-bottom: 2px solid #957fb8;
border-left: 2px solid @oniViolet; border-left: 2px solid #957fb8;
color: @fujiWhite; color: #dcd7ba;
} }
#workspaces { #workspaces {
background: @sumiInk0; background: #16161d;
transition: none; transition: none;
border-top: 2px solid @oniViolet; border-top: 2px solid #957fb8;
border-left: 2px solid @oniViolet; border-left: 2px solid #957fb8;
border-right: 2px solid @oniViolet; border-right: 2px solid #957fb8;
padding-right: 20px; padding-right: 20px;
padding-left: 20px; padding-left: 20px;
} }
@ -97,9 +96,9 @@
#workspaces button { #workspaces button {
transition: none; transition: none;
margin: 0px; margin: 0px;
color: @oniViolet; color: #957fb8;
background: transparent; background: transparent;
border-bottom: 2px solid @oniViolet; border-bottom: 2px solid #957fb8;
border-radius: 0px; border-radius: 0px;
padding-right: 25px; padding-right: 25px;
padding-left: 25px; padding-left: 25px;
@ -108,8 +107,8 @@
} }
#workspaces button.active { #workspaces button.active {
color: @springGreen; color: #98bb6c;
border-bottom: 2px solid @springGreen; border-bottom: 2px solid #98bb6c;
border-radius: 0px; border-radius: 0px;
} }
@ -118,8 +117,8 @@
box-shadow: inherit; box-shadow: inherit;
text-shadow: inherit; text-shadow: inherit;
border-top: 0px; border-top: 0px;
border-bottom: 2px solid @lightBlue; border-bottom: 2px solid #a3d4d5;
color: @lightBlue; color: #a3d4d5;
border-right: 0px; border-right: 0px;
border-left: 0px; border-left: 0px;
border-radius: 0px; border-radius: 0px;
@ -127,20 +126,20 @@
#idle_inhibitor { #idle_inhibitor {
margin-left: 0px; margin-left: 0px;
background: @sumiInk0; background: #16161d;
border-top: 2px solid @oniViolet; border-top: 2px solid #957fb8;
border-left: 2px solid @oniViolet; border-left: 2px solid #957fb8;
color: @fujiWhite; color: #dcd7ba;
} }
#network, #network,
#custom-weather, #custom-weather,
#clock, #clock,
#custom-lock { #custom-lock {
background: @sumiInk0; background: #16161d;
border-top: 2px solid @oniViolet; border-top: 2px solid #957fb8;
border-right: 2px solid @oniViolet; border-right: 2px solid #957fb8;
color: @fujiWhite; color: #dcd7ba;
} }
#cpu, #cpu,
@ -149,36 +148,36 @@
#disk, #disk,
#temperature, #temperature,
#battery { #battery {
background: @sumiInk0; background: #16161d;
border-top: 2px solid @oniViolet; border-top: 2px solid #957fb8;
border-left: 2px solid @oniViolet; border-left: 2px solid #957fb8;
color: @fujiWhite; color: #dcd7ba;
} }
#disk.critical { #disk.critical {
color: @samuraiRed; color: #e82424;
} }
#temperature.critical { #temperature.critical {
color: @samuraiRed; color: #e82424;
} }
#cpu.critical { #cpu.critical {
color: @samuraiRed; color: #e82424;
} }
#memory.critical { #memory.critical {
color: @samuraiRed; color: #e82424;
} }
@keyframes blink1 { @keyframes blink1 {
to { to {
color: @springGreen; color: #98bb6c;
} }
} }
#battery.plugged { #battery.plugged {
background-color: @sumiInk0; background-color: #16161d;
animation-name: blink1; animation-name: blink1;
animation-duration: 2s; animation-duration: 2s;
animation-timing-function: linear; animation-timing-function: linear;
@ -188,12 +187,11 @@
@keyframes blink2 { @keyframes blink2 {
to { to {
background-color: @carpYellow; background-color: #e6c384;
} }
} }
#battery.charging { #battery.charging {
/* background-color: @sumiInk0; */
animation-name: blink2; animation-name: blink2;
animation-duration: 8s; animation-duration: 8s;
animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
@ -203,12 +201,11 @@
@keyframes blink3 { @keyframes blink3 {
to { to {
background-color: @roninYellow; background-color: #ff9e3b;
} }
} }
#battery.warning:not(.charging) { #battery.warning:not(.charging) {
/* background-color: @sumiInk0; */
animation-name: blink3; animation-name: blink3;
animation-duration: 4s; animation-duration: 4s;
animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
@ -218,12 +215,11 @@
@keyframes blink4 { @keyframes blink4 {
to { to {
background-color: @samuraiRed; background-color: #e82424;
} }
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {
/* background-color: @sumiInk0; */
animation-name: blink4; animation-name: blink4;
animation-duration: 4s; animation-duration: 4s;
animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
@ -232,8 +228,8 @@
} }
#language { #language {
border-bottom: 2px solid @oniViolet; border-bottom: 2px solid #957fb8;
border-right: 2px solid @oniViolet; border-right: 2px solid #957fb8;
background: @sumiInk0; background: #16161d;
color: @fujiWhite; color: #dcd7ba;
} }