chore: remove plaintext css files

nekowinston · Sep 8, 2024 · 6b1a7c8 · 6b1a7c8
1 parent 96a2ec0
commit 6b1a7c8
Show file tree

Hide file tree

Showing 3 changed files with 98 additions and 96 deletions.
diff --git a/home/apps/discord.nix b/home/apps/discord.nix
@@ -6,6 +6,36 @@
 }:
 let
   inherit (pkgs.stdenv) isDarwin isLinux;
+
+  css = # css
+    ''
+      @import url('//fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap');
+
+      :root {
+        --font-primary: "IBM Plex Sans", sans-serif;
+        --font-headline: "IBM Plex Sans", sans-serif;
+        --font-display: "IBM Plex Sans", sans-serif;
+        --font-code: "Berkeley Mono", "IBM Plex Mono", "Symbols Nerd Font", mono;
+      }
+
+      @media (max-width: 1024px) {
+        nav[aria-label="Servers sidebar"] {
+          display: none;
+        }
+
+        .platform-osx div[class^="base_"]>div[class^="content_"]>div[class^="sidebar_"],
+        .platform-osx div[class^="base_"]>div[class^="content_"]>main[class^="container_"],
+        .platform-osx div[class^="base_"]>div[class^="content_"]>div[class^="chat_"] {
+          padding-top: 32px !important;
+        }
+      }
+
+      @media (max-width: 768px) {
+        div[class^="base_"]>div[class^="content_"]>div[class^="sidebar_"] {
+          display: none;
+        }
+      }
+    '';
 in
 {
   config = lib.mkIf config.isGraphical {
@@ -20,7 +50,7 @@ in
             MIN_WIDTH = 0;
             MIN_HEIGHT = 0;
             openasar = {
-              css = builtins.readFile ./discord/custom.css;
+              inherit css;
               setup = true;
             };
             trayBalloonShown = false;

diff --git a/home/apps/discord/custom.css b/home/apps/discord/custom.css
diff --git a/home/apps/waybar.nix b/home/apps/waybar.nix
@@ -42,77 +42,80 @@ let
     };
   };
 
-  darkColors = ''
-    @define-color red #f38ba8;
-    @define-color pink #f5c2e7;
-    @define-color crust #11111c;
-    @define-color base #1e1e2e;
-    @define-color text #cdd6f4;
-    @define-color surface0 #313244;
-    @define-color surface2 #585b70;
-  '';
-  lightColors = ''
-    @define-color red #d20f39;
-    @define-color pink #ea76cb;
-    @define-color crust #dce0e8;
-    @define-color base #eff1f5;
-    @define-color text #4c4f69;
-    @define-color surface0 #ccd0da;
-    @define-color surface2 #acb0be;
-  '';
-  style = ''
-    * {
-      font-family: Symbols Nerd Font, IBM Plex Sans;
-      font-size: 16px;
-      color: @text;
-    }
+  darkColors = # css
+    ''
+      @define-color red #f38ba8;
+      @define-color pink #f5c2e7;
+      @define-color crust #11111c;
+      @define-color base #1e1e2e;
+      @define-color text #cdd6f4;
+      @define-color surface0 #313244;
+      @define-color surface2 #585b70;
+    '';
+  lightColors = # css
+    ''
+      @define-color red #d20f39;
+      @define-color pink #ea76cb;
+      @define-color crust #dce0e8;
+      @define-color base #eff1f5;
+      @define-color text #4c4f69;
+      @define-color surface0 #ccd0da;
+      @define-color surface2 #acb0be;
+    '';
+  style = # css
+    ''
+      * {
+        font-family: Symbols Nerd Font, IBM Plex Sans;
+        font-size: 16px;
+        color: @text;
+      }
 
-    window#waybar {
-      background-color: @base;
-      border: 2px solid @crust;
-      border-radius: 5px;
-    }
+      window#waybar {
+        background-color: @base;
+        border: 2px solid @crust;
+        border-radius: 5px;
+      }
 
-    #workspaces button:first-child {
-      padding: 0 5px;
-      border-radius: 5px 0 0 5px;
-      border-left: 2px solid @crust;
-    }
-    #workspaces button.active:first-child {
-      padding: 0 5px;
-      box-shadow: unset;
-      border-radius: 5px 0 0 5px;
-      border-left: 2px solid @pink;
-      border-top: 2px solid @pink;
-      border-bottom: 2px solid @pink;
-    }
+      #workspaces button:first-child {
+        padding: 0 5px;
+        border-radius: 5px 0 0 5px;
+        border-left: 2px solid @crust;
+      }
+      #workspaces button.active:first-child {
+        padding: 0 5px;
+        box-shadow: unset;
+        border-radius: 5px 0 0 5px;
+        border-left: 2px solid @pink;
+        border-top: 2px solid @pink;
+        border-bottom: 2px solid @pink;
+      }
 
-    #workspaces button {
-      padding: 0 5px;
-      border-radius: 0;
-      border-top: 2px solid @crust;
-      border-bottom: 2px solid @crust;
-    }
+      #workspaces button {
+        padding: 0 5px;
+        border-radius: 0;
+        border-top: 2px solid @crust;
+        border-bottom: 2px solid @crust;
+      }
 
-    #workspaces button:hover {
-      background: @surface2;
-    }
+      #workspaces button:hover {
+        background: @surface2;
+      }
 
-    #workspaces button.active {
-      color: @pink;
-      background: @surface0;
-      border-top: 2px solid @pink;
-      border-bottom: 2px solid @pink;
-    }
+      #workspaces button.active {
+        color: @pink;
+        background: @surface0;
+        border-top: 2px solid @pink;
+        border-bottom: 2px solid @pink;
+      }
 
-    #workspaces button.urgent {
-      background-color: @red;
-    }
+      #workspaces button.urgent {
+        background-color: @red;
+      }
 
-    #clock, #network, #pulseaudio, #tray, #idle_inhibitor {
-      padding: 0 10px;
-    }
-  '';
+      #clock, #network, #pulseaudio, #tray, #idle_inhibitor {
+        padding: 0 10px;
+      }
+    '';
 in
 {
   config = lib.mkIf (config.isGraphical && pkgs.stdenv.isLinux) {