From 33d4cd47ce639aeb39991b944895477a0e3b1745 Mon Sep 17 00:00:00 2001 From: JaKooLit Date: Wed, 27 Dec 2023 20:58:22 +0900 Subject: [PATCH] updated swaync, Settings animation and DarkLight.sh --- config/hypr/configs/Settings.conf | 16 +++-- config/hypr/scripts/DarkLight.sh | 15 ++++- config/swaync/config.json | 10 +-- config/swaync/style.css | 103 ++++++++++++++++++------------ 4 files changed, 88 insertions(+), 56 deletions(-) diff --git a/config/hypr/configs/Settings.conf b/config/hypr/configs/Settings.conf index 2ad370a..7107d40 100644 --- a/config/hypr/configs/Settings.conf +++ b/config/hypr/configs/Settings.conf @@ -1,6 +1,7 @@ ## /* ---- 💫 https://github.com/JaKooLit 💫 ---- */ ## ## refer to Hyprland wiki for more info https://wiki.hyprland.org/Configuring/Variables + # Sourcing colors generated by pywal source = $HOME/.cache/wal/colors-hyprland # blurls = waybar @@ -26,7 +27,7 @@ general { border_size = 2 resize_on_border = true - col.active_border = $color0 $color2 $color4 $color6 $color8 45deg + col.active_border = $color0 $color2 $color4 $color6 $color8 90deg col.inactive_border = $backgroundCol layout = master @@ -78,13 +79,14 @@ animations { bezier = bounce, 1.1, 1.6, 0.1, 0.85 bezier = sligshot, 1, -1, 0.15, 1.25 bezier = nice, 0, 6.9, 0.5, -4.20 - - animation = windowsIn, 1, 5, slow, popin - animation = windowsOut, 1, 5, winOut, popin + + animation = windows, 1, 6, wind, slide + animation = windowsIn, 1, 6, winIn, slide + animation = windowsOut, 1, 5, winOut, slide animation = windowsMove, 1, 5, wind, slide - animation = border, 1, 10, linear - animation = borderangle, 1, 100, linear, loop - animation = fade, 1, 5, overshot + animation = border, 1, 1, linear + animation = borderangle, 1, 150, linear, loop + animation = fade, 1, 10, default animation = workspaces, 1, 5, wind animation = windows, 1, 5, bounce, popin } diff --git a/config/hypr/scripts/DarkLight.sh b/config/hypr/scripts/DarkLight.sh index a2b7af7..ec8c447 100755 --- a/config/hypr/scripts/DarkLight.sh +++ b/config/hypr/scripts/DarkLight.sh @@ -1,10 +1,11 @@ #!/bin/bash -#set -x +set -x # Paths wallpaper_base_path="$HOME/Pictures/wallpapers/Dynamic-Wallpapers" dark_wallpapers="$wallpaper_base_path/Dark" light_wallpapers="$wallpaper_base_path/Light" hypr_config_path="$HOME/.config/hypr" +swaync_style="$HOME/.config/swaync/style.css" SCRIPTSDIR="$HOME/.config/hypr/scripts" notif="$HOME/.config/swaync/images/bell.png" dark_rofi_pywal="$HOME/.cache/wal/colors-rofi-dark.rasi" @@ -61,6 +62,15 @@ set_waybar_style "$next_mode" notify_user "$next_mode" +# swaync color change +if [ "$next_mode" = "Dark" ]; then + sed -i '/@define-color noti-bg/s/rgba([0-9]*,\s*[0-9]*,\s*[0-9]*,\s*[0-9.]*);/rgba(0, 0, 0, 0.8);/' "${swaync_style}" + sed -i '/@define-color noti-bg-alt/s/#.*;/#111111;/' "${swaync_style}" +else + sed -i '/@define-color noti-bg/s/rgba([0-9]*,\s*[0-9]*,\s*[0-9]*,\s*[0-9.]*);/rgba(255, 255, 255, 0.9);/' "${swaync_style}" + sed -i '/@define-color noti-bg-alt/s/#.*;/#F0F0F0;/' "${swaync_style}" +fi + # Set Dynamic Wallpaper for Dark or Light Mode if [ "$next_mode" = "Dark" ]; then next_wallpaper="$(find "${dark_wallpapers}" -type f \( -iname "*.jpg" -o -iname "*.png" \) -print0 | shuf -n1 -z | xargs -0)" @@ -177,8 +187,7 @@ sleep 1 ${SCRIPTSDIR}/Refresh.sh # Display notifications for theme and icon changes -notify-send -u normal -i "$notif" "Themes are set to $selected_theme" -notify-send -u normal -i "$notif" "Icon themes set to $selected_icon" +notify-send -u normal -i "$notif" "Themes in $next_mode Mode" exit 0 diff --git a/config/swaync/config.json b/config/swaync/config.json index 7d187fa..6c70332 100644 --- a/config/swaync/config.json +++ b/config/swaync/config.json @@ -6,7 +6,7 @@ "control-center-layer": "top", "layer-shell": true, "cssPriority": "application", - "control-center-margin-top": 0, + "control-center-margin-top": 10, "control-center-margin-bottom": 0, "control-center-margin-right": 0, "control-center-margin-left": 0, @@ -31,9 +31,9 @@ "widgets": [ "dnd", "buttons-grid", - /* "mpris", */ - /* "volume", */ - /* "backlight",*/ + "mpris", + "volume", + "backlight", "title", "notifications" ], @@ -51,7 +51,7 @@ "text": "Notification" }, "mpris": { - "image-size": 20, + "image-size": 10, "image-radius": 0 }, "volume": { diff --git a/config/swaync/style.css b/config/swaync/style.css index 59aea3c..f0d41fb 100644 --- a/config/swaync/style.css +++ b/config/swaync/style.css @@ -1,10 +1,13 @@ +/* ----------- 💫 https://github.com/JaKooLit 💫 -------- */ + @import '../../.cache/wal/colors-waybar.css'; @define-color noti-border-color @color2; -@define-color noti-bg @background; -@define-color noti-bg-darker rgba(43, 43, 57, 0.6); +@define-color noti-bg rgba(0, 0, 0, 0.8); +@define-color noti-bg-alt #111111; @define-color noti-bg-hover @color2; -@define-color text-color @color7; +@define-color text-color @color2; +@define-color text-color-alt @color7; @define-color text-color-disabled rgba(150, 150, 150, 0.8); * { @@ -14,26 +17,24 @@ .control-center .notification-row:focus, .control-center .notification-row:hover { - opacity: 0.5; + opacity: 1; background: @noti-bg; border-radius: 10px } .notification-row { outline: none; - margin: 10px; - padding: 0; + margin: 0px; } .notification { - background: transparent; - padding: 0px; - margin: 0px; + border-radius: 10px; } -.notification-content { +.notification-content{ + color: @text-color; background: @noti-bg; - padding: 6px; + padding: 3px 10px 3px 6px; border-radius: 10px; border: 2px solid @noti-border-color; margin: 0px; @@ -73,12 +74,12 @@ .notification-default-action:hover, .notification-action:hover { color: @text-color; - background: #7aa2f7 + background: @color1 } .notification-default-action { border-radius: 10px; - margin: 0px; + margin: 5px; } .notification-default-action:not(:only-child) { @@ -109,7 +110,7 @@ } .inline-reply-button { - font-size: 0.5rem; + font-size: 0.5rem; margin-left: 4px; background: @noti-bg; border: 1px solid @noti-border-color; @@ -129,21 +130,21 @@ .body-image { margin-top: 6px; - background-color: #fff; + color: @text-color-alt; border-radius: 10px } .summary { font-size: 1rem; - font-weight: 700; + font-weight: 200; background: transparent; - color: rgba(158, 206, 106, 0.9); + color: @text-color-alt; text-shadow: none } .time { font-size: 1rem; - font-weight: 700; + font-weight: 200; background: transparent; color: @text-color; text-shadow: none; @@ -152,7 +153,7 @@ .body { font-size: 1rem; - font-weight: 400; + font-weight: 200; background: transparent; color: @text-color; text-shadow: none @@ -169,7 +170,7 @@ } .control-center-list-placeholder { - opacity: .5 + opacity: 0.5 } .floating-notifications { @@ -182,9 +183,9 @@ .widget-title { color: @noti-border-color; - background: @noti-bg-darker; + background: @noti-bg-alt; padding: 3px 6px; - margin: 10px 10px 5px 10px; + margin: 5px; font-size: 1rem; border-radius: 10px; } @@ -203,9 +204,9 @@ } .widget-dnd { - background: @noti-bg-darker; - padding: 3px 5px 3px 5px; - margin: 5px 10px 10px 10px; + background: @noti-bg-alt; + padding: 3px 6px; + margin: 5px; border-radius: 10px; font-size: 1rem; color: @noti-border-color; @@ -233,7 +234,7 @@ } .widget-label { - margin: 0px; + margin: 5px; } .widget-label>label { @@ -243,9 +244,9 @@ .widget-mpris { color: @text-color; - background: @noti-bg-darker; - padding: 2px 6px; - margin: 5px 10px 5px 10px; + background: @noti-bg-alt; + padding: 3px 6px; + margin: 5px; border-radius: 10px; } @@ -254,25 +255,26 @@ } .widget-mpris-player { - padding: 5px 10px; - margin: 10px + padding: 3px 6px; + margin: 5px; } .widget-mpris-title { - font-weight: 700; - font-size: 1.25rem + font-weight: 100; + font-size: 1rem } .widget-mpris-subtitle { - font-size: 1.1rem + font-size: 0.75rem } .widget-buttons-grid { - font-size: x-large; + font-size: large; + color: @noti-border-color; padding: 2px; - margin: 0px; + margin: 5px; border-radius: 10px; - background: @noti-bg-darker; + background: @noti-bg-alt; } .widget-buttons-grid>flowbox>flowboxchild>button { @@ -284,7 +286,7 @@ .widget-buttons-grid>flowbox>flowboxchild>button:hover { background: rgba(122, 162, 247, 0.1); - color: @noti-border-color; + color: @text-color-alt } .widget-menubar>box>.menu-button-bar>button { @@ -298,12 +300,12 @@ } .widget-volume { - background: @noti-bg-darker; + background: @noti-bg-alt; padding: 2px; margin: 10px 10px 5px 10px; border-radius: 10px; font-size: x-large; - color: @text-color; + color: @text-color } .widget-volume>box>button { @@ -316,13 +318,32 @@ padding: 4px 8px 8px; margin: 0 8px 8px; border-radius: 10px; + color: @text-color } .widget-backlight { - background: @noti-bg-darker; + background: @noti-bg-alt; padding: 5px; margin: 10px 10px 5px 10px; border-radius: 10px; font-size: x-large; color: @text-color } + +.low { + background: @text-color; + padding: 0px; + border-radius: 10px; +} + +.normal { + background: @text-color; + padding: 0px; + border-radius: 10px; +} + +.critical { + background: red; + padding: 0px; + border-radius: 10px; +}