jonny
/
Hyprland-Dots
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Tweaked waybar styles

pull/31/head
JaKooLit 2 years ago
parent
5133e22184
commit
9c3c8eb04d
16 changed files with 725 additions and 259 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 42
      config/waybar/style/Black & White.css
  2. 48
      config/waybar/style/Catppuccin-Latte.css
  3. 44
      config/waybar/style/Catppuccin-Mocha.css
  4. 40
      config/waybar/style/Colored (Bordered).css
  5. 47
      config/waybar/style/Colored (Lined).css
  6. 51
      config/waybar/style/Colored.css
  7. 43
      config/waybar/style/Colorful.css
  8. 36
      config/waybar/style/Crimson.css
  9. 34
      config/waybar/style/Dark.css
  10. 38
      config/waybar/style/Golden Noir.css
  11. 34
      config/waybar/style/Light.css
  12. 34
      config/waybar/style/Purpl.css
  13. 36
      config/waybar/style/Pywal.css
  14. 2
      config/waybar/style/Rose-Pine.css
  15. 46
      config/waybar/style/Simple Pink.css
  16. 45
      config/waybar/style/Transparent.css

42
config/waybar/style/Black & White.css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Black and White */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -8,8 +9,8 @@ min-height: 0;
font-size: 98%; font-size: 98%;
font-feature-settings: '"zero", "ss01", "ss02", "ss03", "ss04", "ss05", "cv31"'; font-feature-settings: '"zero", "ss01", "ss02", "ss03", "ss04", "ss05", "cv31"';
padding: 1px; padding: 1px;
margin-top: 1px; margin-left: 4px;
margin-bottom: 1px; margin-right: 4px;
} }
window#waybar { window#waybar {
@ -79,12 +80,25 @@ tooltip label{
} }
/*-----modules indv----*/ /*-----modules indv----*/
#workspaces button { #workspaces button {
padding: 0px 0px;
background-color: transparent; background-color: transparent;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button:hover { #workspaces button:hover {
box-shadow: inherit; color: grey;
background-color: rgba(0,153,153,0); background-color: rgba(0,153,153,0);
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -93,7 +107,12 @@ tooltip label{
#workspaces button.active { #workspaces button.active {
color: white; color: white;
background-color: rgba(191, 191, 191,0.1); background-color: rgba(191, 191, 191,0.1);
/*box-shadow:inherit;*/ margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#backlight, #backlight,
@ -184,6 +203,19 @@ tooltip label{
#taskbar button.active { #taskbar button.active {
background-color: #7f849c; background-color: #7f849c;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#waybar.empty, #waybar.tiled, #waybar.floating { #waybar.empty, #waybar.tiled, #waybar.floating {
background-color: transparent; background-color: transparent;

48
config/waybar/style/Catppuccin-Latte.css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Catppuccin Latte */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -8,8 +9,8 @@ min-height: 0;
font-size: 98%; font-size: 98%;
font-feature-settings: '"zero", "ss01", "ss02", "ss03", "ss04", "ss05", "cv31"'; font-feature-settings: '"zero", "ss01", "ss02", "ss03", "ss04", "ss05", "cv31"';
padding: 1px; padding: 1px;
margin-top: 1px; margin-left: 4px;
margin-bottom: 1px; margin-right: 4px;
} }
@import "../waybar/style/catppuccin-themes/latte.css"; @import "../waybar/style/catppuccin-themes/latte.css";
@ -157,15 +158,26 @@ window#waybar.hidden {
} }
#workspaces button { #workspaces button {
border-radius: 5px; box-shadow: none;
/*margin: 3px;*/ text-shadow: none;
/*padding: 1px;*/ padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button:hover { #workspaces button:hover {
border-radius: 5px; border-radius: 8px;
color: @overlay0; color: @overlay0;
background-color: @surface0; background-color: @surface0;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.persistent { #workspaces button.persistent {
@ -175,7 +187,13 @@ window#waybar.hidden {
#workspaces button.active { #workspaces button.active {
color: @peach; color: @peach;
border-radius: 0px; border-radius: 8px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.urgent { #workspaces button.urgent {
@ -183,6 +201,22 @@ window#waybar.hidden {
border-radius: 0px; border-radius: 0px;
} }
#taskbar button.active {
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#custom-menu { #custom-menu {
color: @rosewater; color: @rosewater;
} }

