mirror of
https://github.com/Swarsel/.dotfiles.git
synced 2025-12-06 09:07:21 +01:00
refactor: move out style.css for waybar
This commit is contained in:
Swarsel
parent
9e88b8944b
commit
26f8576d6c
GPG key ID:
26A54C31F2A4FD84
2 changed files with 200 additions and 430 deletions
|
|
@ -6433,237 +6433,7 @@ The rest of this configuration is found here:
|
|||
};
|
||||
};
|
||||
};
|
||||
|
||||
style = ''
|
||||
@define-color foreground #fdf6e3;
|
||||
@define-color background #1a1a1a;
|
||||
@define-color background-alt #292b2e;
|
||||
@define-color foreground-warning #268bd2;
|
||||
@define-color background-warning @background;
|
||||
@define-color foreground-error red;
|
||||
@define-color background-error @background;
|
||||
@define-color foreground-critical gold;
|
||||
@define-color background-critical blue;
|
||||
|
||||
|
||||
,* {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
font-family: "FiraCode Nerd Font Propo", "Font Awesome 5 Free";
|
||||
font-size: 14px;
|
||||
min-height: 0;
|
||||
margin: -1px 0px;
|
||||
}
|
||||
|
||||
window#waybar {
|
||||
background: transparent;
|
||||
color: @foreground;
|
||||
transition-duration: .5s;
|
||||
}
|
||||
|
||||
window#waybar.hidden {
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
|
||||
#mpris {
|
||||
padding: 0 10px;
|
||||
background-color: transparent;
|
||||
color: #1DB954;
|
||||
font-family: Monospace;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
#custom-right-arrow-dark,
|
||||
#custom-left-arrow-dark {
|
||||
color: @background;
|
||||
background: @background-alt;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#window {
|
||||
font-size: 12px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
#mode {
|
||||
background: @background-critical;
|
||||
color: @foreground-critical;
|
||||
padding: 0 3px;
|
||||
}
|
||||
|
||||
#custom-configwarn {
|
||||
color: black;
|
||||
padding: 0 3px;
|
||||
animation-name: configblink;
|
||||
animation-duration: 0.5s;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
}
|
||||
|
||||
#custom-outer-right-arrow-dark,
|
||||
#custom-outer-left-arrow-dark {
|
||||
color: @background;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#custom-outer-left-arrow-dark,
|
||||
#custom-left-arrow-dark,
|
||||
#custom-left-arrow-light {
|
||||
margin: 0 -1px;
|
||||
}
|
||||
|
||||
#custom-right-arrow-light,
|
||||
#custom-left-arrow-light {
|
||||
color: @background-alt;
|
||||
background: @background;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#workspaces,
|
||||
#clock.1,
|
||||
#clock.2,
|
||||
#clock.3,
|
||||
#pulseaudio,
|
||||
#memory,
|
||||
#cpu,
|
||||
#temperature,
|
||||
#power-profiles-daemon,
|
||||
#mpris,
|
||||
#tray {
|
||||
background: @background;
|
||||
}
|
||||
|
||||
#network,
|
||||
#clock.2,
|
||||
#battery,
|
||||
#cpu,
|
||||
#custom-pseudobat,
|
||||
#disk {
|
||||
background: @background-alt;
|
||||
}
|
||||
|
||||
|
||||
#workspaces button {
|
||||
padding: 0 2px;
|
||||
color: #fdf6e3;
|
||||
}
|
||||
#workspaces button.focused {
|
||||
color: @foreground-warning;
|
||||
}
|
||||
|
||||
#workspaces button:hover {
|
||||
background: @foreground;
|
||||
color: @background;
|
||||
border: @foreground;
|
||||
padding: 0 2px;
|
||||
box-shadow: inherit;
|
||||
text-shadow: inherit;
|
||||
}
|
||||
|
||||
#workspaces button.urgent {
|
||||
color: @background-critical;
|
||||
background: @foreground-critical;
|
||||
}
|
||||
|
||||
#network {
|
||||
color: #cc99c9;
|
||||
}
|
||||
|
||||
#temperature,
|
||||
#power-profiles-daemon {
|
||||
color: #9ec1cf;
|
||||
}
|
||||
|
||||
#disk {
|
||||
/*color: #b58900;*/
|
||||
color: #9ee09e;
|
||||
}
|
||||
|
||||
#disk.warning {
|
||||
color: @foreground-error;
|
||||
background-color: @background-error;
|
||||
}
|
||||
#disk.critical,
|
||||
#temperature.critical {
|
||||
color: @foreground-critical;
|
||||
background-color: @background-critical;
|
||||
animation-name: blink;
|
||||
animation-duration: 0.5s;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
}
|
||||
#pulseaudio.muted {
|
||||
color: @foreground-error;
|
||||
}
|
||||
#memory {
|
||||
/*color: #2aa198;*/
|
||||
color: #fdfd97;
|
||||
}
|
||||
#cpu {
|
||||
/*color: #6c71c4;*/
|
||||
color: #feb144;
|
||||
}
|
||||
|
||||
#pulseaudio {
|
||||
/*color: #268bd2;*/
|
||||
color: #ff6663;
|
||||
}
|
||||
|
||||
#battery,
|
||||
#custom-pseudobat {
|
||||
color: cyan;
|
||||
}
|
||||
#battery.discharging {
|
||||
color: #859900;
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
to {
|
||||
color: @foreground-error;
|
||||
background-color: @background-error;
|
||||
}
|
||||
}
|
||||
@keyframes configblink {
|
||||
to {
|
||||
color: @foreground-error;
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
#battery.critical:not(.charging) {
|
||||
color: @foreground-critical;
|
||||
background-color: @background-critical;
|
||||
animation-name: blink;
|
||||
animation-duration: 0.5s;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
}
|
||||
|
||||
#clock.1,
|
||||
#clock.2,
|
||||
#clock.3 {
|
||||
font-family: Monospace;
|
||||
}
|
||||
|
||||
#clock,
|
||||
#pulseaudio,
|
||||
#memory,
|
||||
#cpu,
|
||||
#tray,
|
||||
#temperature,
|
||||
#power-profiles-daemon,
|
||||
#network,
|
||||
#mpris,
|
||||
#battery,
|
||||
#custom-pseudobat,
|
||||
#disk {
|
||||
padding: 0 3px;
|
||||
}
|
||||
'';
|
||||
style = (builtins.readFile ../../programs/waybar/style.css);
|
||||
};
|
||||
|
||||
#+end_src
|
||||
|
|
|
|||
|
|
@ -1,61 +1,61 @@
|
|||
@define-color foreground #fdf6e3;
|
||||
@define-color background #1a1a1a;
|
||||
@define-color background-alt #292b2e;
|
||||
@define-color foreground-warning #268bd2;
|
||||
@define-color background-warning @background;
|
||||
@define-color foreground-error red;
|
||||
@define-color background-error @background;
|
||||
@define-color foreground-critical gold;
|
||||
@define-color background-critical blue;
|
||||
@define-color foreground #fdf6e3;
|
||||
@define-color background #1a1a1a;
|
||||
@define-color background-alt #292b2e;
|
||||
@define-color foreground-warning #268bd2;
|
||||
@define-color background-warning @background;
|
||||
@define-color foreground-error red;
|
||||
@define-color background-error @background;
|
||||
@define-color foreground-critical gold;
|
||||
@define-color background-critical blue;
|
||||
|
||||
|
||||
,* {
|
||||
* {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
font-family: "FiraCode Nerd Font Propo", "Font Awesome 5 Free";
|
||||
font-size: 14px;
|
||||
min-height: 0;
|
||||
margin: -1px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
window#waybar {
|
||||
window#waybar {
|
||||
background: transparent;
|
||||
color: @foreground;
|
||||
transition-duration: .5s;
|
||||
}
|
||||
}
|
||||
|
||||
window#waybar.hidden {
|
||||
window#waybar.hidden {
|
||||
opacity: 0.2;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#mpris {
|
||||
#mpris {
|
||||
padding: 0 10px;
|
||||
background-color: transparent;
|
||||
color: #1DB954;
|
||||
font-family: Monospace;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
#custom-right-arrow-dark,
|
||||
#custom-left-arrow-dark {
|
||||
#custom-right-arrow-dark,
|
||||
#custom-left-arrow-dark {
|
||||
color: @background;
|
||||
background: @background-alt;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
#window {
|
||||
#window {
|
||||
font-size: 12px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
#mode {
|
||||
#mode {
|
||||
background: @background-critical;
|
||||
color: @foreground-critical;
|
||||
padding: 0 3px;
|
||||
}
|
||||
}
|
||||
|
||||
#custom-configwarn {
|
||||
#custom-configwarn {
|
||||
color: black;
|
||||
padding: 0 3px;
|
||||
animation-name: configblink;
|
||||
|
|
@ -63,93 +63,93 @@
|
|||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
}
|
||||
}
|
||||
|
||||
#custom-outer-right-arrow-dark,
|
||||
#custom-outer-left-arrow-dark {
|
||||
#custom-outer-right-arrow-dark,
|
||||
#custom-outer-left-arrow-dark {
|
||||
color: @background;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
#custom-outer-left-arrow-dark,
|
||||
#custom-left-arrow-dark,
|
||||
#custom-left-arrow-light {
|
||||
#custom-outer-left-arrow-dark,
|
||||
#custom-left-arrow-dark,
|
||||
#custom-left-arrow-light {
|
||||
margin: 0 -1px;
|
||||
}
|
||||
}
|
||||
|
||||
#custom-right-arrow-light,
|
||||
#custom-left-arrow-light {
|
||||
#custom-right-arrow-light,
|
||||
#custom-left-arrow-light {
|
||||
color: @background-alt;
|
||||
background: @background;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
#workspaces,
|
||||
#clock.1,
|
||||
#clock.2,
|
||||
#clock.3,
|
||||
#pulseaudio,
|
||||
#memory,
|
||||
#cpu,
|
||||
#temperature,
|
||||
#power-profiles-daemon,
|
||||
#mpris,
|
||||
#tray {
|
||||
#workspaces,
|
||||
#clock.1,
|
||||
#clock.2,
|
||||
#clock.3,
|
||||
#pulseaudio,
|
||||
#memory,
|
||||
#cpu,
|
||||
#temperature,
|
||||
#power-profiles-daemon,
|
||||
#mpris,
|
||||
#tray {
|
||||
background: @background;
|
||||
}
|
||||
}
|
||||
|
||||
#network,
|
||||
#clock.2,
|
||||
#battery,
|
||||
#cpu,
|
||||
#custom-pseudobat,
|
||||
#disk {
|
||||
#network,
|
||||
#clock.2,
|
||||
#battery,
|
||||
#cpu,
|
||||
#custom-pseudobat,
|
||||
#disk {
|
||||
background: @background-alt;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#workspaces button {
|
||||
#workspaces button {
|
||||
padding: 0 2px;
|
||||
color: #fdf6e3;
|
||||
}
|
||||
#workspaces button.focused {
|
||||
}
|
||||
#workspaces button.focused {
|
||||
color: @foreground-warning;
|
||||
}
|
||||
}
|
||||
|
||||
#workspaces button:hover {
|
||||
#workspaces button:hover {
|
||||
background: @foreground;
|
||||
color: @background;
|
||||
border: @foreground;
|
||||
padding: 0 2px;
|
||||
box-shadow: inherit;
|
||||
text-shadow: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
#workspaces button.urgent {
|
||||
#workspaces button.urgent {
|
||||
color: @background-critical;
|
||||
background: @foreground-critical;
|
||||
}
|
||||
}
|
||||
|
||||
#network {
|
||||
#network {
|
||||
color: #cc99c9;
|
||||
}
|
||||
}
|
||||
|
||||
#temperature,
|
||||
#power-profiles-daemon {
|
||||
#temperature,
|
||||
#power-profiles-daemon {
|
||||
color: #9ec1cf;
|
||||
}
|
||||
}
|
||||
|
||||
#disk {
|
||||
#disk {
|
||||
/*color: #b58900;*/
|
||||
color: #9ee09e;
|
||||
}
|
||||
}
|
||||
|
||||
#disk.warning {
|
||||
#disk.warning {
|
||||
color: @foreground-error;
|
||||
background-color: @background-error;
|
||||
}
|
||||
#disk.critical,
|
||||
#temperature.critical {
|
||||
}
|
||||
#disk.critical,
|
||||
#temperature.critical {
|
||||
color: @foreground-critical;
|
||||
background-color: @background-critical;
|
||||
animation-name: blink;
|
||||
|
|
@ -157,46 +157,46 @@
|
|||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
}
|
||||
#pulseaudio.muted {
|
||||
}
|
||||
#pulseaudio.muted {
|
||||
color: @foreground-error;
|
||||
}
|
||||
#memory {
|
||||
}
|
||||
#memory {
|
||||
/*color: #2aa198;*/
|
||||
color: #fdfd97;
|
||||
}
|
||||
#cpu {
|
||||
}
|
||||
#cpu {
|
||||
/*color: #6c71c4;*/
|
||||
color: #feb144;
|
||||
}
|
||||
}
|
||||
|
||||
#pulseaudio {
|
||||
#pulseaudio {
|
||||
/*color: #268bd2;*/
|
||||
color: #ff6663;
|
||||
}
|
||||
}
|
||||
|
||||
#battery,
|
||||
#custom-pseudobat {
|
||||
#battery,
|
||||
#custom-pseudobat {
|
||||
color: cyan;
|
||||
}
|
||||
#battery.discharging {
|
||||
}
|
||||
#battery.discharging {
|
||||
color: #859900;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
@keyframes blink {
|
||||
to {
|
||||
color: @foreground-error;
|
||||
background-color: @background-error;
|
||||
}
|
||||
}
|
||||
@keyframes configblink {
|
||||
}
|
||||
@keyframes configblink {
|
||||
to {
|
||||
color: @foreground-error;
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#battery.critical:not(.charging) {
|
||||
#battery.critical:not(.charging) {
|
||||
color: @foreground-critical;
|
||||
background-color: @background-critical;
|
||||
animation-name: blink;
|
||||
|
|
@ -204,25 +204,25 @@
|
|||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
}
|
||||
}
|
||||
|
||||
#clock.1,
|
||||
#clock.2,
|
||||
#clock.3 {
|
||||
#clock.1,
|
||||
#clock.2,
|
||||
#clock.3 {
|
||||
font-family: Monospace;
|
||||
}
|
||||
}
|
||||
|
||||
#clock,
|
||||
#pulseaudio,
|
||||
#memory,
|
||||
#cpu,
|
||||
#tray,
|
||||
#temperature,
|
||||
#power-profiles-daemon,
|
||||
#network,
|
||||
#mpris,
|
||||
#battery,
|
||||
#custom-pseudobat,
|
||||
#disk {
|
||||
#clock,
|
||||
#pulseaudio,
|
||||
#memory,
|
||||
#cpu,
|
||||
#tray,
|
||||
#temperature,
|
||||
#power-profiles-daemon,
|
||||
#network,
|
||||
#mpris,
|
||||
#battery,
|
||||
#custom-pseudobat,
|
||||
#disk {
|
||||
padding: 0 3px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue