Squash merge modularization into main

.gitignore

@@ -3,3 +3,4 @@ nix/nixos.qcow2
 nix_file.tar.gz
 nvim
 tmux/plugins
+modules/quickshell/quickshell/.qmlls.ini

hardwares/doloro-laptop/hardware-configuration.nix

@@ -1,14 +1,25 @@
 # Do not modify this file!  It was generated by ‘nixos-generate-config’
 # and may be overwritten by future invocations.  Please make changes
 # to /etc/nixos/configuration.nix instead.
-{ config, lib, pkgs, modulesPath, ... }:
+{
+  config,
+  lib,
+  pkgs,
+  modulesPath,
+  ...
+}:
 
 {
-  imports =
+  imports = [
-    [ (modulesPath + "/installer/scan/not-detected.nix")
+    (modulesPath + "/installer/scan/not-detected.nix")
   ];
 
-  boot.initrd.availableKernelModules = [ "xhci_pci" "thunderbolt" "vmd" "nvme" ];
+  boot.initrd.availableKernelModules = [
+    "xhci_pci"
+    "thunderbolt"
+    "vmd"
+    "nvme"
+  ];
   boot.initrd.kernelModules = [ ];
   boot.kernelModules = [ "kvm-intel" ];
   boot.extraModulePackages = [ ];

hosts/doloro-laptop/home.nix

@@ -6,39 +6,27 @@
   ...
 }:
 {
-  # imports = [
-  #   ../../modules/hyprland/home.nix
-  #   ../../modules/quickshell/home.nix
-  #   ../../modules/chromium/home.nix
-  #   #./modules/neovim/home.nix
-  #   ../../modules/stylix/home.nix
-  #   ../../modules/nixvim/home.nix
-  #   ../../modules/tmux/home.nix
-  #   ../../modules/theme/home.nix
-  #   # ./modules/spicetify/home.nix
-  #   ../../modules/obs/home.nix
-  #   ../../modules/blender/home.nix
-  #   ../../modules/fish/home.nix
-  #   ../../modules/ytm/home.nix
-  #   ../../overlays.nix
-  # ];
   modules = {
     Hyprland.enable = true;
     quickshell.enable = true;
     # chromium.enable = true;
-    wivrn.enable = true;
+    wivrn.enable = false;
     helium.enable = true;
     nixvim.enable = true;
+    kitty.enable = true;
     helix.enable = false;
     stylix.enable = true;
     tmux.enable = true;
     theme.enable = true;
-    obs.enable = true;
+    obs = {
-    blender.enable = true;
+      enable = true;
-    bottles.enable = true;
+      autostart = false;
+    };
+    blender.enable = false;
+    bottles.enable = false;
     fish.enable = true;
     youtube-music.enable = true;
-    unityhub.enable = true;
+    unityhub.enable = false;
     direnv.enable = true;
     git.enable = true;
     rsRPC.enable = true;
@@ -61,6 +49,16 @@
     };
   };
   xdg.mimeApps.enable = true;
+  wayland.windowManager.hyprland.settings = {
+    monitor = [
+      "eDP-1, 2880x1800@120, 0x0, 2"
+    ];
+    input = {
+      kb_layout = "gb";
+      follow_mouse = 2;
+      sensitivity = 0;
+    };
+  };
 
   # This value determines the Home Manager release that your configuration is
   # compatible with. This helps avoid breakage when a new Home Manager release
@@ -78,9 +76,6 @@
     vim
     telegram-desktop
     vesktop
-    # (pkgs.discord.override { withVencord = true; })
-    # webcord-vencord
-    # spotify
     pavucontrol
     lazygit
     btop

hosts/doloro-laptop/laptop.nix

@@ -0,0 +1,38 @@
+{ pkgs, lib, ... }:
+let
+
+in
+{
+  services.tlp = {
+    enable = true;
+    settings = {
+      CPU_SCALING_GOVERNOR_ON_BAT = "powersave";
+      PCIE_ASPM_ON_BAT = "powersave";
+      CPU_SCALING_GOVERNOR_ON_AC = "balanced";
+      PCIE_ASPM_ON_AC = "balanced";
+      START_CHARGE_THRESH_BAT0 = 40; # 40 and below it starts to charge
+      STOP_CHARGE_THRESH_BAT0 = 80; # 80 and above it stops charging
+    };
+  };
+  # services.tuned.enable = true;
+  services.thermald.enable = true;
+  services.upower = {
+    enable = true;
+  };
+  # boot.kernelParams = [ "mem_sleep_default=deep" ];
+  services.logind.settings.Login = {
+    HandleLidSwitch = "suspend-then-hibernate";
+    HandleLidSwitchExternalPower = "ignore";
+    HandleLidSwitchDocked = "ignore";
+  };
+  systemd.sleep.extraConfig = ''
+        HibernateDelaySec=30min
+    		SuspendEstimationSec=120
+  '';
+
+  # one of "ignore", "poweroff", "reboot", "halt", "kexec", "suspend", "hibernate", "hybrid-sleep", "suspend-then-hibernate", "lock"
+  powerManagement = {
+    enable = true;
+    powertop.enable = true;
+  };
+}

hosts/doloro-laptop/nixos.nix

@@ -16,6 +16,7 @@ in
 {
   imports = [
     inputs.sops-nix.nixosModules.sops
+    ./laptop.nix
   ];
   modules = {
     fish.enable = true;
@@ -24,11 +25,12 @@ in
     steam.enable = false;
     Hyprland.enable = true;
     wivrn.enable = false;
+    fonts.enable = true;
   };
   # Use the systemd-boot EFI boot loader.
   boot.loader.systemd-boot.enable = true;
   boot.loader.efi.canTouchEfiVariables = true;
-  boot.kernelPackages = pkgs.linuxPackages_latest;
+  boot.kernelPackages = pkgs.linuxPackages_6_12; # Hibernate works on 6.12 but not on latest
 
   networking.hostName = "doloro-nixos-laptop"; # Define your hostname.
   security.rtkit.enable = true;
@@ -37,7 +39,8 @@ in
   networking.networkmanager.enable = true;
 
   # Set your time zone.
-  time.timeZone = "Europe/London";
+  # time.timeZone = "Europe/London";
+  services.automatic-timezoned.enable = true;
 
   nix.settings = {
     substituters = [
@@ -59,6 +62,11 @@ in
   };
   hardware.graphics = {
     enable = true;
+    extraPackages = with pkgs; [
+      intel-media-driver # VA-API (iHD) userspace
+      # vpl-gpu-rt # oneVPL (QSV) runtime
+      intel-compute-runtime # OpenCL (NEO) + Level Zero for Arc/Xe
+    ];
   };
   services.openssh = {
     enable = true;
@@ -70,9 +78,6 @@ in
   users.users.root.openssh.authorizedKeys.keys = [
     "ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIBaa6Z5qtBSLEz+A4fQGYPfkOISsRQlmKkVbcx2zxML7"
   ];
-  # Configure network proxy if necessary
-  # networking.proxy.default = "http://user:password@proxy:port/";
-  # networking.proxy.noProxy = "127.0.0.1,localhost,internal.domain";
 
   # Select internationalisation properties.
   # i18n.defaultLocale = "en_US.UTF-8";
@@ -85,17 +90,6 @@ in
   # Enable the X11 windowing system.
   services.xserver.enable = true;
 
-  # Configure keymap in X11
-  # services.xserver.xkb.layout = "us";
-  # services.xserver.xkb.options = "eurosign:e,caps:escape";
-
-  # Enable CUPS to print documents.
-  # services.printing.enable = true;
-
-  # Enable sound.
-  # services.pulseaudio.enable = true;
-  # OR
-
   sops = {
     defaultSopsFile = builtins.toPath "${nix-meow.flakeRoot}/secrets/users.yaml";
     secrets = {
@@ -107,6 +101,7 @@ in
       };
     };
   };
+
   services.pipewire = {
     enable = true;
     pulse.enable = true;
@@ -122,9 +117,13 @@ in
     packages = with pkgs; [
       tree
     ];
-    # initialPassword = "sex";
     hashedPasswordFile = config.sops.secrets."doloro-hashed_password".path;
+    openssh.authorizedKeys.keys = [
+      "ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIBaa6Z5qtBSLEz+A4fQGYPfkOISsRQlmKkVbcx2zxML7" # pc public key
+    ];
+    # initialPassword = "sex";
   };
+  users.mutableUsers = false;
 
   # programs.firefox.enable = true;
 

hosts/doloro/home.nix

@@ -23,7 +23,10 @@
   #   ../../overlays.nix
   # ];
   modules = {
-    Hyprland.enable = true;
+    Hyprland = {
+      enable = true;
+      suspend-on-hibernate = true;
+    };
     quickshell.enable = true;
     # chromium.enable = true;
     wivrn.enable = true;
@@ -31,9 +34,13 @@
     nixvim.enable = true;
     helix.enable = false;
     stylix.enable = true;
+    kitty.enable = true;
     tmux.enable = true;
     theme.enable = true;
-    obs.enable = true;
+    obs = {
+      enable = true;
+      autostart = true;
+    };
     blender.enable = true;
     bottles.enable = true;
     fish.enable = true;
@@ -48,6 +55,24 @@
   home.username = "doloro";
   home.homeDirectory = "/home/doloro";
 
+  wayland.windowManager.hyprland.settings = {
+    monitor = [
+      "HDMI-A-1, 1920x1080@60, 0x0, 1"
+      "DP-3, 1920x1080@144, 1920x0, 1"
+    ];
+    exec-once = [
+      "hyprctl dispatch workspace 2" # shit solution to get quickshell on the right monitor
+    ];
+    workspace = [
+      "name:2, monitor:DP-3"
+    ];
+    input = {
+      kb_layout = "gb";
+      follow_mouse = 2;
+      sensitivity = -0.5;
+    };
+  };
+
   services = {
     gpg-agent = {
       enable = true;
@@ -89,39 +114,6 @@
     gcr
     qbittorrent
   ];
-  # sops.age.keyFile = "/home/doloro/.config/sops/age/key.txt";
-
-  # Home Manager is pretty good at managing dotfiles. The primary way to manage
-  # plain files is through 'home.file'.
-  home.file = {
-    # # Building this configuration will create a copy of 'dotfiles/screenrc' in
-    # # the Nix store. Activating the configuration will then make '~/.screenrc' a
-    # # symlink to the Nix store copy.
-    # ".screenrc".source = dotfiles/screenrc;
-
-    # # You can also set the file content immediately.
-    # ".gradle/gradle.properties".text = ''
-    #   org.gradle.console=verbose
-    #   org.gradle.daemon.idletimeout=3600000
-    # '';
-  };
-
-  # Home Manager can also manage your environment variables through
-  # 'home.sessionVariables'. These will be explicitly sourced when using a
-  # shell provided by Home Manager. If you don't want to manage your shell
-  # through Home Manager then you have to manually source 'hm-session-vars.sh'
-  # located at either
-  #
-  #  ~/.nix-profile/etc/profile.d/hm-session-vars.sh
-  #
-  # or
-  #
-  #  ~/.local/state/nix/profiles/profile/etc/profile.d/hm-session-vars.sh
-  #
-  # or
-  #
-  #  /etc/profiles/per-user/doloro/etc/profile.d/hm-session-vars.sh
-  #
   home.sessionVariables = {
     EDITOR = "nvim";
   };
@@ -130,8 +122,8 @@
       enable = true;
     };
   };
+
   xdg.configFile."mimeapps.list".force = true;
-  # Let Home Manager install and manage itself.
 
   programs = {
     ssh = {

hosts/doloro/nixos.nix

@@ -24,6 +24,7 @@ in
     steam.enable = true;
     Hyprland.enable = true;
     wivrn.enable = true;
+    fonts.enable = true;
   };
 
   # Use the systemd-boot EFI boot loader.
@@ -174,29 +175,29 @@ in
     package = config.boot.kernelPackages.nvidiaPackages.latest;
   };
 
-  fonts = {
+  # fonts = {
-    enableDefaultPackages = true;
+  #   enableDefaultPackages = true;
-    packages =
+  #   packages =
-      with pkgs;
+  #     with pkgs;
-      [
+  #     [
-        nerd-fonts.jetbrains-mono
+  #       nerd-fonts.jetbrains-mono
-        material-design-icons
+  #       material-design-icons
-        material-symbols
+  #       material-symbols
-        googlesans-code
+  #       googlesans-code
-        nerd-fonts.caskaydia-cove
+  #       nerd-fonts.caskaydia-cove
-        nerd-fonts.noto
+  #       nerd-fonts.noto
-        noto-fonts-cjk-sans
+  #       noto-fonts-cjk-sans
-        noto-fonts-cjk-serif
+  #       noto-fonts-cjk-serif
-      ]
+  #     ]
-      ++ [
+  #     ++ [
-        (inputs.font-patcher.lib.patchFont {
+  #       (inputs.font-patcher.lib.patchFont {
-          font = "${pkgs.googlesans-code}/share/fonts/googlesans-code/GoogleSansCode[wght].ttf";
+  #         font = "${pkgs.googlesans-code}/share/fonts/googlesans-code/GoogleSansCode[wght].ttf";
-          name = "Google Sans Code Nerd Font";
+  #         name = "Google Sans Code Nerd Font";
-          inherit system;
+  #         inherit system;
-        })
+  #       })
-      ];
+  #     ];
-    fontDir.enable = true;
+  #   fontDir.enable = true;
-  };
+  # };
   boot.binfmt.emulatedSystems = [ "aarch64-linux" ];
   programs.nix-ld.enable = true;
   programs.nix-ld.libraries = with pkgs; [

modules/fonts/default.nix

@@ -0,0 +1,4 @@
+_: {
+  # home = ./home.nix;
+  nixos = ./nixos.nix;
+}

modules/fonts/nixos.nix

@@ -0,0 +1,38 @@
+{
+  inputs,
+  pkgs,
+  lib,
+  config,
+  ...
+}:
+let
+  cfg = config.modules.fonts;
+in
+{
+  options.modules.fonts = {
+    enable = lib.mkEnableOption "fonts";
+  };
+  config.fonts = lib.mkIf cfg.enable {
+    enableDefaultPackages = true;
+    packages =
+      with pkgs;
+      [
+        nerd-fonts.jetbrains-mono
+        material-design-icons
+        material-symbols
+        googlesans-code
+        nerd-fonts.caskaydia-cove
+        nerd-fonts.noto
+        noto-fonts-cjk-sans
+        noto-fonts-cjk-serif
+      ]
+      ++ [
+        (inputs.font-patcher.lib.patchFont {
+          font = "${pkgs.googlesans-code}/share/fonts/googlesans-code/GoogleSansCode[wght].ttf";
+          name = "Google Sans Code Nerd Font";
+          inherit system;
+        })
+      ];
+    fontDir.enable = true;
+  };
+}

modules/hyprland/home.nix

@@ -28,6 +28,7 @@ in
   ];
   options.modules.Hyprland = {
     enable = lib.mkEnableOption "Hyprland";
+    suspend-on-hibernate = lib.mkEnableOption "soh";
   };
   # TODO, split this into its own module;
   config = lib.mkIf cfg.enable {
@@ -44,22 +45,8 @@ in
       wlogout = {
         enable = true;
       };
-      foot = {
-        enable = true;
-        settings = {
-          main = {
-            term = "xterm-256color";
-
-            font = "Google Sans Code Nerd Font:size=11";
     };
-
+    systemd.user.services."hyprland_suspend" = lib.mkIf cfg.suspend-on-hibernate {
-          mouse = {
-            hide-when-typing = "yes";
-          };
-        };
-      };
-    };
-    systemd.user.services."hyprland_suspend" = {
       Unit = {
         Description = "Suspend hyprland";
         Before = [

modules/hyprland/runner.nix

@@ -1,15 +1,20 @@
 { inputs, pkgs, ... }:
 {
   home.packages = [
-    pkgs.walker
+    pkgs.hyprlauncher
   ];
-  systemd.user.services.walker-deamon = {
+  wayland.windowManager.hyprland.settings = {
+    bind = [
+      "$mainMod, R, exec, hyprlauncher"
+    ];
+  };
+  systemd.user.services.hyprlauncher-deamon = {
     Install = {
       WantedBy = [ "hyprland-session.target" ];
     };
     Service = {
       ExecStart = "${pkgs.writeShellScript "watch-store" ''
-        walker --gapplication-service
+        hyprlauncher -d 
       ''}";
     };
   };

modules/hyprland/screenshot.nix

@@ -8,5 +8,6 @@ in
     wayfreeze
     grim
     slurp
+    killall
   ];
 }

modules/hyprland/settings.nix

@@ -11,13 +11,6 @@
     hyprcursor.enable = true;
   };
   wayland.windowManager.hyprland.settings = {
-    monitor = [
-      "HDMI-A-1, 1920x1080@60, 0x0, 1"
-      "DP-3, 1920x1080@144, 1920x0, 1"
-    ];
-    exec-once = [
-      "hyprctl dispatch workspace 2" # shit solution to get quickshell on the right monitor
-    ];
     env = [
       "XCURSOR_THEME,BreezeX-RosePine-Linux"
       "XCURSOR_SIZE,24"
@@ -47,7 +40,10 @@
       };
 
       blur = {
-        enabled = false;
+        enabled = true;
+        passes = 1;
+        new_optimizations = true;
+        ignore_opacity = false;
       };
     };
     animations = {
@@ -92,11 +88,6 @@
       enable_anr_dialog = false;
       vfr = true;
     };
-    input = {
-      kb_layout = "gb";
-      follow_mouse = 2;
-      sensitivity = -0.5;
-    };
     "$mainMod" = "SUPER";
     bind = [
       "$mainMod, Q, exec, foot"
@@ -104,7 +95,6 @@
       "$mainMod, M, exit"
       "$mainMod, E, exec, $fileManager"
       "$mainMod, V, togglefloating,"
-      "$mainMod, R, exec, walker"
       "$mainMod, P, pseudo, # dwindle"
       "$mainMod, J, togglesplit, # dwindle"
       "$mainMod, left, movefocus, l"
@@ -141,9 +131,6 @@
       "$mainMod, mouse:272, movewindow"
       "$mainMod, mouse:273, resizewindow"
     ];
-    workspace = [
-      "name:2, monitor:DP-3"
-    ];
     windowrule = [
       "match:class .*, suppress_event maximize"
       "match:class ^(gamescope)$, workspace 5"

modules/kitty/default.nix

@@ -0,0 +1,4 @@
+_: {
+  nixos = ./nixos.nix;
+  home = ./home.nix;
+}

modules/kitty/home.nix

@@ -0,0 +1,46 @@
+{
+  config,
+  lib,
+  inputs,
+  pkgs,
+  home,
+  system,
+  ...
+}:
+let
+  cfg = config.modules.kitty;
+in
+{
+  options.modules.kitty = {
+    enable = lib.mkEnableOption "kitty configuration module";
+  };
+  config = lib.mkIf cfg.enable {
+    programs.kitty = {
+      enable = true;
+      font = {
+        name = "Google Sans Code Nerd Font";
+        size = 11;
+      };
+      settings = {
+        sync_to_monitor = "yes";
+        background_opacity = 0.6;
+        cursor_trail = 1;
+        ### Blur is handled in hyprland config ###
+        # enable_background_blur = "true";
+        # background_blur = 1;
+      };
+    };
+    ## i could use picom but i just used hyprland blur lol
+    # services.picom = {
+    #   # for cool gpu accelerated kitty effiect like blurred bg
+    #   enable = true;
+    #   backend = "glx";
+    #   activeOpacity = 0.5;
+    # };
+    wayland.windowManager.hyprland.settings = {
+      bind = [
+        "$mainMod, q, exec, kitty"
+      ];
+    };
+  };
+}

modules/kitty/nixos.nix

@@ -0,0 +1,19 @@
+{
+  config,
+  lib,
+  inputs,
+  pkgs,
+  home,
+  system,
+  ...
+}:
+let
+  cfg = config.modules.kitty;
+in
+{
+  options.modules.kitty = {
+    enable = lib.mkEnableOption "kitty configuration module";
+  };
+  config = lib.mkIf cfg.enable {
+  };
+}

modules/nixvim/home.nix

@@ -37,12 +37,17 @@ in
       configs = true;
     };
     plugins = {
+      todo-comments.enable = true;
       lsp-status.enable = true;
+      transparent.enable = true;
       lsp = {
         enable = true;
         servers = {
           qmlls = {
             enable = true;
+            config = {
+              cmd = "-E";
+            };
           };
           rust_analyzer = {
             enable = true;
@@ -57,6 +62,10 @@ in
           };
         };
       };
+      lsp-format = {
+        enable = true;
+        # lspServersToEnable = [ "qmlls" ];
+      };
       notify.enable = true;
       mini-cursorword.enable = true;
       # mini-statusline.enable = true;

modules/obs/home.nix

@@ -11,6 +11,7 @@ in
 {
   options.modules.obs = {
     enable = lib.mkEnableOption "obs";
+    autostart = lib.mkEnableOption "autostart with reply";
   };
   config = lib.mkIf cfg.enable {
     programs = {
@@ -49,7 +50,7 @@ in
           			''}";
       };
     };
-    systemd.user.services.obs-autostart = lib.mkIf cfg.enable {
+    systemd.user.services.obs-autostart = lib.mkIf cfg.autostart {
       Unit = {
         Description = "OBS daemon";
         After = [ "hyprland-session.target" ];

modules/quickshell/home.nix

@@ -17,7 +17,7 @@ in
   };
   config.xdg.configFile."quickshell" = lib.mkIf cfg.enable {
     recursive = true;
-    source = config.lib.file.mkOutOfStoreSymlink "${nix-meow.flakeRoot}/modules/quickshell/quickshell";
+    source = config.lib.file.mkOutOfStoreSymlink /home/doloro/dotfiles/modules/quickshell/quickshell;
   };
   config.systemd.user.services.quickshell = lib.mkIf cfg.enable {
     Unit = {

modules/quickshell/quickshell/assets/bar/Mic.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M480-420q-41.92 0-70.96-29.04Q380-478.08 380-520v-240q0-41.92 29.04-70.96Q438.08-860 480-860q41.92 0 70.96 29.04Q580-801.92 580-760v240q0 41.92-29.04 70.96Q521.92-420 480-420Zm-30 290v-131.85q-99-11.31-164.5-84.92Q220-420.39 220-520h60q0 83 58.5 141.5T480-320q83 0 141.5-58.5T680-520h60q0 99.61-65.5 173.23Q609-273.16 510-261.85V-130h-60Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="M479.93-379q-56.47 0-95.94-40.01-39.47-40.02-39.47-96.47v-232.04q0-56.45 39.53-95.97Q423.59-883 480.07-883q56.47 0 95.94 39.51 39.47 39.52 39.47 95.97v232.04q0 56.45-39.53 96.47Q536.41-379 479.93-379ZM434.02-93.52v-124.76q-111.11-14.13-183.26-99.16-72.15-85.03-72.15-198.04h92.52q0 87.09 61.13 147.98 61.13 60.89 147.85 60.89 86.73 0 147.75-61.09 61.01-61.1 61.01-147.78h92.52q0 113.24-72.15 198.16-72.15 84.91-183.26 99.04v124.76h-91.96Z"/></svg>

modules/quickshell/quickshell/assets/bar/MutedMic.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#EA3323"><path d="m710-362-58-58q14-23 21-48t7-52h80q0 44-13 83.5T710-362ZM592-482 360-714v-46q0-50 35-85t85-35q50 0 85 35t35 85v240q0 11-2.5 20t-5.5 18ZM440-120v-124q-104-14-172-92.5T200-520h80q0 83 58.5 141.5T480-320q34 0 64.5-10.5T600-360l57 57q-29 23-63.5 38.5T520-244v124h-80Zm352 64L56-792l56-56 736 736-56 56Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="m735.55-357.02-68.57-68.7q11.17-19.04 16.48-41.43 5.3-22.39 5.3-48.33h91.96q0 42.93-11.12 83.44-11.12 40.52-34.05 75.02ZM610.07-482.37 348.93-744v-31.22q7.35-44.11 43.99-75.94Q429.57-883 479.33-883q56.54 0 96.29 39.47 39.75 39.46 39.75 96.01v232.04q0 8.87-1.43 17.87-1.44 9-3.87 15.24ZM433.35-93.52v-124.7q-111.11-14.13-183.26-99.02-72.16-84.9-72.16-198.24h92.53q0 87.09 61.01 147.98 61.01 60.89 147.86 60.89 39.08 0 74.11-13.59 35.02-13.59 62.28-37.58l67 67q-31.89 29.15-71.76 47.9-39.87 18.74-85.66 24.83v124.53h-91.95Zm351.82 20.5-723.5-723.5 57.66-57.65 723 723-57.16 58.15Z"/></svg>

modules/quickshell/quickshell/assets/bar/MutedSpeaker.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#EA3323"><path d="M792-56 671-177q-25 16-53 27.5T560-131v-82q14-5 27.5-10t25.5-12L480-368v208L280-360H120v-240h128L56-792l56-56 736 736-56 56Zm-8-232-58-58q17-31 25.5-65t8.5-70q0-94-55-168T560-749v-82q124 28 202 125.5T840-481q0 53-14.5 102T784-288ZM650-422l-90-90v-130q47 22 73.5 66t26.5 96q0 15-2.5 29.5T650-422ZM480-592 376-696l104-104v208Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="M790.15-48.91 666.02-174.17q-20.24 12.24-43.19 21.57-22.96 9.34-48.2 14.71v-86.61q7.98-2.8 15.49-5.61 7.51-2.8 15.12-6.54L499.63-343.39v215.17L281.06-346.78h-166.3v-266.44h120.13l-187.61-191 58.65-58.65 743.44 754.74-59.22 59.22Zm-.3-238.87-60.72-61.85q17-29.44 25.75-62.4 8.75-32.97 8.75-68.47 0-88.43-52.56-158.65-52.57-70.22-136.44-97.35v-86.61q119.89 28.57 196.47 123.89 76.58 95.33 76.58 218.72 0 53.76-15.1 102.14t-42.73 90.58ZM669.41-409.91l-94.78-95.92v-137.95q48.76 22.13 79.9 65.79 31.15 43.66 31.15 97.99 0 19.2-4.07 36.61t-12.2 33.48ZM499.63-582.52 376.41-708.57l123.22-123.21v249.26Z"/></svg>

modules/quickshell/quickshell/assets/bar/Speaker.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M561.54-155.62v-62q86.54-27.53 139.42-100 52.89-72.46 52.89-163.38t-52.89-163.38q-52.88-72.47-139.42-100v-62q111.69 29.92 182 119.92 70.3 90 70.3 205.46 0 115.46-70.3 205.46-70.31 90-182 119.92ZM146.16-380v-200h148.46l171.53-171.53v543.06L294.62-380H146.16Zm415.38 46.15v-294.3q40.46 22 62.54 61.96 22.07 39.96 22.07 86.19 0 45.61-22.27 84.88-22.27 39.27-62.34 61.27Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="M565.7-158.89v-79.61q80.43-24.13 130.71-90.85 50.29-66.72 50.29-150.15t-50.79-149.15q-50.78-65.72-130.21-92.85v-79.61q111.89 25.57 184.18 115.64 72.3 90.08 72.3 204.97t-71.8 205.47q-71.79 90.57-184.68 116.14ZM137.82-371.78v-218.44h150.31L498.7-800.78v639.56L288.13-371.78H137.82Zm427.88 44.56v-306.56q46.76 20.69 76.62 61.07 29.86 40.38 29.86 91.71 0 51.83-29.86 92.24t-76.62 61.54Z"/></svg>

modules/quickshell/quickshell/assets/bar/V2/mic.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="M479.93-379q-56.47 0-95.94-40.01-39.47-40.02-39.47-96.47v-232.04q0-56.45 39.53-95.97Q423.59-883 480.07-883q56.47 0 95.94 39.51 39.47 39.52 39.47 95.97v232.04q0 56.45-39.53 96.47Q536.41-379 479.93-379ZM434.02-93.52v-124.76q-111.11-14.13-183.26-99.16-72.15-85.03-72.15-198.04h92.52q0 87.09 61.13 147.98 61.13 60.89 147.85 60.89 86.73 0 147.75-61.09 61.01-61.1 61.01-147.78h92.52q0 113.24-72.15 198.16-72.15 84.91-183.26 99.04v124.76h-91.96Z"/></svg>

modules/quickshell/quickshell/assets/bar/V2/micOff.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="m735.55-357.02-68.57-68.7q11.17-19.04 16.48-41.43 5.3-22.39 5.3-48.33h91.96q0 42.93-11.12 83.44-11.12 40.52-34.05 75.02ZM610.07-482.37 348.93-744v-31.22q7.35-44.11 43.99-75.94Q429.57-883 479.33-883q56.54 0 96.29 39.47 39.75 39.46 39.75 96.01v232.04q0 8.87-1.43 17.87-1.44 9-3.87 15.24ZM433.35-93.52v-124.7q-111.11-14.13-183.26-99.02-72.16-84.9-72.16-198.24h92.53q0 87.09 61.01 147.98 61.01 60.89 147.86 60.89 39.08 0 74.11-13.59 35.02-13.59 62.28-37.58l67 67q-31.89 29.15-71.76 47.9-39.87 18.74-85.66 24.83v124.53h-91.95Zm351.82 20.5-723.5-723.5 57.66-57.65 723 723-57.16 58.15Z"/></svg>

modules/quickshell/quickshell/assets/bar/V2/speaker.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="M565.7-158.89v-79.61q80.43-24.13 130.71-90.85 50.29-66.72 50.29-150.15t-50.79-149.15q-50.78-65.72-130.21-92.85v-79.61q111.89 25.57 184.18 115.64 72.3 90.08 72.3 204.97t-71.8 205.47q-71.79 90.57-184.68 116.14ZM137.82-371.78v-218.44h150.31L498.7-800.78v639.56L288.13-371.78H137.82Zm427.88 44.56v-306.56q46.76 20.69 76.62 61.07 29.86 40.38 29.86 91.71 0 51.83-29.86 92.24t-76.62 61.54Z"/></svg>

modules/quickshell/quickshell/assets/bar/V2/speakerOff.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="M790.15-48.91 666.02-174.17q-20.24 12.24-43.19 21.57-22.96 9.34-48.2 14.71v-86.61q7.98-2.8 15.49-5.61 7.51-2.8 15.12-6.54L499.63-343.39v215.17L281.06-346.78h-166.3v-266.44h120.13l-187.61-191 58.65-58.65 743.44 754.74-59.22 59.22Zm-.3-238.87-60.72-61.85q17-29.44 25.75-62.4 8.75-32.97 8.75-68.47 0-88.43-52.56-158.65-52.57-70.22-136.44-97.35v-86.61q119.89 28.57 196.47 123.89 76.58 95.33 76.58 218.72 0 53.76-15.1 102.14t-42.73 90.58ZM669.41-409.91l-94.78-95.92v-137.95q48.76 22.13 79.9 65.79 31.15 43.66 31.15 97.99 0 19.2-4.07 36.61t-12.2 33.48ZM499.63-582.52 376.41-708.57l123.22-123.21v249.26Z"/></svg>

modules/quickshell/quickshell/assets/bar/batt/1.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M159.28-231.87q-53.58 0-91.21-37.63-37.64-37.63-37.64-91.22v-238.8q0-53.59 37.64-91.1 37.63-37.51 91.21-37.51h530.68q53.58 0 91.09 37.51 37.52 37.51 37.52 91.1v238.8q0 53.59-37.52 91.22-37.51 37.63-91.09 37.63H159.28Zm.24-91h530.2q16.04 0 26.94-11.02 10.9-11.02 10.9-27.07v-238.32q0-16.05-10.9-26.95-10.9-10.9-26.94-10.9h-530.2q-16.04 0-27.06 10.9-11.03 10.9-11.03 26.95v238.32q0 16.05 11.03 27.07 11.02 11.02 27.06 11.02Zm699.05-53.06v-208.14h25.5q19.15 0 32.32 13.18 13.18 13.17 13.18 32.32v117.14q0 19.15-13.18 32.32-13.17 13.18-32.32 13.18h-25.5Zm-697.14 13.06v-234.26h86.22v234.26h-86.22Z"/></svg>

modules/quickshell/quickshell/assets/bar/batt/2.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M159.28-231.87q-53.58 0-91.21-37.63-37.64-37.63-37.64-91.22v-238.8q0-53.59 37.64-91.1 37.63-37.51 91.21-37.51h530.68q53.58 0 91.09 37.51 37.52 37.51 37.52 91.1v238.8q0 53.59-37.52 91.22-37.51 37.63-91.09 37.63H159.28Zm.24-91h530.2q16.04 0 26.94-11.02 10.9-11.02 10.9-27.07v-238.32q0-16.05-10.9-26.95-10.9-10.9-26.94-10.9h-530.2q-16.04 0-27.06 10.9-11.03 10.9-11.03 26.95v238.32q0 16.05 11.03 27.07 11.02 11.02 27.06 11.02Zm699.05-53.06v-208.14h25.5q19.15 0 32.32 13.18 13.18 13.17 13.18 32.32v117.14q0 19.15-13.18 32.32-13.17 13.18-32.32 13.18h-25.5Zm-697.14 13.06v-234.26h163.83v234.26H161.43Z"/></svg>

modules/quickshell/quickshell/assets/bar/batt/3.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M159.28-231.87q-53.58 0-91.21-37.63-37.64-37.63-37.64-91.22v-238.8q0-53.59 37.64-91.1 37.63-37.51 91.21-37.51h530.68q53.58 0 91.09 37.51 37.52 37.51 37.52 91.1v238.8q0 53.59-37.52 91.22-37.51 37.63-91.09 37.63H159.28Zm.24-91h530.2q16.04 0 26.94-11.02 10.9-11.02 10.9-27.07v-238.32q0-16.05-11.02-26.95-11.02-10.9-27.06-10.9h-530.2q-16.04 0-26.94 11.02-10.91 11.02-10.91 27.07v238.32q0 16.05 11.03 26.95 11.02 10.9 27.06 10.9Zm699.05-53.06v-208.14h25.5q19.15 0 32.32 13.18 13.18 13.17 13.18 32.32v117.14q0 19.15-13.18 32.32-13.17 13.18-32.32 13.18h-25.5Zm-697.14 13.06v-234.26h241.44v234.26H161.43Z"/></svg>

modules/quickshell/quickshell/assets/bar/batt/4.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M159.28-231.87q-53.58 0-91.21-37.63-37.64-37.63-37.64-91.22v-238.8q0-53.59 37.64-91.1 37.63-37.51 91.21-37.51h530.68q53.58 0 91.09 37.51 37.52 37.51 37.52 91.1v238.8q0 53.59-37.52 91.22-37.51 37.63-91.09 37.63H159.28Zm.24-91h530.2q16.04 0 26.94-11.02 10.9-11.02 10.9-27.07v-238.32q0-16.05-10.9-26.95-10.9-10.9-26.94-10.9h-530.2q-16.04 0-27.06 10.9-11.03 10.9-11.03 26.95v238.32q0 16.05 11.03 27.07 11.02 11.02 27.06 11.02Zm699.05-53.06v-208.14h25.5q19.15 0 32.32 13.18 13.18 13.17 13.18 32.32v117.14q0 19.15-13.18 32.32-13.17 13.18-32.32 13.18h-25.5Zm-697.14 13.06v-234.26h321.44v234.26H161.43Z"/></svg>

modules/quickshell/quickshell/assets/bar/batt/5.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M159.28-231.87q-53.58 0-91.21-37.63-37.64-37.63-37.64-91.22v-238.8q0-53.59 37.64-91.1 37.63-37.51 91.21-37.51h530.68q53.58 0 91.09 37.51 37.52 37.51 37.52 91.1v238.8q0 53.59-37.52 91.22-37.51 37.63-91.09 37.63H159.28Zm.24-91h530.2q16.04 0 26.94-11.02 10.9-11.02 10.9-27.07v-238.32q0-16.05-10.9-26.95-10.9-10.9-26.94-10.9h-530.2q-16.04 0-27.06 10.9-11.03 10.9-11.03 26.95v238.32q0 16.05 11.03 27.07 11.02 11.02 27.06 11.02Zm699.05-53.06v-208.14h25.5q19.15 0 32.32 13.18 13.18 13.17 13.18 32.32v117.14q0 19.15-13.18 32.32-13.17 13.18-32.32 13.18h-25.5Zm-697.14 13.06v-234.26h401.44v234.26H161.43Z"/></svg>

modules/quickshell/quickshell/assets/bar/batt/6.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M159.28-231.87q-53.58 0-91.21-37.63-37.64-37.63-37.64-91.22v-238.8q0-53.59 37.64-91.1 37.63-37.51 91.21-37.51h530.68q53.58 0 91.09 37.51 37.52 37.51 37.52 91.1v238.8q0 53.59-37.52 91.22-37.51 37.63-91.09 37.63H159.28Zm.24-91h530.2q16.04 0 26.94-11.02 10.9-11.02 10.9-27.07v-238.32q0-16.05-10.9-26.95-10.9-10.9-26.94-10.9h-530.2q-16.04 0-27.06 10.9-11.03 10.9-11.03 26.95v238.32q0 16.05 11.03 27.07 11.02 11.02 27.06 11.02Zm699.05-53.06v-208.14h25.5q19.15 0 32.32 13.18 13.18 13.17 13.18 32.32v117.14q0 19.15-13.18 32.32-13.17 13.18-32.32 13.18h-25.5Zm-697.14 13.06v-234.26h470.68v234.26H161.43Z"/></svg>

modules/quickshell/quickshell/assets/bar/batt/7.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M159.28-231.87q-53.58 0-91.21-37.63-37.64-37.63-37.64-91.22v-238.8q0-53.59 37.64-91.1 37.63-37.51 91.21-37.51h530.68q53.58 0 91.09 37.51 37.52 37.51 37.52 91.1v238.8q0 53.59-37.52 91.22-37.51 37.63-91.09 37.63H159.28Zm.24-91h530.2q16.04 0 26.94-11.02 10.9-11.02 10.9-27.07v-238.32q0-16.05-10.9-26.95-10.9-10.9-26.94-10.9h-530.2q-16.04 0-27.06 10.9-11.03 10.9-11.03 26.95v238.32q0 16.05 11.03 27.07 11.02 11.02 27.06 11.02Zm699.05-53.06v-208.14h25.5q19.15 0 32.32 13.18 13.18 13.17 13.18 32.32v117.14q0 19.15-13.18 32.32-13.17 13.18-32.32 13.18h-25.5Zm-697.14 13.06v-234.26h526.13v234.26H161.43Z"/></svg>

modules/quickshell/quickshell/bar/Bar.qml

@@ -12,65 +12,50 @@ import "widgets/common" as Common
 import "widgets/clock" as Clock
 import "widgets/workspace" as Workspace
 
-// Tako kindly threatened you to sort the naming schema and to put all the svg's in an asset folder, so please do that
-
 PanelWindow {
     property var modelData
-            screen: modelData.values[0];
+    screen: modelData.values[0]
 
-            color: '#20ffffff'
+    color: Common.Colors.colors.mainBackground
     anchors {
         top: true
         left: true
         right: true
     }
 
-        implicitHeight: 32
+    implicitHeight: 31
     RowLayout {
-            height: 28
+        height: 30
         anchors {
             top: parent.top
             left: parent.left
             right: parent.right
             // bottomMargin: 2
-                leftMargin: 10
+            leftMargin: 5
-                rightMargin: 10
+            rightMargin: 5
-            }
-            RowLayout { // Left
-                Layout.alignment: Qt.AlignLeft
-                Clock.Date {}
-                Clock.Clock {}
-                Workspace.WorkspaceWidget {}
-            }
-            RowLayout { // Center
-                // TODO: add icons of the active window per workspace in the workspace tab
-                anchors.centerIn: parent
-            }
-            RowLayout { // Right
-                Layout.alignment: Qt.AlignRight
-                Loader {
-                    sourceComponent: Widgets.Audio {}
         }
         RowLayout {
-                    Text {
+            // Left
-                        text: HyprlandWindowTracker.HyprlandWindowTracker.aaaa
+            Layout.alignment: Qt.AlignLeft
+            Widgets.Workspaces {}
         }
-                    visible: Player.activePlayer.isPlaying()
+        RowLayout {
-                    Player.PlayerWidgetV2 {
+            // Center
+            Layout.alignment: Qt.AlignCenter
+        }
+        RowLayout {
+            // Right
+            Layout.alignment: Qt.AlignRight
+            Widgets.Demo {}
         }
     }
-                    Widgets.SystemTray {
+    // Rectangle {
-                        id: systemTray
+    //     anchors {
-                    }
+    //         bottom: parent.bottom
-            }
+    //         left: parent.left
-        }
+    //         right: parent.right
-        Rectangle {
+    //     }
-            anchors {
+    //     height: 1
-                bottom: parent.bottom
+    //     color: "#8d8d8d"
-                left: parent.left
+    // }
-                right: parent.right
-            }
-            height: 1
-            color: "#8d8d8d"
-        }
 }

modules/quickshell/quickshell/bar/widgets/Audio.qml

@@ -4,56 +4,55 @@ import QtQuick
 import QtQuick.Layouts
 import Quickshell.Widgets
 import Quickshell.Services.Pipewire
+import QtQuick.VectorImage
+import QtQuick.Effects
+import QtQuick.Shapes 1.10
+import QtQuick.Effects
 import "common" as Common
 
-
+Rectangle {
-Item {
     id: root
     property PwNode speakerNode: Pipewire.defaultAudioSink
     property PwNode microphoneNode: Pipewire.defaultAudioSource
-    PwObjectTracker { objects: [ root.microphoneNode, root.speakerNode ] }
+    PwObjectTracker {
-
+        objects: [root.microphoneNode, root.speakerNode]
-    width: row.width
+    }
-    height: row.height
+    implicitWidth: itemContent.width + 8
-
+    implicitHeight: 24
-    // console.log("a");
+    radius: 5.5
-
+    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+    color: Common.Colors.colors.secondary // Define item color
+		// color: "#2a2a2a"
     RowLayout {
-        id: row
+        id: itemContent
-        Item {
-            implicitWidth: 28
-            implicitHeight: 28
-            Rectangle {
-                width: parent.width
-                height: parent.height
-                radius: 7
-                color: "black"
-            }
-            Text {
 				anchors.centerIn: parent
-                // implicitSize: 25
+				// spacing: 100
-                font.pixelSize: 28
+        Repeater {
-                color: root.speakerNode.audio.muted ? "#FF474C" : "white"
+            model: [
-                font.family: "CaskaydiaCove Nerd Font Mono"
+                {
-                text: root.speakerNode.audio.muted ? Common.Icons.audioIcons.speakerMuted : Common.Icons.audioIcons.speaker
+                    on: Common.Icons.audioIcons["speaker"],
-            }
+                    off: Common.Icons.audioIcons["speakerMuted"],
-        }
+                    node: root.speakerNode
+                },
+                {
+                    on: Common.Icons.audioIcons["microphone"],
+                    off: Common.Icons.audioIcons["microphoneMuted"],
+                    node: root.microphoneNode
+                },
+            ]
             Item {
-            implicitWidth: 28
+							id: meow
-            implicitHeight: 28
+                implicitWidth: 24
-            Rectangle {
+								Layout.alignment: Qt.AlignHCenter
-                width: parent.width
+                implicitHeight: 24
-                height: parent.height
-                radius: 7
-                color: "black"
-            }
 								Text {
-                anchors.centerIn: parent
+									id: textElement
-                // implicitSize: 25
+									anchors.centerIn: parent // Ensure the text fills the parent item
-                font.pixelSize: 34
+									text: modelData.node.audio.muted ? modelData.off : modelData.on
-                color: root.microphoneNode.audio.muted ? "#FF474C" : "white"
+									font.pointSize: 18.25
-                font.family: "CaskaydiaCove Nerd Font Mono"
+									font.weight: Font.DemiBold
-                text: root.microphoneNode.audio.muted ? Common.Icons.audioIcons.microphoneMuted : Common.Icons.audioIcons.microphone
+									color: modelData.node.audio.muted ? Common.Colors.colors.critial2 : Common.Colors.colors.primary
+								}
             }
         }
     }

modules/quickshell/quickshell/bar/widgets/Battery.qml

@@ -0,0 +1,76 @@
+import Quickshell
+import Quickshell.Io
+import QtQuick
+import QtQuick.Layouts
+import Quickshell.Widgets
+import Quickshell.Services.Pipewire
+import QtQuick.VectorImage
+import QtQuick.Effects
+import Quickshell.Services.UPower
+import "common" as Common
+
+Rectangle {
+	// TODO eventually fix the alignment (it isnt centered horizentally)
+    id: root
+    property int battPercent: 58
+    implicitWidth: itemContent.width + 8
+    implicitHeight: 24
+		visible: {if (UPower.displayDevice.ready) { true } else {false}}
+    radius: 5.5
+    Layout.alignment: Qt.AlignVCenter
+    color: "#2a2a2a" // Define item color
+    RowLayout {
+        id: itemContent
+        implicitWidth: 24
+        implicitHeight: 24
+        anchors.centerIn: parent
+				Text {
+					// anchors.centerIn: parent
+					text: UPower.displayDevice.percentage + "%"
+					color: Common.Colors.colors.primary
+					font.weight: Font.DemiBold
+					font.pointSize: 12
+				}
+				Item {
+					Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+					Text {
+						anchors.centerIn: parent
+						text: root.getBatteryState(UPower.displayDevice.percentage, (UPower.displayDevice.changeRate > 0))
+						color: root.getBatteryColor(UPower.displayDevice.percentage)
+						font.weight: Font.DemiBold
+						font.pointSize: 24/1.4
+				}
+			}
+    }
+function getBatteryState(level, isCharging) {
+    if (level === null || level === 0) {
+        // Return the battery empty icon
+        return isCharging ? Common.Icons.battery.charging["1"] : Common.Icons.battery["0"];
+    }
+
+    if (level === 100) {
+        // Return the battery full icon
+        return isCharging ? Common.Icons.battery.charging["10"] : Common.Icons.battery["10"];
+    }
+
+    // Calculate step as a value between 1 and 10 (divide level into 10 ranges)
+    let step = Math.ceil(level / 10); // Range mapping
+    if (step > 10) step = 10; // Clamp to 10 if it exceeds bounds
+
+    // Return the correct icon based on state
+    return isCharging ? Common.Icons.battery.charging[String(step)] : Common.Icons.battery[String(step)];
+}
+function getBatteryColor(level) {
+    if (level === null || level === 0) {
+        // Use critical color for empty battery
+        return Common.Colors.colors.critial2;
+    }
+
+    if (level > 0 && level <= 20) {
+        // Use critical color for low battery
+        return Common.Colors.colors.critial2;
+    }
+    // Default color if no specific condition is met
+    return Common.Colors.colors.primary;
+}
+}

modules/quickshell/quickshell/bar/widgets/Demo.qml

@@ -0,0 +1,41 @@
+import Quickshell
+import Quickshell.Io
+import QtQuick
+import QtQuick.Layouts
+import Quickshell.Widgets
+import Quickshell.Services.Pipewire
+import "common" as Common
+import "clock" as Clock
+
+Rectangle {
+    id: backgroundRect
+    implicitWidth: rowLayout.implicitWidth + 6 // Account for padding (2px left + 2px right)
+    implicitHeight: rowLayout.implicitHeight + 4 // Account for padding (2px top + 2px bottom)
+    color: Common.Colors.colors.background
+    radius: 6.5 // Background rectangle with rounded corners
+    // border.color: "gray"
+    // border.width: 1
+
+    // Inner Rectangle for padding and layout
+    Rectangle {
+        id: content
+        anchors.fill: parent
+        anchors.margins: 2 // Create 2px padding on all sides
+        anchors.leftMargin: 3
+        anchors.rightMargin: 3
+        color: "transparent"
+
+        RowLayout {
+            id: rowLayout
+            anchors.fill: parent
+            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter // Center content
+            spacing: 10 // Space between items
+
+            Audio {}
+            Battery {}
+						Common.VerticalSeprator {}
+            Clock.Date {}
+            Clock.Clock {}
+        }
+    }
+}

modules/quickshell/quickshell/bar/widgets/V2/Audio.qml

@@ -0,0 +1,59 @@
+import Quickshell
+import Quickshell.Io
+import QtQuick
+import QtQuick.Layouts
+import Quickshell.Widgets
+import Quickshell.Services.Pipewire
+import "common" as Common
+
+Item {
+    id: root
+    property PwNode speakerNode: Pipewire.defaultAudioSink
+    property PwNode microphoneNode: Pipewire.defaultAudioSource
+    PwObjectTracker {
+        objects: [root.microphoneNode, root.speakerNode]
+    }
+
+    width: row.width
+    height: row.height
+
+    // console.log("a");
+
+    RowLayout {
+        id: row
+        Item {
+            implicitWidth: 28
+            implicitHeight: 28
+            Rectangle {
+                width: parent.width
+                height: parent.height
+                radius: 7
+                color: "black"
+            }
+            Text {
+                anchors.centerIn: parent
+                font.pixelSize: 28
+                color: root.speakerNode.audio.muted ? "#B1B2B5" : "white"
+                font.family: "CaskaydiaCove Nerd Font Mono"
+                text: root.speakerNode.audio.muted ? Common.Icons.audioIcons.speakerMuted : Common.Icons.audioIcons.speaker
+            }
+        }
+        Item {
+            implicitWidth: 28
+            implicitHeight: 28
+            Rectangle {
+                width: parent.width
+                height: parent.height
+                radius: 7
+                color: "black"
+            }
+            Text {
+                anchors.centerIn: parent
+                font.pixelSize: 34
+                color: root.microphoneNode.audio.muted ? "#B1B2B5" : "white"
+                font.family: "CaskaydiaCove Nerd Font Mono"
+                text: root.microphoneNode.audio.muted ? Common.Icons.audioIcons.microphoneMuted : Common.Icons.audioIcons.microphone
+            }
+        }
+    }
+}

modules/quickshell/quickshell/bar/widgets/Wireless.qml

@@ -0,0 +1,58 @@
+import Quickshell
+import Quickshell.Io
+import QtQuick
+import QtQuick.Layouts
+import Quickshell.Widgets
+import Quickshell.Services.Pipewire
+import QtQuick.VectorImage
+import QtQuick.Effects
+import "common" as Common
+
+Rectangle {
+    id: root
+    implicitWidth: itemContent.width + 4
+    implicitHeight: 24
+    radius: 5.5
+    Layout.alignment: Qt.AlignVCenter
+    color: "#2a2a2a" // Define item color
+    RowLayout {
+        id: itemContent
+        Repeater {
+            model: [
+                {
+                    on: "../../assets/bar/V2/speaker.svg",
+                    off: "../../assets/bar/V2/speakerOff.svg",
+                    node: root.speakerNode
+                },
+                {
+                    on: "../../assets/bar/V2/mic.svg",
+                    off: "../../assets/bar/V2/micOff.svg",
+                    node: root.microphoneNode
+                },
+            ]
+            Item {
+                implicitWidth: 24
+                implicitHeight: 24
+                // anchors.centerIn: parent
+                VectorImage {
+                    id: svgImage
+                    width: parent.width
+                    height: parent.height
+                    source: modelData.node.audio.muted ? modelData.off : modelData.on
+                    visible: false
+                    fillMode: Image.PreserveAspectFit // Adjusts the SVG while keeping the aspect ratio
+                }
+                MultiEffect {
+                    source: svgImage
+                    width: parent.width
+                    height: parent.height
+                    // anchors.centerIn: parent
+                    Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
+                    colorization: 1
+                    brightness: 1
+                    colorizationColor: modelData.node.audio.muted ? "#e53b3c" : "#b1b2b5"
+                }
+            }
+        }
+    }
+}

modules/quickshell/quickshell/bar/widgets/Workspaces.qml

@@ -36,7 +36,7 @@ RowLayout {
                         Hyprland.dispatch('workspace ' + index_workspace.id);
                     }
                     for (x in index_workspace.toplevels.values) {
-                        console.log(index_workspace.toplevels.values[x].title)
+                        console.log(index_workspace.toplevels.values[x].title);
                     }
                 }
             }

modules/quickshell/quickshell/bar/widgets/clock/Clock.qml

@@ -1,19 +1,28 @@
 import Quickshell
 import Quickshell.Io
 import QtQuick
+import QtQuick.Layouts
+import Quickshell.Widgets
+import Quickshell.Services.Pipewire
+import QtQuick.VectorImage
+import QtQuick.Effects
+import "common" as Common
 
-import "../common" as Common
+Rectangle {
-
-Item {
     id: root
-    width: text.width + 15
+    implicitWidth: clock.width + 4
-    height: text.height
+    implicitHeight: clock.height
-    Common.Container {}
+    radius: 5.5
+    color: "#2a2a2a" // Define item color
     Text {
+        id: clock
+        // width: parent.width - 4
+        height: 24
         anchors.centerIn: parent
-        id: text
+        verticalAlignment: Qt.AlignVCenter
         text: ClockData.time
-        font.pointSize: 10.25
+        font.pixelSize: 16
-        color: "white"
+        lineHeight: 1
+        color: "#cacaca"
     }
 }

modules/quickshell/quickshell/bar/widgets/clock/Date.qml

@@ -4,16 +4,21 @@ import QtQuick
 
 import "../common" as Common
 
-Item {
+Rectangle {
     id: root
-    width: text.width + 15
+    implicitWidth: clock.width + 4
-    height: text.height
+    implicitHeight: clock.height
-    Common.Container {}
+    radius: 5.5
+    color: "#2a2a2a" // Define item color
     Text {
+        id: clock
+        // width: parent.width - 4
+        height: 24
         anchors.centerIn: parent
-        id: text
+        verticalAlignment: Qt.AlignVCenter
         text: ClockData.date
-        font.pointSize: 10.25
+        font.pixelSize: 16
-        color: "white"
+        lineHeight: 1
+        color: "#cacaca"
     }
 }

modules/quickshell/quickshell/bar/widgets/common/ChildContainer.qml

@@ -0,0 +1,14 @@
+import Quickshell
+import QtQuick
+
+Rectangle {
+    z: 1
+    color: "#2a2a2a"
+    opacity: 20
+    anchors {
+        verticalCenter: parent.verticalCenter
+    }
+    height: 24
+    width: parent.width
+    radius: 5.5
+}

modules/quickshell/quickshell/bar/widgets/common/Colors.qml

@@ -6,7 +6,16 @@ import Quickshell.Io
 Singleton {
     id: root
 
+		// XX (alpha) XXXXXX (color)
+
+		// For oled screen that risk burn in, set up these colors as semi-transparent and have a rotating wallpaper (!!)
     readonly property var colors: ({
-        "primary": "",
+        primary: "#59b1b2b5", // Icons & Text colors
+				secondary: "#BF2a2a2a", // Pill container colors
+				background: "#BF000000", // Background of containers
+				mainBackground: "#20ffffff", // Color of the main bar
+				warning: "#E9D502", // (i.e battery nearing low)
+				critial: "#e53b3c", // (i.e battery is low)
+				critial2: "#e53b3c", // (Speaker and Mic being off)
     })
 }

modules/quickshell/quickshell/bar/widgets/common/Icons.qml

@@ -6,11 +6,43 @@ import Quickshell.Io
 Singleton {
     id: root
 
+    // readonly property var svgs: ({
+    //         micOff: "../../../assets/bar/V2/micOff.svg",
+    //         mic: "../../../assets/bar/V2/mic.svg",
+    //         speaker: "../../../assets/bar/V2/speaker.svg",
+    //         speakerOff: "../../../assets/bar/V2/speakerOff.svg"
+    //     })
+		readonly property var battery: ({
+			"0": "󰂎",
+			"1": "󰁺",
+			"2": "󰁻",
+			"3": "󰁼",
+			"4": "󰁾",
+			"5": "󰁾",
+			"6": "󰁿",
+			"7": "󰂀",
+			"8": "󰂁",
+			"9": "󰂂",
+			"10": "󰁹",
+			charging: ({
+				"1": "󰢜",
+				"2": "󰂆",
+				"3": "󰂇",
+				"4": "󰂈",
+				"5": "󰢝",
+				"6": "󰂉",
+				"7": "󰢞",
+				"8": "󰂊",
+				"9": "󰂋",
+				"10": "󰂅",
+			})
+		})
+
     readonly property var audioIcons: ({
-        microphone: "",
+            microphone: "󰍬",
-        microphoneMuted: "",
+            microphoneMuted: "󰍭",
             speaker: "󰕾",
-        speakerMuted: "󰖁",
+            speakerMuted: "󰖁"
         })
 
     // {class}: {icon}

modules/quickshell/quickshell/bar/widgets/common/ImageColorShader.qml

@@ -0,0 +1,30 @@
+// ColorOverlayShader.qml
+import QtQuick 2.15
+    Rectangle {
+        id: mainContent
+        anchors.fill: parent
+        color: "blue"
+
+        // Clip the rectangle to a shape
+        clip: true
+
+        Shape {
+            anchors.fill: parent
+
+            // Custom Path defined as a vector
+            Path {
+                PathSvg {
+                    path: "M10,80 C40,10 65,10 95,80 S150,150 180,80" // Vector path
+                }
+            }
+
+            ShapePath {
+                strokeColor: "transparent" // No stroke, act only as the mask
+                fillColor: "blue"
+                fillGradient: Gradient {
+                    GradientStop { position: 0.0; color: "yellow" }
+                    GradientStop { position: 1.0; color: "orange" }
+                }
+            }
+        }
+    }

modules/quickshell/quickshell/bar/widgets/common/ParentContainer.qml

@@ -0,0 +1,17 @@
+import Quickshell
+import QtQuick
+import QtQuick.Layouts
+
+Item {
+    RowLayout {
+        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+    }
+    Rectangle {
+        z: -1
+        color: "black"
+        // anchors: parent.anchors
+        height: 28
+        width: parent.width
+        radius: 6.5
+    }
+}

modules/quickshell/quickshell/bar/widgets/common/VerticalSeprator.qml

@@ -2,12 +2,16 @@ import Quickshell
 import QtQml
 import QtQuick
 
-    Rectangle {
+    Item {
-        id: a
+        id: root
         anchors {
             top: parent.top
             bottom: parent.bottom
         }
-        width: 2
+				Rectangle {
+					anchors.centerIn: root
+					implicitHeight: root.height - 4
+					width: 1
 					color: "#8d8d8d"
 				}
+    }