Improve ewwbar

This commit is contained in:
2024-05-08 23:51:44 +02:00
parent 1b11595fb3
commit 3ceaf2c0ca
2 changed files with 91 additions and 35 deletions

View File

@ -1,9 +1,9 @@
//$text: wheat;
$text: #f6daa8;
$highlight1: #4e8172;
$highlight2: #679a8b;
$background: #1d2021;
$background: #23231b;
$lowlight1: black;
$lowlight2: #1d1f21;
*{
all: unset;
@ -20,21 +20,19 @@ window {
font-size: 18px;
font-weight: 300;
border: solid $highlight1 1px;
background: black;
background: $lowlight1;
border-radius: 30px;
padding-top: 3px;
padding-bottom: 5px;
margin: 8px;
margin-top: 3px;
margin-bottom: 3px;
box-shadow: 0 0px 5px 1px #06060b;
box-shadow: 0 0px 5px 1px #06060b;
transition: all 1s;
}
.workspace.active {
font-weight: 600;
background: $text;
color: black;
border: solid $highlight2 2px;
}
.workspaces {
@ -47,21 +45,29 @@ window {
border-top: solid $highlight1 1px;
border-bottom: dotted $highlight1 6px;
color: $highlight1;
background: black;
background: $lowlight1;
border-radius: 30px;
padding-top: 0.5em;
padding-bottom: 0.3em;
box-shadow: 0 0px 5px 1px #06060b;
margin-top: 20px;
}
scale trough {
all: unset;
background-color: #22242b;
box-shadow: 0 0px 5px 1px #06060b;
border-radius: 16px;
min-width: 16px;
min-height: 70px;
margin: 0px 0px 0px 0px;
all: unset;
background-color: #22242b;
box-shadow: 0 0px 5px 1px #06060b;
border-radius: 16px;
min-width: 16px;
min-height: 70px;
margin: 0px 0px 0px 0px;
}
.volbox {
transition: all 0.5s;
}
.volbox.active {
background-color: $lowlight2;
}
.volume {
@ -69,8 +75,8 @@ scale trough {
}
.volume trough highlight {
background-image: linear-gradient(to right, $highlight2 30%, $highlight1 50%, $highlight1 100% *50);
border-radius: 10px;
background-image: linear-gradient(to right, $highlight2 30%, $highlight1 50%, $highlight1 100% *50);
border-radius: 10px;
}
.battery {
@ -84,8 +90,7 @@ scale trough {
border-color: green;
margin: 2px;
margin-top: 20px;
transition: border-color 1s;
transition: all 1s;
transition: all 0.2s;
}
.vpn label {
@ -94,7 +99,11 @@ scale trough {
}
.vpn:hover {
border-top: dotted 6px;
background-color: $lowlight2;
}
.vpn:active {
background-color: $highlight1;
}
.vpn.connecting {
@ -105,6 +114,10 @@ scale trough {
border-color: red;
}
.calendar {
background: $lowlight2;
}
.clock {
font-size: 30px;
font-weight: 400;