44
config/waybar/style/Catppuccin-Mocha.css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Catppuccin Latte */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -155,15 +156,26 @@ window#waybar.hidden {
} }
#workspaces button { #workspaces button {
border-radius: 5px; box-shadow: none;
/*margin: 3px;*/ text-shadow: none;
/*padding: 1px;*/ padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button:hover { #workspaces button:hover {
border-radius: 5px; border-radius: 8px;
color: @overlay0; color: @overlay0;
background-color: @surface0; background-color: @surface0;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.persistent { #workspaces button.persistent {
@ -173,7 +185,13 @@ window#waybar.hidden {
#workspaces button.active { #workspaces button.active {
color: @peach; color: @peach;
border-radius: 0px; border-radius: 8px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.urgent { #workspaces button.urgent {
@ -181,6 +199,22 @@ window#waybar.hidden {
border-radius: 0px; border-radius: 0px;
} }
#taskbar button.active {
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#custom-menu { #custom-menu {
color: @rosewater; color: @rosewater;
} }

40
config/waybar/style/Colored (Bordered).css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Colored - Bordered */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -51,14 +52,18 @@ tooltip label{
color: #cdd6f4; color: #cdd6f4;
} }
#workspaces button { #workspaces button {
padding: 0 0px;
color: #7984a4; color: #7984a4;
background-color: transparent; background-color: transparent;
/* Use box-shadow instead of border so the text isn't offset */ box-shadow: none;
box-shadow: inset 0 -3px transparent; text-shadow: none;
/* Avoid rounded borders under each workspace name */ padding: 0px;
border: none; border-radius: 9px;
border-radius: 0; margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -66,9 +71,19 @@ tooltip label{
} }
#workspace button.hover { #workspace button.hover {
background-color: transparent; background-color: transparent;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: white; color: white;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.urgent { #workspaces button.urgent {
@ -326,4 +341,17 @@ label:focus {
#taskbar button.active { #taskbar button.active {
background-color: #7f849c; background-color: #7f849c;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }

47
config/waybar/style/Colored (Lined).css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Colored Line */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -8,8 +9,8 @@ min-height: 0;
font-size: 98%; font-size: 98%;
font-feature-settings: '"zero", "ss01", "ss02", "ss03", "ss04", "ss05", "cv31"'; font-feature-settings: '"zero", "ss01", "ss02", "ss03", "ss04", "ss05", "cv31"';
padding: 1px; padding: 1px;
margin-top: 1px; margin-left: 4px;
margin-bottom: 1px; margin-right: 4px;
} }
window#waybar { window#waybar {
@ -18,16 +19,37 @@ window#waybar {
} }
#workspaces button { #workspaces button {
/*padding: 2px 0px;*/
border-bottom: 1px;
color: #eceff4; color: #eceff4;
border-color: #d8dee9; border-color: #d8dee9;
border-style: solid; border-style: solid;
margin-top:2px; margin-top:2px;
margin-bottom: 3px;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
border-color: #81a1c1; border-color: #81a1c1;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#workspaces button:hover {
background-color: rgba(0,153,153,0);
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#backlight, #backlight,
@ -176,4 +198,21 @@ window#waybar {
color:#d08770; color:#d08770;
} }
#taskbar button.active {
background-color: #7f849c;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}

51
config/waybar/style/Colored.css
Unescape View File

