Merge pull request 'home: themeing-updates' (#40) from themeing-updates into master

Reviewed-on: #40

home/programs/ags/config/.eslintrc.js

@@ -3,7 +3,7 @@ module.exports = {
     browser: true,
     es2021: true
   },
-  extends: "eslint:recommended",
+  extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
   overrides: [
     {
       env: {
@@ -15,9 +15,11 @@ module.exports = {
       }
     }
   ],
+  parser: "@typescript-eslint/parser",
   parserOptions: {
     ecmaVersion: "latest",
     sourceType: "module"
   },
+  plugins: ["@typescript-eslint"],
   rules: {}
 };

home/programs/ags/config/config.js

@@ -1,21 +1,21 @@
-import { App, Utils } from "./import.js";
+const entry = App.configDir + "/ts/main.ts";
-import { Bar } from "./js/main.js";
+const outdir = "/tmp/ags/js";
 
-const scss = App.configDir + "/main.scss";
+try {
-const css = App.configDir + "/style.css";
+  await Utils.execAsync([
-
+    "bun",
-Utils.exec(`sass ${scss} ${css}`);
+    "build",
-
+    entry,
-function reloadCss() {
+    "--outdir",
-  console.log("scss updating");
+    outdir,
-  Utils.exec(`sass ${scss} ${css}`);
+    "--external",
-  App.resetCss();
+    "resource://*",
-  App.applyCss(css);
+    "--external",
+    "gi://*"
+  ]);
+  await import(`file://${outdir}/main.js`);
+} catch (error) {
+  console.error(error);
 }
 
-Utils.monitorFile(`${App.configDir}/scss`, reloadCss, "directory");
+export {};
-
-export default {
-  style: css,
-  windows: [Bar(2)]
-};

home/programs/ags/config/import.js

@@ -1,23 +0,0 @@
-import App from "resource:///com/github/Aylur/ags/app.js";
-import * as Utils from "resource:///com/github/Aylur/ags/utils.js";
-import Service from "resource:///com/github/Aylur/ags/service.js";
-import Variable from "resource:///com/github/Aylur/ags/variable.js";
-import Widget from "resource:///com/github/Aylur/ags/widget.js";
-import Audio from "resource:///com/github/Aylur/ags/service/audio.js";
-import Hyprland from "resource:///com/github/Aylur/ags/service/hyprland.js";
-import Network from "resource:///com/github/Aylur/ags/service/network.js";
-import SystemTray from "resource:///com/github/Aylur/ags/service/systemtray.js";
-import Mpris from "resource:///com/github/Aylur/ags/service/mpris.js";
-
-export {
-  App,
-  Audio,
-  Hyprland,
-  Mpris,
-  Network,
-  Service,
-  SystemTray,
-  Utils,
-  Variable,
-  Widget
-};

home/programs/ags/config/js/main.js

@@ -1,35 +0,0 @@
-import { Widget } from "../import.js";
-import { Time } from "./widgets/time.js";
-import { nixosLogo } from "./widgets/images/image.js";
-import { Media } from "./widgets/music.js";
-import { Workspaces } from "./widgets/hyprland.js";
-
-const Start = () =>
-  Widget.Box({
-    hpack: "start",
-    children: [nixosLogo(), Workspaces()]
-  });
-const Center = () =>
-  Widget.Box({
-    children: [Media()]
-  });
-const End = () =>
-  Widget.Box({
-    hpack: "end",
-    children: [Time()]
-  });
-
-const Bar = (monitor) =>
-  Widget.Window({
-    monitor,
-    name: `bar`,
-    anchor: ["top", "left", "right"],
-    exclusivity: "exclusive",
-    child: Widget.CenterBox({
-      startWidget: Start(),
-      centerWidget: Center(),
-      endWidget: End()
-    })
-  });
-
-export { Bar };

home/programs/ags/config/js/widgets/hyprland.js

@@ -1,19 +0,0 @@
-import { Hyprland, Widget } from "../../import.js";
-
-const Workspaces = () =>
-  Widget.Box({
-    class_name: "workspaces",
-    children: Hyprland.bind("workspaces").transform((ws) => {
-      return ws.map(({ id }) =>
-        Widget.Button({
-          on_clicked: () => Hyprland.sendMessage(`dispatch workspace ${id}`),
-          child: Widget.Label(`${id}`),
-          class_name: Hyprland.active.workspace
-            .bind("id")
-            .transform((i) => `${i === id ? "focused" : ""}`)
-        })
-      );
-    })
-  });
-
-export { Workspaces };

home/programs/ags/config/js/widgets/images/image.js

@@ -1,8 +0,0 @@
-import { Widget } from "../../../import.js";
-
-const nixosLogo = () =>
-  Widget.Icon({
-    icon: "/home/notoh/snowflake/home/programs/ags/config/js/widgets/images/static/nixos.png"
-  });
-
-export { nixosLogo };

home/programs/ags/config/js/widgets/music.js

@@ -1,20 +0,0 @@
-import { Mpris, Widget } from "../../import.js";
-
-const Media = () =>
-  Widget.Box({
-    class_name: "media",
-    child: Widget.Label("-").hook(
-      Mpris,
-      (self) => {
-        if (Mpris.players[0]) {
-          const { track_artists, track_title } = Mpris.players[0];
-          self.label = `${track_artists.join(", ")} - ${track_title}`;
-        } else {
-          self.label = "Nothing is playing";
-        }
-      },
-      "player-changed"
-    )
-  });
-
-export { Media };

home/programs/ags/config/js/widgets/time.js

@@ -1,14 +0,0 @@
-import { Utils, Widget } from "../../import.js";
-
-const Time = () =>
-  Widget.Box({
-    child: Widget.Label({
-      className: "date"
-    }).poll(1000, (self) =>
-      Utils.execAsync(["date", "+%a %b %d  %H:%M"]).then(
-        (time) => (self.label = time)
-      )
-    )
-  });
-
-export { Time };

home/programs/ags/config/jsconfig.json

@@ -1,12 +0,0 @@
-{
-  "compilerOptions": {
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "target": "ES2020",
-    "jsx": "react",
-    "allowImportingTsExtensions": true,
-    "strictNullChecks": true,
-    "strictFunctionTypes": true
-  },
-  "exclude": ["node_modules", "**/node_modules/*"]
-}

home/programs/ags/config/main.scss

@@ -1,9 +1 @@
-@import "scss/bar.scss";
+@import "./style/main.scss";
-@import "scss/general.scss";
-@import "scss/widgets.scss";
-
-* {
-    all: unset;
-    margin: 3px;
-    font-family: "Monaspace Krypton";
-}

home/programs/ags/config/package.json

@@ -1,15 +1,11 @@
 {
   "name": "snowflake-ags",
-  "version": "1.0.0",
+  "version": "0.0.1",
-  "description": "snowflake ags",
+  "description": "",
   "main": "config.js",
-  "repository": {
+  "scripts": {
-    "type": "git",
+    "test": "echo \"Error: no test specified\" && exit 1"
-    "url": "https://git.flake.sh/notohh/snowflake"
   },
   "author": "notohh",
-  "license": "MIT",
+  "license": "MIT"
-  "devDependencies": {
-    "eslint": "^8.56.0"
-  }
 }

home/programs/ags/config/scss/bar.scss

@@ -1,5 +0,0 @@
-@import "colors.scss";
-
-window {
-    background-color: $background;
-}

home/programs/ags/config/scss/colors.scss

@@ -1,24 +0,0 @@
-/* tokyonight */
-
-$red: #f7768e;
-$orange: #ff9e64;
-$yellow: #e0af68;
-$light-green: #9ece6a;
-$green: #73daca;
-$turquoise: #89ddff;
-$light-cyan: #b4f9f8;
-$teal: #2ac3de;
-$cyan: #7dcfff;
-$blue: #7aa2f7;
-$magenta: #bb9af7;
-$white: #c0caf5;
-$light-gray: #9aa5ce;
-$parameters: #cfc9c2;
-$comment: #565f89;
-$black: #414868;
-$foreground: #a9b1d6;
-$foreground-highlight: #c0caf5;
-$foreground-gutter: #363b54;
-$background: #1a1b26;
-$background-highlight: #30374b;
-$background-menu: #16161e;

home/programs/ags/config/scss/widgets.scss

@@ -1,21 +0,0 @@
-@import "colors.scss";
-
-@mixin widget {
-    color: $white;
-}
-
-.date {
-    @include widget();
-}
-
-.workspaces {
-    @include widget();
-}
-
-.media {
-    @include widget();
-}
-
-image {
-    font-size: 24px;
-}

home/programs/ags/config/style/style.scss

@@ -0,0 +1,7 @@
+* {
+    all: unset;
+}
+
+window {
+    background: black;
+}

home/programs/ags/config/ts/main.ts

@@ -0,0 +1,48 @@
+const scss = App.configDir + "/main.scss";
+const css = App.configDir + "/style.css";
+
+const time = Variable("", {
+  poll: [
+    1000,
+    function () {
+      return Date().toString();
+    }
+  ]
+});
+
+Utils.monitorFile(
+  `${App.configDir}/style`,
+
+  function () {
+    const scss = `${App.configDir}/main.scss`;
+
+    const css = `./style.css`;
+
+    Utils.exec(`sass ${scss} ${css}`);
+    App.resetCss();
+    App.applyCss(css);
+  }
+);
+
+const Bar = (monitor: number) =>
+  Widget.Window({
+    monitor,
+    name: `bar${monitor}`,
+    anchor: ["top", "left", "right"],
+    exclusivity: "exclusive",
+    child: Widget.CenterBox({
+      start_widget: Widget.Label({
+        hpack: "center",
+        label: "Welcome to AGS!"
+      }),
+      end_widget: Widget.Label({
+        hpack: "center",
+        label: time.bind()
+      })
+    })
+  });
+
+App.config({
+  style: css,
+  windows: [Bar(2)]
+});

home/programs/ags/config/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ES2022",
+    "lib": ["ES2022"],
+    "allowJs": true,
+    "checkJs": true,
+    "strict": true,
+    "noImplicitAny": false,
+    "baseUrl": ".",
+    "typeRoots": ["./types"],
+    "skipLibCheck": true
+  }
+}

home/programs/ags/config/types

@@ -0,0 +1 @@
+/home/notoh/.local/share/com.github.Aylur.ags/types

home/programs/ags/default.nix

@@ -9,7 +9,7 @@ in {
     enable = true;
     extraPackages = with pkgs; [libsoup_3 libdbusmenu-gtk3];
   };
-  home.packages = with pkgs; [dart-sass];
+  home.packages = with pkgs; [dart-sass bun];
   xdg.configFile = {
     "ags".source = config.lib.file.mkOutOfStoreSymlink "${configDir}";
   };

home/programs/anyrun/style.scss

@@ -1,7 +1,7 @@
 * {
   all: unset;
   transition: 200ms ease-out;
-  color: #cdd6f4;
+  color: #c0caf5;
   font-family: JetBrainsMono NF Medium;
   font-size: 1.1rem;
 }
@@ -18,11 +18,15 @@
   margin-top: 0.5rem;
 }
 
