refactor: eww design token

This commit is contained in:
hesam-init 2024-07-02 09:33:22 +03:30
parent b8d0c9e719
commit f3830fc2db
9 changed files with 47 additions and 32 deletions

View file

@ -8,12 +8,12 @@
}
.separator {
padding: 6px;
padding: 4px 6px;
.dot {
padding: 2px;
padding: 3px;
border-radius: 100;
border-radius: 100%;
background-color: $white;
}

View file

@ -1,5 +1,9 @@
@import "tokens";
.animation {
transition: all 600ms cubic-bezier(0.075, 0.82, 0.165, 1);
}
.widget {
padding: get-token(padding, small);
margin: get-token(margin, small);

View file

@ -17,7 +17,7 @@ $design-tokens: (
border-radius: (
small: 6px,
default: 8px,
large: 12px,
large: 16px,
),
);

View file

@ -21,4 +21,4 @@
:exclusive true
:wm-ignore false
(VerticalBar))
(VerticalBar))

View file

@ -26,22 +26,32 @@
(box :class "reveal-on-hover" (children :nth 0))))
))
(defwidget RevealOnClick [var varname ?class ?duration ?transition ?direction]
(defwidget RevealOnClick [var varname direction ?class ?duration ?transition]
(box
:orientation "v"
:class "widget"
:space-evenly false
(eventbox
:cursor "pointer"
:visible {direction == "up"}
:onclick `${EWW_CMD} update ${varname}=${!var}`
(label :angle {direction == "up" ? (var ? 270 : 90) : (var ? 90 : 270)} :class "reveal-on-click" :tooltip "touch control" :text ""))
(revealer
:reveal var
:transition "slideup"
:transition {direction == "up" ? "slideup" : "slidedown"}
:duration animation-duration-fast
(box (children :nth 0)))
(box :style "padding: 6px 0px" (children :nth 0)))
(eventbox
:cursor "pointer"
:visible {direction == "down"}
:onclick `${EWW_CMD} update ${varname}=${!var}`
(label :angle {var ? 90 : 270} :class "reveal-on-click" :tooltip "touch control" :text ""))
(label :angle {direction == "up" ? (var ? 270 : 90) : (var ? 90 : 270)} :class "reveal-on-click" :tooltip "touch control" :text ""))
))

View file

@ -3,13 +3,14 @@
:cursor "pointer"
(box
:class "widget"
:class "widget player-ctl"
:orientation "v"
:spacing spacing-default
:space-evenly false
(eventbox
:onclick "${EWW_CMD} open MusicPlayerPopup --toggle"
:visible cover
(image :path { pcover == "" ? "./assets/image/emptympd.png" : pcover } :image-width 20 :image-height 20))
(button :onclick "playerctl previous"

View file

@ -11,7 +11,7 @@
(systray
:orientation orientation
:icon-size 18
:icon-size 20
:spacing spacing-default
)

View file

@ -10,14 +10,14 @@
(chooser)
; (weather)
; (coolmpd :h 150 :permashow true)
(coolmpd :h 160 :permashow true)
(box
:orientation "h"
:space-evenly false
:height 180
:halign "fill"
(timer)
(Timer)
(bigslides))
(box
@ -25,11 +25,12 @@
:orientation "v"
:vexpand true
:visible true
(toolbox)
(notifications_weather_box))
(Toolbox)
(NotificationsWeatherBox))
))
(defwidget toolbox []
(defwidget Toolbox []
(eventbox
:cursor "pointer"
@ -44,10 +45,10 @@
(defwidget chooser []
(box
:orientation "v"
:halign "fill"
:height 60
:class "panel-widget"
:space-evenly false
(box
:orientation "h"
@ -223,7 +224,7 @@
(label :halign "start" :text "${datehour < 12 ? 'Good morning' : datehour < 18 ? 'Good afternoon' : datehour < 22 ? 'Good evening' : 'Good night'} ${hostname}")
(label :halign "start" :text uptime :style "font-size: 12px;"))))))
(defwidget notifications_weather_box []
(defwidget NotificationsWeatherBox []
(box
:orientation "v"
:halign "fill"
@ -339,13 +340,14 @@
;; (label :halign "start" :text "${weatherjson.precipMM} mm")
))))
(defwidget timer[]
(defwidget Timer []
(box
:orientation "v"
:class "panel-widget"
:space-evenly false
:width 180
:valign "fill"
:width 200
(label :class "timer" :valign "center" :vexpand true :text timerdis)
(box
:orientation "h"
@ -369,7 +371,6 @@
(defwidget bigvol []
(overlay
(scale
:width 50
:class "bigslide"
:value volume
:onchange "pactl set-sink-volume @DEFAULT_SINK@ {}%"
@ -386,7 +387,6 @@
(defwidget bigmic []
(overlay
(scale
:width 50
:class "bigslide"
:value mic_volume
:onchange "pactl set-source-volume @DEFAULT_SOURCE@ {}%"
@ -403,7 +403,6 @@
(defwidget bigbright []
(overlay
(scale
:width 50
:class "bigslide"
:value brightness
:onchange "brightnessctl set {}%"

View file

@ -14,12 +14,12 @@
(centerbox
:orientation "v"
(Top)
(Middle)
(Bottom)
(BarTop)
(BarMiddle)
(BarBottom)
)))
(defwidget Top []
(defwidget BarTop []
(box
:orientation "v"
:space-evenly false
@ -32,7 +32,7 @@
(Shortcuts)
))
(defwidget Middle []
(defwidget BarMiddle []
(box
:orientation "v"
:space-evenly false
@ -42,10 +42,10 @@
(Separator :orientation "h" :dots "[1, 2, 3]" :visible true)
(PlayerCtl)
(PlayerCtl :cover false)
))
(defwidget Bottom []
(defwidget BarBottom []
(box
:orientation "v"
:space-evenly false
@ -54,6 +54,7 @@
(RevealOnClick
:var revealSystray
:varname "revealSystray"
:direction "up"
(Systemtray :orientation "v")
)
;; (Language)
@ -65,9 +66,9 @@
(RevealOnClick
:var revealShortcuts
:varname "revealShortcuts"
:direction "down"
(box
:class "touch"
:orientation "v"
:spacing spacing-default