From 4a088d2f916fcbe191c92fb3ab4bfbf4595379ef Mon Sep 17 00:00:00 2001 From: hesam-init Date: Mon, 1 Jul 2024 10:06:31 +0330 Subject: [PATCH] feat: eww font mixin --- .../hyprland/eww/assets/scss/_components.scss | 7 ++ .../hyprland/eww/assets/scss/_global.scss | 20 +++++ .../hyprland/eww/assets/scss/_mixin.scss | 36 ++++----- .../hyprland/eww/assets/scss/_modules.scss | 4 +- .../assets/scss/windows/_vertical-bar.scss | 6 -- hypr-configs/hyprland/eww/eww.scss | 1 - .../eww/src/-components/_helpers.yuck | 78 +++++++++--------- .../hyprland/eww/src/-modules/_media.yuck | 2 +- .../eww/src/-modules/_workspaces.yuck | 3 +- .../hyprland/eww/src/_definitions.yuck | 80 ++++++++++--------- .../eww/src/windows/_vertical-bar.yuck | 69 ++++++---------- 11 files changed, 154 insertions(+), 152 deletions(-) diff --git a/hypr-configs/hyprland/eww/assets/scss/_components.scss b/hypr-configs/hyprland/eww/assets/scss/_components.scss index 299f77a..a4764b8 100644 --- a/hypr-configs/hyprland/eww/assets/scss/_components.scss +++ b/hypr-configs/hyprland/eww/assets/scss/_components.scss @@ -1,3 +1,10 @@ .reveal-on-hover { padding: 6px 0px; } + +.reveal-on-click { + @include font("medium"); + + color: $surface2; + padding: 4px 0px; +} diff --git a/hypr-configs/hyprland/eww/assets/scss/_global.scss b/hypr-configs/hyprland/eww/assets/scss/_global.scss index 0e82a44..1a42db2 100644 --- a/hypr-configs/hyprland/eww/assets/scss/_global.scss +++ b/hypr-configs/hyprland/eww/assets/scss/_global.scss @@ -1,3 +1,23 @@ +@import "mixin"; + +.widget { + @include widget; +} + +.panel-widget { + @include widget; + + margin: 6px; +} + +.icon { + @include icon; +} + +.popup { + @include popup; +} + .border { border: 2px white solid; } diff --git a/hypr-configs/hyprland/eww/assets/scss/_mixin.scss b/hypr-configs/hyprland/eww/assets/scss/_mixin.scss index b689340..3917f72 100644 --- a/hypr-configs/hyprland/eww/assets/scss/_mixin.scss +++ b/hypr-configs/hyprland/eww/assets/scss/_mixin.scss @@ -1,26 +1,28 @@ +@mixin font($size: "default") { + $sizes: ( + "small": 16px, + "medium": 18px, + "large": 20px, + ); + + @if map-has-key($sizes, $size) { + font-size: map-get($sizes, $size); + } @else { + font-size: map-get($sizes, "large"); + } +} + @mixin widget() { - padding: 0.6em; + padding: 0.6em 0.4em; margin: 4px 2px; border-radius: 8px; background-color: $surface0; } -.widget { - @include widget; -} - -.panel-widget { - @include widget; - margin: 6px; -} - @mixin icon() { - font-size: 20px; - font-family: "Symbols Nerd Font"; -} + @include font("medium"); -.icon { - @include icon; + font-family: "Symbols Nerd Font"; } @mixin popup() { @@ -30,7 +32,3 @@ border-style: solid; margin: 10px; } - -.popup { - @include popup; -} diff --git a/hypr-configs/hyprland/eww/assets/scss/_modules.scss b/hypr-configs/hyprland/eww/assets/scss/_modules.scss index 60eaf2b..0088571 100644 --- a/hypr-configs/hyprland/eww/assets/scss/_modules.scss +++ b/hypr-configs/hyprland/eww/assets/scss/_modules.scss @@ -2,7 +2,7 @@ @include widget; label { - font-size: 20px; + @include font; } } @@ -10,7 +10,7 @@ @include widget; label { - font-size: 18px; + @include font("small"); } } diff --git a/hypr-configs/hyprland/eww/assets/scss/windows/_vertical-bar.scss b/hypr-configs/hyprland/eww/assets/scss/windows/_vertical-bar.scss index 5ec3478..5832b2d 100644 --- a/hypr-configs/hyprland/eww/assets/scss/windows/_vertical-bar.scss +++ b/hypr-configs/hyprland/eww/assets/scss/windows/_vertical-bar.scss @@ -4,12 +4,6 @@ background-color: $base; } -.revealtouch { - font-size: 20px; - margin: 5px 0px; - color: $surface2; -} - .bat_scale trough { min-height: 50px; min-width: 18px; diff --git a/hypr-configs/hyprland/eww/eww.scss b/hypr-configs/hyprland/eww/eww.scss index 434d383..eb61254 100644 --- a/hypr-configs/hyprland/eww/eww.scss +++ b/hypr-configs/hyprland/eww/eww.scss @@ -1,5 +1,4 @@ @import "./assets/scss/themes/fullerene.scss"; -@import "./assets/scss/mixin"; @import "./assets/scss/native"; @import "./assets/scss/global"; @import "./assets/scss/modules"; diff --git a/hypr-configs/hyprland/eww/src/-components/_helpers.yuck b/hypr-configs/hyprland/eww/src/-components/_helpers.yuck index f8bf125..6959ce1 100644 --- a/hypr-configs/hyprland/eww/src/-components/_helpers.yuck +++ b/hypr-configs/hyprland/eww/src/-components/_helpers.yuck @@ -1,49 +1,47 @@ (defwidget HoveredSign [var] - (box :space-evenly false - (revealer :reveal {!var} - :duration "100ms" - :transition "slideleft" - (children :nth 0)) - (revealer :reveal {var} - :duration "100ms" - :transition "slideleft" - (children :nth 1)))) - -(defwidget RevealOnHover [var varname ?class ?duration ?transition] - (box - :class "${class}" - :orientation "v" - :space-evenly false - :valign "end" + (box :space-evenly false + (revealer :reveal {!var} + :duration "100ms" + :transition "slideleft" + (children :nth 0)) + (revealer :reveal {var} + :duration "100ms" + :transition "slideleft" + (children :nth 1)))) +(defwidget RevealOnHover [var varname ?class ?duration ?transition ?icon] (eventbox - :onhover `${EWW_CMD} update ${varname}=true` - :onhoverlost `${EWW_CMD} update ${varname}=false` + :onhover `${EWW_CMD} update ${varname}=true` + :onhoverlost `${EWW_CMD} update ${varname}=false` - (box - :space-evenly false + (box + :space-evenly false + :orientation "v" + (label :class "icon" :text icon) + + (revealer + :reveal var + :transition {transition ?:"slidedown"} + :duration "500ms" + (box :class "reveal-on-hover" (children :nth 0)))) + )) + +(defwidget RevealOnClick [var varname ?class ?duration ?transition] + (box :orientation "v" - (children :nth 0) + :class "widget" + :space-evenly false (revealer - :reveal var - :transition {transition ?:"slidedown"} - :duration "500ms" - (box :class "reveal-on-hover" (children :nth 1)))))) -) + :reveal var + :transition "slideup" + :duration "500ms" + (box (children :nth 0))) + (eventbox + :cursor "pointer" + :onclick `${EWW_CMD} update ${varname}=${!var}` -(defwidget ClickBox [var varname ?class ?duration ?transition] - (box :class "${class} clickbox" :orientation "h" :space-evenly false - (button :onclick "eww update ${varname}=${ var ? false : true }" - (children :nth 0)) - - (revealer :reveal var - :transition {transition ?: "slideleft"} - :duration {duration ?: "500ms"} - - (box :class "${class}" - :space-evenly false - (children :nth 1) - (button :onclick "eww update ${varname}=false" :class "close" (label :text "Close"))))) -) + (label :angle {var ? 90 : 270} :class "reveal-on-click" :tooltip "touch control" :text "") + ) + )) diff --git a/hypr-configs/hyprland/eww/src/-modules/_media.yuck b/hypr-configs/hyprland/eww/src/-modules/_media.yuck index ffba963..b9ad381 100644 --- a/hypr-configs/hyprland/eww/src/-modules/_media.yuck +++ b/hypr-configs/hyprland/eww/src/-modules/_media.yuck @@ -4,7 +4,7 @@ (box :class "widget" :orientation "v" - :spacing 6 + :spacing defaultSpacing (eventbox :onclick "${EWW_CMD} open MusicPlayerPopup --toggle" diff --git a/hypr-configs/hyprland/eww/src/-modules/_workspaces.yuck b/hypr-configs/hyprland/eww/src/-modules/_workspaces.yuck index 2796858..75de54c 100644 --- a/hypr-configs/hyprland/eww/src/-modules/_workspaces.yuck +++ b/hypr-configs/hyprland/eww/src/-modules/_workspaces.yuck @@ -9,11 +9,12 @@ :class "workspaces" :space-evenly false :orientation "v" - :spacing 6 + :spacing largeSpacing (for workspace in {workspacesJson} (button :onclick "hyprctl dispatch workspace ${workspace.id}" + (box :height 25 :class "workspace ${workspace.id == currentWorkspace ? "workspacethingactive" : "workspacething"}" diff --git a/hypr-configs/hyprland/eww/src/_definitions.yuck b/hypr-configs/hyprland/eww/src/_definitions.yuck index 04f7d4f..6e6549d 100644 --- a/hypr-configs/hyprland/eww/src/_definitions.yuck +++ b/hypr-configs/hyprland/eww/src/_definitions.yuck @@ -1,5 +1,11 @@ -; Global +; Global Styles (defvar animationDuration "500ms") +(defvar defaultSpacing 8) +(defvar largeSpacing 6) +(defvar mediumSpacing 4) +(defvar smallSpacing 2) + +; Global (deflisten kbLayout :initial "en" "./scripts/kb-layout/get-active") (defpoll thour :initial "0" :interval "60s" "date +'%I'") (defpoll tmin :initial "0" :interval "60s" "date +'%M'") @@ -57,13 +63,13 @@ ; Notifications (deflisten notifications :initial '{ - "count": 0, - "dnd": false, - "notifications": [], - "popups": [] - }' + "count": 0, + "dnd": false, + "notifications": [], + "popups": [] + }' "./scripts/notif.py" -) + ) ; Playerctl (deflisten pstatus :initial "" "playerctl status -F") @@ -72,9 +78,9 @@ (deflisten pcover "./scripts/pollcover.sh") (deflisten ptime :initial '{ - "position": 0, - "duration": 0, - "readable": "0:00" + "position": 0, + "duration": 0, + "readable": "0:00" }' "playerctl -F metadata -f '{ \"position\": {{position/1000000}}, \"duration\": {{mpris:length/1000000}}, \"readable\": \"{{duration(position)}}/{{duration(mpris:length)}}\" }'") ;; (deflisten pside "playerctl -F metadata -f '{ \"volume\": {{volume*100}}, \"shuffle\": \"{{shuffle}}\", \"loop\": \"{{loop}}\" }'") @@ -87,34 +93,34 @@ (defpoll uptime :initial "idk" :interval "1m" "uptime -p") (defpoll weatherjson :initial '{ - "FeelsLikeC": "0", - "FeelsLikeF": "0", - "cloudcover": "0", - "humidity": "0", - "localObsDateTime": "2000-00-00 07:27 AM", - "observation_time": "07:27 AM", - "precipInches": "0.0", - "precipMM": "0.0", - "pressure": "0", - "pressureInches": "0", - "temp_C": "0", - "temp_F": "0", - "uvIndex": "0", - "visibility": "0", - "visibilityMiles": "0", - "weatherCode": "727", - "weatherDesc": [{"value": "Idk"}], - "weatherIconUrl": [{"value": ""}], - "winddir16Point": "", - "winddirDegree": "0", - "windspeedKmph": "0", - "windspeedMiles": "0", - "icon": "idk", - "hourly": [] - }' + "FeelsLikeC": "0", + "FeelsLikeF": "0", + "cloudcover": "0", + "humidity": "0", + "localObsDateTime": "2000-00-00 07:27 AM", + "observation_time": "07:27 AM", + "precipInches": "0.0", + "precipMM": "0.0", + "pressure": "0", + "pressureInches": "0", + "temp_C": "0", + "temp_F": "0", + "uvIndex": "0", + "visibility": "0", + "visibilityMiles": "0", + "weatherCode": "727", + "weatherDesc": [{"value": "Idk"}], + "weatherIconUrl": [{"value": ""}], + "winddir16Point": "", + "winddirDegree": "0", + "windspeedKmph": "0", + "windspeedMiles": "0", + "icon": "idk", + "hourly": [] + }' :interval "1h" :run-while revealControlpanel -"./scripts/weather.py") + "./scripts/weather.py") (defpoll datehour :initial "12" :interval "30m" "date +'%H'") (defpoll notesc :interval "2s" :run-while reveal4 "cat -s ~/Documents/fuck.txt") -(defpoll quotejson :interval "1h" `./scripts/quote.py`) \ No newline at end of file +(defpoll quotejson :interval "1h" `./scripts/quote.py`) diff --git a/hypr-configs/hyprland/eww/src/windows/_vertical-bar.yuck b/hypr-configs/hyprland/eww/src/windows/_vertical-bar.yuck index fcd9ce4..a54fa70 100644 --- a/hypr-configs/hyprland/eww/src/windows/_vertical-bar.yuck +++ b/hypr-configs/hyprland/eww/src/windows/_vertical-bar.yuck @@ -26,7 +26,7 @@ (Logo) (Workspaces) - ;; (hiddenctl) + (hiddenctl) )) (defwidget Middle [] @@ -91,52 +91,37 @@ (label :text "${EWW_BATTERY.BAT0.capacity}%" :limit-width 3 :show-truncated false))) (defwidget hiddenctl [] - (eventbox - :cursor "pointer" - :onclick {reveal3 ? "${EWW_CMD} update reveal3=false" : "${EWW_CMD} update reveal3=true"} + (RevealOnClick + :var reveal3 + :varname "reveal3" (box + :class "touch" :orientation "v" - :class "widget" - :space-evenly false - (revealer - :reveal reveal3 - :transition "slideup" - :duration "500ms" - (box - :class "touch" - :orientation "v" - :spacing 5 - (button :onclick "swaymsg kill" - (label :class "icon" :text "󰅙")) - (button :onclick "wofi --show=drun -i -I" - (label :class "icon" :text "󰀻")) - (button :onclick "./scripts/touchkey.sh" - (label :class "icon" :text "󰌌")))) - (label :angle {reveal3 ? 90 : 270} :class "revealtouch" :tooltip "touch control" :text "") - (revealer - :reveal {!reveal3} - :transition "slidedown" - )))) + :spacing 5 + (button :onclick "swaymsg kill" + (label :class "icon" :text "󰅙")) + (button :onclick "wofi --show=drun -i -I" + (label :class "icon" :text "󰀻")) + (button :onclick "./scripts/touchkey.sh" + (label :class "icon" :text "󰌌")))) + ) (defwidget Sliders [] (box :class "widget" :orientation "v" :space-evenly false - :spacing 8 + :spacing defaultSpacing :valign "end" (button :onclick "alacritty -e nmtui" :tooltip wifi_essid - (label :class "icon" :style "font-size: 18px;" :text wifi_icon)) + (label :class "icon" :text wifi_icon)) (RevealOnHover :var revealVolume :varname "revealVolume" - (box - :orientation "v" - :space-evenly false - :class "sound" - (label :class "icon" :text {volumemute == 'false' ? "󰕾" : "󰖁"})) + :icon {volumemute == 'false' ? "󰕾" : "󰖁"} + (scale :class "volslide" :value volume @@ -150,12 +135,9 @@ (RevealOnHover :var revealMicrophone :varname "revealMicrophone" - (box - :orientation "v" - :space-evenly false - :class "sound" - (label :class "icon" :text {volumemute == 'false' ? "" : "󰖁"})) - (scale + :icon {volumemute == 'false' ? "" : "󰖁"} + + (scale :class "volslide" :value mic_volume :onchange "pactl set-source-volume @DEFAULT_SOURCE@ {}%" @@ -168,12 +150,9 @@ (RevealOnHover :var revealBrightness :varname "revealBrightness" - (box - :orientation "v" - :space-evenly false - :class "bright" - (label :class "icon" :text "󰃞")) - (scale + :icon "󰃞" + + (scale :class "brislide" :onchange "brightnessctl set {}%" :value brightness @@ -182,4 +161,4 @@ :max 100 :min 0 :flipped true)) - )) \ No newline at end of file + ))