+#match {
+  padding: 3px;
+  border-radius: 12px;
+}
+
 #match:hover,
 #match:selected {
   background: #45475a;
-  border-radius: 5px;
+  padding: 0.6rem;
-  padding: 0.4rem
 }
 
 entry#entry {
@@ -31,8 +35,8 @@ entry#entry {
 }
 
 box#main {
-  background: #1e1e2e;
+  background: #1a1b26;
-  border: 3px solid #f5c2e7;
+  border: 3px solid #f7768e;
-  border-radius: 12px;
+  border-radius: 10px;
   padding: 0.3rem;
 }

home/programs/terminal/lazygit/default.nix

@@ -5,10 +5,10 @@ _: {
       windowSize = "normal";
       gui.theme = {
         lightTheme = false;
-        activeBorderColor = ["#2ac3de" "bold"];
+        activeBorderColor = ["#c0caf5" "bold"];
         inactiveBorderColor = ["#f7768e"];
-        optionsTextColor = [" #c0caf5"];
+        optionsTextColor = ["#f7768e"];
-        selectedLineBgColor = ["#24283b"];
+        selectedLineBgColor = ["#565f89"];
         selectedRangeByColor = ["#24283b"];
         cherryPickedCommitBgColor = ["#94e2d5"];
         cherryPickedCommitFgColor = ["#89b4fa"];

home/programs/terminal/starship.nix

@@ -45,7 +45,7 @@
       ];
       character = {
         error_symbol = "[](bold red)";
-        success_symbol = "[](bold teal)";
+        success_symbol = "[](bold white)";
       };
       username = {
         show_always = false;
@@ -63,7 +63,7 @@
         truncation_length = 3;
         truncation_symbol = "…/";
         read_only = "🔒";
-        style = "teal";
+        style = "red";
         home_symbol = "";
       };
       directory.substitutions = {
@@ -77,14 +77,16 @@
         impure_msg = "[impure shell](bold red)";
         pure_msg = "[pure shell](bold green)";
         unknown_msg = "[unknown shell](bold yellow)";
-        format = "via [ $state( \($name\))](bold teal)";
+        format = "[$state( \($name\))](bold white)";
       };
       git_branch = {
         symbol = "";
         format = "[$symbol $branch ]($style)";
+        style = "white";
       };
       git_status = {
         format = "[$all_status$ahead_behind ]($style)";
+        style = "red";
       };
       golang = {
         symbol = " ";

home/wayland/hyprland/config/general.nix

@@ -25,8 +25,8 @@
         gaps_in = 10;
         gaps_out = 20;
         border_size = 4;
-        "col.active_border" = "rgb(f7768e) rgb(2ac3de)";
+        "col.active_border" = "rgb(f7768e) rgb(c0caf5)";
-        "col.inactive_border" = "rgb(313244)";
+        "col.inactive_border" = "rgb(24283b)";
 
         layout = "dwindle";
       };

home/wayland/programs/hyprlock.nix

@@ -2,23 +2,36 @@ _: {
   programs.hyprlock = {
     enable = true;
     backgrounds = let
-      wallpaperPath = "/home/notoh/Pictures/wallpapers/cweam.png";
+      verticalWallpaper = "/home/notoh/Pictures/wallpapers/sparkle.png";
+      horizontalWallpaper = "/home/notoh/Pictures/wallpapers/sparkle2.png";
     in [
+      {
+        monitor = "HDMI-A-1";
+        path = verticalWallpaper;
+        blur_passes = 3;
+        blur_size = 4;
+        brightness = 0.5;
+      }
       {
         monitor = "DP-1";
-        path = wallpaperPath;
+        path = verticalWallpaper;
+        blur_passes = 3;
+        blur_size = 4;
+        brightness = 0.5;
       }
       {
         monitor = "DP-2";
-        path = wallpaperPath;
+        path = horizontalWallpaper;
+        blur_passes = 3;
+        blur_size = 4;
+        brightness = 0.5;
       }
       {
         monitor = "DP-3";
-        path = wallpaperPath;
+        path = horizontalWallpaper;
-      }
+        blur_passes = 3;
-      {
+        blur_size = 4;
-        monitor = "HDMI-A-1";
+        brightness = 0.5;
-        path = wallpaperPath;
       }
     ];
     general = {
@@ -31,40 +44,57 @@ _: {
       {
         monitor = "DP-2";
         size = {
-          width = 300;
+          width = 350;
           height = 50;
         };
         outline_thickness = 2;
-
+        outer_color = "rgb(f7768e)";
-        outer_color = "rgb(f5c2e7)";
+        inner_color = "rgb(1a1b26)";
-        inner_color = "rgb(1e1e2e)";
+        font_color = "rgb(c0caf5)";
-        font_color = "rgb(cdd6f4)";
+        fail_color = "rgb(f7768e)";
+        fail_text = "<i>$FAIL <b>($ATTEMPTS)</b></i>";
+        check_color = "rgb(ff9e64)";
+        swap_font_color = false;
         placeholder_text = ''
-          <span foreground="##cdd6f4">Password...</span>
+          <i><span foreground="##c0caf5">Password...</span></i>
         '';
         fade_on_empty = false;
-        dots_spacing = 0.3;
+        dots_spacing = 0.5;
         dots_center = true;
+        shadow_passes = 3;
+        shadow_size = 1;
+        shadow_color = "rgba(00000099)";
+        shadow_boost = 1.0;
       }
     ];
     labels = [
       {
         monitor = "DP-2";
-        text = "Hi, $USER";
+        text = ''
-        color = "rgb(1e1e2e)";
+          Hi, <i><span foreground="##f7768e">$USER</span></i>
+        '';
+        color = "rgb(c0caf5)";
         valign = "center";
         halign = "center";
+        shadow_passes = 3;
+        shadow_size = 1;
+        shadow_color = "rgba(00000099)";
+        shadow_boost = 1.0;
       }
       {
         monitor = "DP-2";
         text = "$TIME";
-        color = "rgb(1e1e2e)";
+        color = "rgb(c0caf5)";
         position = {
           x = 0;
           y = 120;
         };
         valign = "center";
         halign = "center";
+        shadow_passes = 3;
+        shadow_size = 1;
+        shadow_color = "rgba(00000099)";
+        shadow_boost = 0.6;
       }
     ];
   };

home/wayland/services/hypridle.nix

@@ -11,11 +11,11 @@
     beforeSleepCmd = "${pkgs.systemd}/bin/loginctl lock-session";
     listeners = [
       {
-        timeout = 500;
+        timeout = 400;
         onTimeout = "${lib.getExe config.programs.hyprlock.package}";
       }
       {
-        timeout = 560;
+        timeout = 460;
         onTimeout = "${config.wayland.windowManager.hyprland.package}/bin/hyprctl dispatch dpms off";
         onResume = "${config.wayland.windowManager.hyprland.package}/bin/hyprctl dispatch dpms on";
       }

home/wayland/services/hyprpaper.nix

@@ -3,12 +3,15 @@ _: {
     enable = true;
     ipc = true;
     splash = false;
-    preloads = ["~/Pictures/wallpapers/frieren.png"];
+    preloads = [
+      "~/Pictures/wallpapers/sparkle.png"
+      "~/Pictures/wallpapers/sparkle2.png"
+    ];
     wallpapers = [
-      "HDMI-A-1,~/Pictures/wallpapers/frieren.png"
+      "HDMI-A-1,~/Pictures/wallpapers/sparkle.png"
-      "DP-1,~/Pictures/wallpapers/frieren.png"
+      "DP-1,~/Pictures/wallpapers/sparkle.png"
-      "DP-2,~/Pictures/wallpapers/frieren.png"
+      "DP-2,~/Pictures/wallpapers/sparkle2.png"
-      "DP-3,~/Pictures/wallpapers/frieren.png"
+      "DP-3,~/Pictures/wallpapers/sparkle2.png"
     ];
   };
 }

hosts/yuki/services/homepage/default.nix

@@ -20,13 +20,16 @@
       headerStyle = "boxedWidgets";
       disableCollape = true;
       favicon = "https://em-content.zobj.net/source/twitter/376/cloud_2601-fe0f.png";
-      background = "https://i.imgur.com/uU6Jbum.jpg";
       cardBlur = "md";
       theme = "dark";
       color = "gray";
       fiveColumns = true;
       statusStyle = "dot";
       hideVersion = true;
+      background = {
+        image = "https://i.imgur.com/YLX96sC.jpeg";
+        brightness = 75;
+      };
       providers = {
         openweathermap = "{{HOMEPAGE_VAR_OPENWEATHERMAP}}";
       };