matt1432/nixos-configs
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: add hover animations to eww modules in waybar

Browse source
This commit is contained in:
matt1432 2023-06-08 04:59:45 -04:00
parent 10efa92b8e
commit 4bbdc1e507
7 changed files with 34 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
eww/actions/actions.yuck
View file

@ -201,6 +201,7 @@
(defwindow actions-reveal
:monitor "0"
:stacking "overlay"
:geometry (geometry :x "10px"
:y "4px"
:width "320px" ; this isn't respected btw, so it's auto-adjusted by eww lol.

2
eww/closer/closer.yuck
View file

@ -4,6 +4,6 @@
(defwindow closer
:monitor 0
:geometry (geometry :width "100%" :height "100%")
:stacking "fg"
:stacking "overlay"
:focusable false
(closer :window ""))

1
eww/date/date.yuck
View file

@ -50,6 +50,7 @@
(defwindow date-reveal
:monitor 0
:stacking "overlay"
:geometry (geometry :x "70px"
:y "4px"
:width "0px" ; automatically generated

2
eww/powermenu/powermenu.yuck
View file

@ -40,7 +40,7 @@
(defwindow powermenu-reveal
:monitor 0
:stacking "fg"
:stacking "overlay"
:geometry (geometry :x "0px"
:y "0px"
:width "500px"

36
eww/traybuttons/traybuttons.scss
View file

@ -1,11 +1,14 @@
/*.tablet-toggle {
background-color: $bg;
color: $fg;
font-family: Product Sans;
border-radius: 30px;
border: 5px solid $contrastbg;
padding: 10px 18px;
}*/
.notif-panel {
/* min-width: 110px;
min-height: 34px; */
font-size: 20px;
padding: 2px 25px 2px 35px;
}
.tablet-toggle {
font-size: 26px;
padding: 2px 10px 2px 16px;
}
.toggle-off {
background-color: $bg;
@ -13,26 +16,19 @@
color: #CBA6F7;
border-radius: 80px;
border: 3px solid $contrastbg;
padding: 0px 6px 0px 12px;
/* Add any other styles for the "off" state */
}
.toggle-off:hover {
background-color: rgba(127, 132, 156, 0.2);
transition: background-color 0.5s ease-in-out;
}
.toggle-on {
background-color: $bg;
transition: border-color 0.5s ease-in-out;
color: #CBA6F7;
border-radius: 80px;
border: 3px solid #CBA6F7;
padding: 0px 6px 0px 12px;
/* Add any other styles for the "on" state */
}
.notif-panel {
min-width: 110px;
min-height: 38px;
font-size: 20px;
}
.tablet-toggle {
font-size: 26px;
}

21
eww/traybuttons/traybuttons.yuck
View file

@ -1,13 +1,13 @@
(defvar toggle-state false)
(defwidget tablet-toggle []
(button :class "tablet-toggle"
:onclick {toggle-state ? "$HOME/.config/hypr/scripts/tablet/laptop-mode.sh &" :
"$HOME/.config/hypr/scripts/tablet/tablet-mode.sh &"}
(box :class {toggle-state ? "toggle-on" : "toggle-off"}
:space-evenly true
:spacing 6
:orientation "h"
(eventbox :class {toggle-state ? "toggle-on" : "toggle-off"}
:onclick {toggle-state ? "$HOME/.config/hypr/scripts/tablet/laptop-mode.sh &" :
"$HOME/.config/hypr/scripts/tablet/tablet-mode.sh &"}
(box :class "tablet-toggle"
:space-evenly true
:spacing 6
:orientation "h"
(label :text " 󰦧 ")
)
)
@ -15,6 +15,7 @@
(defwindow tablet-toggle
:monitor 0
:stacking "overlay"
:exclusive "ignore"
:geometry (geometry :x "78px"
:y "8px"
@ -28,10 +29,10 @@
(defvar notif-panel-state false)
(defwidget notif-panel []
(button :class "notif-panel"
(button :class {notif-panel-state ? "toggle-on" : "toggle-off"}
:onclick {notif-panel-state ? "swaync-client -cp; eww update notif-panel-state=false" :
"swaync-client -op; eww update notif-panel-state=true"}
(box :class {notif-panel-state ? "toggle-on" : "toggle-off"}
(box :class "notif-panel"
:space-evenly true
:spacing 6
:orientation "h"
@ -45,7 +46,7 @@
:stacking "overlay"
:exclusive "ignore"
:geometry (geometry :x "60px"
:y "9px"
:y "10px"
:width "0px"
:height "0px"
:anchor "top right"

5
waybar/style.css
View file

@ -126,6 +126,7 @@
border: 6px solid rgba(0, 0, 0, 0);
border-radius: 80px;
background-clip: padding-box;
color: rgba(0, 0, 0, 0);
}
#custom-quicksettings {
@ -136,6 +137,6 @@
#custom-notif {
min-width: 110px;
color: #CBA6F7;
font-size: 26px;
color: rgba(0, 0, 0, 0);
font-size: 20px;
}