finner/dotfiles
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

redid waybar in new style in tokyonight colors, updated sway and rofi configs with tokyonight colors too

Browse source
This commit is contained in:
Mike G 2024-09-23 19:54:59 -04:00
parent 664f0b6e1a
commit c9ab46a674
4 changed files with 273 additions and 256 deletions
Download patch file Download diff file Expand all files Collapse all files

233
.config/waybar/style.css
View file

@ -5,12 +5,32 @@ use as `@variable_name`
shade, mix, and alpha modifiers are available
*/
@define-color primary_bg_color #041e23;
@define-color primary_fg_color #ecf0c1;
@define-color accent_color_1 #06afc7; /* used for tooltip border and active states */
@define-color accent_color_2 #5cab96; /* used for battery charging background */
@define-color accent_color_3 #e3cd7b; /* used for battery low background */
@define-color accent_color_4 #684c31; /* used for batter low foreground */
@define-color foreground #c8d3f5;
@define-color background #222436;
@define-color selection-foreground #c8d3f5;
@define-color selection-background #2d3f76;
@define-color urls #4fd6be;
@define-color regular0 #1b1d2b;
@define-color regular1 #ff757f;
@define-color regular2 #c3e88d;
@define-color regular3 #ffc777;
@define-color regular4 #82aaff;
@define-color regular5 #c099ff;
@define-color regular6 #86e1fc;
@define-color regular7 #828bb8;
@define-color bright0 #444a73;
@define-color bright1 #ff757f;
@define-color bright2 #c3e88d;
@define-color bright3 #ffc777;
@define-color bright4 #82aaff;
@define-color bright5 #c099ff;
@define-color bright6 #86e1fc;
@define-color bright7 #c8d3f5;
@define-color 16 #ff966c;
@define-color 17 #c53b53;
* {
border: none;
@ -21,140 +41,111 @@ shade, mix, and alpha modifiers are available
}
window#waybar {
background-color: @primary_bg_color;
color: @primary_fg_color;
border-bottom: 1px solid @primary_fg_color;
background-color: transparent;
color: @foreground;
margin: 5px;
}
tooltip {
border-radius: 15px;
background-color: @bright0;
color: @bright7;
border: 1px solid @selection-foreground;
}
#custom-logo {
padding: 0 10px;
}
.modules-right {
border-radius: 15px 0 0 15px;
background: @selection-background;
}
.modules-center {
border-radius: 15px;
background: @selection-background;
}
.modules-left {
border-radius: 0 15px 15px 0;
background: @selection-background;
}
#workspaces,
#window,
#custom-logo,
#disk,
#memory,
#cpu,
#temperature,
#clock,
#tray,
#custom-notification,
#custom-updates,
#backlight,
#bluetooth,
#pulseaudio,
#network,
#idle_inhibitor,
#battery {
padding: 0 15px;
border-radius: 15px;
}
#custom-logo {
color: @urls;
}
#clock {
background-color: @foreground;
color: @background;
}
#window {
padding: 0 10px;
background-color: @foreground;
color: @background;
}
tooltip
{
background: rgba(4, 30, 35, 0.85);
border: 2px solid @accent_color_1;
border-radius: 10px;
#workspaces button:hover {
color: @urls;
background: none;
border: none;
}
tooltip label
{
color: white;
#workspaces button.visible {
color: @16;
}
#workspaces button
{
padding: 0 5px;
background: transparent;
color: @primary_fg_color;
#temperature.critical,
#pulseaudio.muted,
#idle_inhibitor.activated,
#workspaces button.urgent {
color: @17;
}
#workspaces button.focused
{
border-bottom: 3px solid @primary_fg_color;
#battery {
background-color: @foreground;
color: @background;
border-radius: 15px 0 0 15px;
}
#custom-bg
{
padding: 0 10px;
border-right: 1px solid @primary_fg_color;
#battery.charging {
background-color: @urls;
}
#custom-pacman
{
padding: 0 10px;
border-right: 1px solid @primary_fg_color;
#battery.warning:not(.charging) {
background-color: @16;
}
#scratchpad
{
color: @primary_bg_color;
background-color: @primary_fg_color;
padding: 0 10px;
#battery.critical:not(.charging) {
background-color: @17;
}
#custom-notification
{
padding: 0 10px;
border-right: 1px solid @primary_fg_color;
#tray {
background-color: @foreground;
}
#mode, #clock, #battery
{
padding: 0px 10px;
}
#pulseaudio
{
padding: 0 10px;
border-right: 1px solid @primary_fg_color;
}
#battery
{
background-color: @primary_fg_color;
color: @primary_bg_color;
font-weight: bold;
}
#battery.charging
{
background-color: @accent_color_2;
color: @primary_fg_color;
}
#battery.warning:not(.charging)
{
background-color: @accent_color_3;
color: @accent_color_4;
}
#idle_inhibitor
{
padding: 0 10px;
}
#network
{
padding: 0 10px;
border-right: 1px solid @primary_fg_color;
}
#idle_inhibitor.activated
{
color: @accent_color_1;
}
#backlight
{
padding: 0 10px;
border-right: 1px solid @primary_fg_color;
}
@keyframes blink-update
{
to
{
background-color: dodgerblue;
}
}
#custom-pacman
{
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate;
}
#custom-pacman.pending-updates
{
animation-name: blink-update;
animation-duration: 3s;
}
#tray
{
padding: 0 10px;
background-color: @primary_fg_color;
margin: 0 5px;
#custom-updates.has-updates {
color: @16;
}