@ -13,6 +13,7 @@
@define-color accent6 #0db9d7; @define-color accent6 #0db9d7;
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* colored */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -66,31 +67,37 @@ tooltip label{
} }
#workspaces button { #workspaces button {
padding: 0 0 0 0;
margin: 0 0 0 0;
background-color: transparent; background-color: transparent;
color: #ffffff; color: #ffffff;
/*min-width: 36px;*/ box-shadow: none;
/* Use box-shadow instead of border so the text isn't offset */ text-shadow: none;
/* box-shadow: inset 0 -3px transparent;*/ padding: 0px;
/* border-radius: 0px; */ border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
padding: 0 0 0 0;
margin: 0 0 0 0;
background-color: transparent; background-color: transparent;
color: #D3D3D3; color: #D3D3D3;
/*min-width: 36px;*/ margin-left: 3px;
/* Use box-shadow instead of border so the text isn't offset */ padding-left: 12px;
/* box-shadow: inset 0 -3px transparent;*/ padding-right: 12px;
/* border-radius: 0px; */ margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
/* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */
#workspaces button:hover { #workspaces button:hover {
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
/* box-shadow: inset 0 -3px #ffffff; */ padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -152,9 +159,6 @@ tooltip label{
#custom-weather.snowyIcyNight, #custom-weather.snowyIcyNight,
#custom-weather.sunnyDay { #custom-weather.sunnyDay {
padding: 0px 10px; padding: 0px 10px;
/*margin: 4px 3px 5px 3px;*/
/*color: @fgcolor;*/
/* background-color: #bbccdd; */
background-color:transparent; background-color:transparent;
} }
@ -308,6 +312,19 @@ label:focus {
#taskbar button.active { #taskbar button.active {
background-color: #7f849c; background-color: #7f849c;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#mpd { #mpd {

43
config/waybar/style/Colorful.css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Colorful */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -162,14 +163,36 @@ tooltip label{
} }
#workspaces button { #workspaces button {
border-radius: 8px;
background-color: #d9e0ee; background-color: #d9e0ee;
color: #3A3B3C; color: #3A3B3C;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
background-color: #eba0ac; background-color: #eba0ac;
color: #3A3B3C; color: #3A3B3C;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#workspaces button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#taskbar button { #taskbar button {
@ -181,7 +204,21 @@ tooltip label{
#taskbar button.active { #taskbar button.active {
background-color: #b4befe; background-color: #b4befe;
color: #3A3B3C; color: #3A3B3C;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#custom-menu { #custom-menu {
background-color: #f5c2e7; background-color: #f5c2e7;
/*padding: 1px;*/ /*padding: 1px;*/
@ -224,6 +261,10 @@ tooltip label{
background-color: #86b4fa; background-color: #86b4fa;
} }
#temperature.critical {
background-color: red;
}
#custom-power_vertical, #custom-power_vertical,
#custom-light_dark, #custom-light_dark,
#idle_inhibitor { #idle_inhibitor {

36
config/waybar/style/Crimson.css
Unescape View File

@ -61,13 +61,29 @@ tooltip {
#workspaces button { #workspaces button {
color: wheat; color: wheat;
padding: 5px; box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: rgb(108, 18, 18); color: rgb(108, 18, 18);
background-color: #000000; background-color: #000000;
border: 1px solid grey; border: 1px solid grey;
border-radius: 15px 15px 15px 15px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -82,6 +98,11 @@ tooltip {
#workspaces button:hover { #workspaces button:hover {
color: rgb(71, 14, 14); color: rgb(71, 14, 14);
background-color: #000000; background-color: #000000;
border-radius: 15px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
@ -146,6 +167,19 @@ tooltip {
#taskbar button.active { #taskbar button.active {
background-color: rgb(128, 31, 31); background-color: rgb(128, 31, 31);
border: 1px solid grey; border: 1px solid grey;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#workspaces button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

34
config/waybar/style/Dark.css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Dark */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -69,11 +70,27 @@ tooltip label {
#workspaces button { #workspaces button {
color: #6E6A86; color: #6E6A86;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: #cba6f7; color: #cba6f7;
border-radius: 15px 15px 15px 15px; border-radius: 15px 15px 15px 15px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -88,6 +105,10 @@ tooltip label {
#workspaces button:hover { #workspaces button:hover {
color: #9CCFD8; color: #9CCFD8;
border-radius: 15px; border-radius: 15px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#backlight, #backlight,
@ -150,6 +171,19 @@ tooltip label {
#taskbar button.active { #taskbar button.active {
background-color: #7f849c; background-color: #7f849c;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

38
config/waybar/style/Golden Noir.css
Unescape View File

@ -46,7 +46,7 @@ tooltip {
border-width: 2px; border-width: 2px;
border-style: solid; border-style: solid;
border-color: #11111b; border-color: #11111b;
color: #cba6f7; color: #ffd700;
} }
/*-----module groups----*/ /*-----module groups----*/
@ -71,15 +71,30 @@ tooltip {
} }
#workspaces button { #workspaces button {
padding: 2px;
color: #6E6A86; color: #6E6A86;
margin-right: 5px; box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: #ffd700; color: #ffd700;
border-radius: 50%; border-radius: 50%;
background-color: black; background-color: black;
border-radius: 15px 15px 15px 15px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -94,6 +109,10 @@ tooltip {
#workspaces button:hover { #workspaces button:hover {
color: #ffd700; color: #ffd700;
border-radius: 15px; border-radius: 15px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#clock#2 { #clock#2 {
@ -159,6 +178,19 @@ tooltip {
#taskbar button.active { #taskbar button.active {
background-color: rgb(47, 46, 46); background-color: rgb(47, 46, 46);
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

34
config/waybar/style/Light.css
Unescape View File

@ -1,4 +1,5 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Light */
* { * {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
@ -69,11 +70,27 @@ tooltip label {
#workspaces button { #workspaces button {
color: #585b70; color: #585b70;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: #000000; color: #000000;
border-radius: 15px 15px 15px 15px; border-radius: 15px 15px 15px 15px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -88,6 +105,10 @@ tooltip label {
#workspaces button:hover { #workspaces button:hover {
color: #000000; color: #000000;
border-radius: 15px; border-radius: 15px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#backlight, #backlight,
@ -151,6 +172,19 @@ tooltip label {
#taskbar button.active { #taskbar button.active {
background-color: #585b70; background-color: #585b70;
color: #cdd6f4; color: #cdd6f4;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

34
config/waybar/style/Purpl.css
Unescape View File

@ -74,15 +74,30 @@ tooltip {
} }
#workspaces button { #workspaces button {
padding: 2px;
color: #6E6A86; color: #6E6A86;
margin-right: 5px; margin-right: 5px;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: #cba6f7; color: #cba6f7;
border-radius: 50%; border-radius: 50%;
background-color: black; background-color: black;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -97,6 +112,10 @@ tooltip {
#workspaces button:hover { #workspaces button:hover {
color: #9CCFD8; color: #9CCFD8;
border-radius: 15px; border-radius: 15px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#backlight, #backlight,
@ -158,6 +177,19 @@ tooltip {
#taskbar button.active { #taskbar button.active {
background-color: purple; background-color: purple;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

36
config/waybar/style/Pywal.css
Unescape View File

@ -1,8 +1,5 @@
/* ----------- 💫 https://github.com/JaKooLit 💫 -------- */ /* ----------- 💫 https://github.com/JaKooLit 💫 -------- */
/* ...........................................*/ /* pywal */
/* ...............Golden Noir................ */
/* .......................................... */
/* --- 👍 designed by https://github.com/Krautt 👍 --- */
@import '../../.cache/wal/colors-waybar.css'; @import '../../.cache/wal/colors-waybar.css';
@ -74,17 +71,26 @@ tooltip {
} }
#workspaces button { #workspaces button {
padding: 2px;
color: @foreground; color: @foreground;
margin-right: 5px; box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite; animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682); transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: @foreground; color: @foreground;
border-radius: 40%;
background-color: @color0; background-color: @color0;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite; animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682); transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
@ -100,7 +106,8 @@ tooltip {
#workspaces button:hover { #workspaces button:hover {
color: @color4; color: @color4;
border-radius: 15px; padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite; animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682); transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
@ -168,6 +175,19 @@ tooltip {
#taskbar button.active { #taskbar button.active {
background-color: rgb(47, 46, 46); background-color: rgb(47, 46, 46);
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

2
config/waybar/style/Rose-Pine.css
Unescape View File

@ -1,4 +1,6 @@
/* ---- 💫 https://github.com/JaKooLit 💫 ---- */ /* ---- 💫 https://github.com/JaKooLit 💫 ---- */
/* Rose Pine */
@define-color bar-bg rgba(0, 0, 0, 0); @define-color bar-bg rgba(0, 0, 0, 0);
@define-color main-bg #26233a; @define-color main-bg #26233a;

46
config/waybar/style/Simple Pink.css
Unescape View File

@ -44,7 +44,7 @@ tooltip {
border-width: 2px; border-width: 2px;
border-style: solid; border-style: solid;
border-color: #11111b; border-color: #11111b;
color: #cba6f7; color: pink;
} }
/*-----module groups----*/ /*-----module groups----*/
@ -71,11 +71,27 @@ tooltip {
#workspaces button { #workspaces button {
color: pink; color: pink;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: whitesmoke; color: whitesmoke;
border-radius: 15px 15px 15px 15px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
@ -91,16 +107,14 @@ tooltip {
#workspaces button:hover { #workspaces button:hover {
color: #ba5663; color: #ba5663;
background-color: #0d0a0d; background-color: #0d0a0d;
border-radius: 15px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#taskbar button:hover {
color: #ba5663;
background-color: #0d0a0d;
}
#backlight, #backlight,
#battery, #battery,
#bluetooth, #bluetooth,
@ -162,7 +176,21 @@ tooltip {
#taskbar button.active { #taskbar button.active {
background-color: pink; background-color: pink;
border: 1px solid #22252a; border: 1px solid #22252a;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button:hover {
color: #ba5663;
background-color: #0d0a0d;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

45
config/waybar/style/Transparent.css
Unescape View File

@ -31,11 +31,9 @@
padding: 0px; padding: 0px;
margin: 0px; margin: 0px;
border: 0px; border: 0px;
/* background-color: rgba(66,66,66,0.5); */ /* transparent */
background-color: transparent; background-color: transparent;
} }
tooltip { tooltip {
background: #1e1e2e; background: #1e1e2e;
border-radius: 10px; border-radius: 10px;
@ -44,6 +42,7 @@
border-color: #11111b; border-color: #11111b;
color: #cba6f7; color: #cba6f7;
} }
/*-----module groups----*/ /*-----module groups----*/
.modules-right { .modules-right {
@ -51,24 +50,36 @@
.modules-center { .modules-center {
} }
.modules-left { .modules-left {
} }
#workspaces button { #workspaces button {
padding: 2px;
color: #6E6A86; color: #6E6A86;
margin-right: 5px; margin-right: 5px;
box-shadow: none;
text-shadow: none;
padding: 0px;
border-radius: 9px;
margin-top: 3px;
margin-bottom: 3px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.active { #workspaces button.active {
color: whitesmoke; color: whitesmoke;
border-radius: 15px 15px 15px 15px;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#workspaces button.focused { #workspaces button.focused {
@ -82,11 +93,13 @@
#workspaces button:hover { #workspaces button:hover {
color: whitesmoke; color: whitesmoke;
border-radius: 15px;
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#backlight, #backlight,
#battery, #battery,
#bluetooth, #bluetooth,
@ -144,9 +157,21 @@
color: #000000; color: #000000;
} }
} }
#taskbar button:hover {
padding-left: 3px;
padding-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
#taskbar button.active { #taskbar button.active {
background-color: #7f849c; background-color: #7f849c;
margin-left: 3px;
padding-left: 12px;
padding-right: 12px;
margin-right: 3px;
animation: gradient_f 20s ease-in infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
} }
#battery.critical:not(.charging) { #battery.critical:not(.charging) {

Write Preview
Loading…
Cancel
Save