diff --git a/.gitignore b/.gitignore index a3b0bbd..f0c1769 100644 --- a/.gitignore +++ b/.gitignore @@ -23,4 +23,5 @@ !*.yml !*.json !*.glsl -!*.py \ No newline at end of file +!*.py +!*.css diff --git a/flake.lock b/flake.lock index db699b7..6aef5df 100755 --- a/flake.lock +++ b/flake.lock @@ -617,11 +617,11 @@ "nixpkgs": "nixpkgs_5" }, "locked": { - "lastModified": 1788368401, - "narHash": "sha256-UVlI5OCLEWgzA1h70v4iFLjq36JNEn2pzW4Tn8d+xuM=", + "lastModified": 1788555275, + "narHash": "sha256-bynD8NCMIV0GskOpX79nSrv482f0As9WHYIzkyVSYj8=", "owner": "elwrcl", "repo": "scx_soryu", - "rev": "b64e40d88d1b9716937721cc73b878fbb52ff57a", + "rev": "e07ac4c67eb8dceedb65172d74eb25724cc58d60", "type": "github" }, "original": { diff --git a/hosts/copland.ulu.nix b/hosts/copland.ulu.nix index a1c4a5c..189cd2f 100644 --- a/hosts/copland.ulu.nix +++ b/hosts/copland.ulu.nix @@ -56,6 +56,7 @@ in config.flake.homeModules.home-theme-helix config.flake.homeModules.home-theme-zellij config.flake.homeModules.home-theme-nushell + config.flake.homeModules.home-theme-discord config.flake.homeModules.home-direnv config.flake.homeModules.home-jujutsu config.flake.homeModules.home-jujutsu-difftastic diff --git a/modules/home/home-nyi.ulu.nix b/modules/home/home-nyi.ulu.nix index de60cb6..36c7271 100644 --- a/modules/home/home-nyi.ulu.nix +++ b/modules/home/home-nyi.ulu.nix @@ -26,7 +26,7 @@ ]; labelColor = "white"; separator = "-"; - box = true; + box = false; shading = null; shadingMode = "sextants"; logoOuter = null; diff --git a/modules/home/theme/discord-system24.css b/modules/home/theme/discord-system24.css new file mode 100644 index 0000000..2242213 --- /dev/null +++ b/modules/home/theme/discord-system24.css @@ -0,0 +1,115 @@ +/* import theme modules */ +@import url('https://refact0r.github.io/system24/build/system24.css'); + +body { + /* font, change to '' for default discord font */ + --font: 'DM Mono'; + /* change to '' for default discord font */ + --code-font: 'DM Mono'; + /* change to '' for default discord font */ + font-weight: 300; + /* text font weight. 300 is light, 400 is normal. DOES NOT AFFECT BOLD TEXT */ + letter-spacing: -0.05ch; + /* decreases letter spacing for better readability. recommended on monospace fonts.*/ + + /* sizes */ + --gap: 12px; + /* spacing between panels */ + --divider-thickness: 4px; + /* thickness of unread messages divider and highlighted message borders */ + --border-thickness: 2px; + /* thickness of borders around main panels. DOES NOT AFFECT OTHER BORDERS */ + --border-hover-transition: 0.2s ease; + /* transition for borders when hovered */ + + /* animation/transition options */ + --animations: on; + /* off: disable animations/transitions, on: enable animations/transitions */ + --list-item-transition: 0.2s ease; + /* transition for list items */ + --dms-icon-svg-transition: 0.4s ease; + /* transition for the dms icon */ + + /* top bar options */ + --top-bar-height: var(--gap); + /* height of the top bar (discord default is 36px, old discord style is 24px, var(--gap) recommended if button position is set to titlebar) */ + --top-bar-button-position: titlebar; + /* off: default position, hide: hide buttons completely, serverlist: move inbox button to server list, titlebar: move inbox button to channel titlebar (will hide title) */ + --top-bar-title-position: off; + /* off: default centered position, hide: hide title completely, left: left align title (like old discord) */ + --subtle-top-bar-title: off; + /* off: default, on: hide the icon and use subtle text color (like old discord) */ + + /* window controls */ + --custom-window-controls: off; + /* off: default window controls, on: custom window controls */ + --window-control-size: 14px; + /* size of custom window controls */ + + /* dms button options */ + --custom-dms-icon: off; + /* off: use default discord icon, hide: remove icon entirely, custom: use custom icon */ + --dms-icon-svg-url: url(''); + /* icon svg url. MUST BE A SVG. */ + --dms-icon-svg-size: 90%; + /* size of the svg (css mask-size property) */ + --dms-icon-color-before: var(--icon-subtle); + /* normal icon color */ + --dms-icon-color-after: var(--white); + /* icon color when button is hovered/selected */ + --custom-dms-background: off; + /* off to disable, image to use a background image (must set url variable below), color to use a custom color/gradient */ + --dms-background-image-url: url(''); + /* url of the background image */ + --dms-background-image-size: cover; + /* size of the background image (css background-size property) */ + --dms-background-color: linear-gradient(70deg, var(--blue-2), var(--purple-2), var(--red-2)); + /* fixed color/gradient (css background property) */ + + /* background image options */ + --background-image: off; + /* off: no background image, on: enable background image (must set url variable below) */ + --background-image-url: url(''); + /* url of the background image */ + + /* transparency/blur options */ + /* NOTE: TO USE TRANSPARENCY/BLUR, YOU MUST HAVE TRANSPARENT BG COLORS. FOR EXAMPLE: --bg-4: hsla(220, 15%, 10%, 0.7); */ + --transparency-tweaks: off; + /* off: no changes, on: remove some elements for better transparency */ + --remove-bg-layer: off; + /* off: no changes, on: remove the base --bg-3 layer for use with window transparency (WILL OVERRIDE BACKGROUND IMAGE) */ + --panel-blur: off; + /* off: no changes, on: blur the background of panels */ + --blur-amount: 12px; + /* amount of blur */ + --bg-floating: var(--bg-3); + /* set this to a more opaque color if floating panels look too transparent. only applies if panel blur is on */ + + /* other options */ + --small-user-panel: on; + /* off: default user panel, on: smaller user panel like in old discord */ + + /* unrounding options */ + --unrounding: on; + /* off: default, on: remove rounded corners from panels */ + --round-pfp: off; + /* off: square profile pictures, on: rounded profile pictures (Discord default) */ + --remove-pfp-decor: off; + /* off: default, on: remove profile picture decorations */ + + /* styling options */ + --custom-spotify-bar: on; + /* off: default, on: custom text-like spotify progress bar */ + --ascii-titles: on; + /* off: default, on: use ascii font for titles at the start of a channel */ + --ascii-loader: system24; + /* off: default, system24: use system24 ascii loader, cats: use cats loader */ + + /* panel labels */ + --panel-labels: on; + /* off: default, on: add labels to panels */ + --label-color: var(--text-muted); + /* color of labels */ + --label-font-weight: 500; + /* font weight of labels */ +} \ No newline at end of file diff --git a/modules/home/theme/home-theme-discord.ulu.nix b/modules/home/theme/home-theme-discord.ulu.nix new file mode 100644 index 0000000..eaf30c6 --- /dev/null +++ b/modules/home/theme/home-theme-discord.ulu.nix @@ -0,0 +1,144 @@ +{ ... }: +{ + # system24 kemuri susu generated + flake.homeModules.home-theme-discord = + { config, lib, ... }: + let + p = config.elars.theme.palette.withHashtag; + lighten = c: pct: "color-mix(in oklab, white ${toString pct}%, ${c})"; + darken = c: pct: "color-mix(in oklab, black ${toString pct}%, ${c})"; + ramp = + indent: name: base: + lib.concatMapStringsSep "\n${indent}" (x: x) [ + "--${name}-1: ${lighten base 12};" + "--${name}-2: ${base};" + "--${name}-3: ${darken base 8};" + "--${name}-4: ${darken base 16};" + "--${name}-5: ${darken base 24};" + ]; + + rgb = hex: builtins.concatStringsSep " " (map toString (config.elars.theme.hexToRgb hex)); + accentRgb = rgb (config.elars.theme.palette.accent or config.elars.theme.palette.base06); + textRgb = rgb config.elars.theme.palette.base05; + light = { + surface = "#d4c1a8"; + surfaceVariant = "#c5b29a"; + outline = "#a89682"; + onSurface = "#262524"; + secondary = "#736c5f"; + tertiary = "#594f46"; + error = "#bc4747"; + }; + + colors = '' + /* ── generated from elars.theme.palette ─────────────────────── */ + :root { + color-scheme: dark; + --colors: on; + + /* text colors */ + --text-0: var(--bg-4); + --text-1: ${p.base05}; + --text-2: ${darken p.base05 6}; + --text-3: ${p.base06}; + --text-4: ${lighten p.base04 18}; + --text-5: ${p.base04}; + + /* background colors */ + --bg-1: ${lighten p.base02 8}; + --bg-2: ${p.base02}; + --bg-3: ${p.base01}; + --bg-4: ${p.base00}; + --hover: rgb(${accentRgb} / 0.1); + --active: rgb(${accentRgb} / 0.2); + --active-2: rgb(${accentRgb} / 0.3); + --message-hover: var(--hover); + + /* accent colors */ + --accent-1: var(--accent-c-1); + --accent-2: var(--accent-c-2); + --accent-3: var(--accent-c-3); + --accent-4: var(--accent-c-4); + --accent-5: var(--accent-c-5); + --accent-new: var(--red-2); + --mention: linear-gradient(to right, color-mix(in hsl, var(--accent-2), transparent 90%) 40%, transparent); + --mention-hover: linear-gradient(to right, color-mix(in hsl, var(--accent-2), transparent 95%) 40%, transparent); + --reply: linear-gradient(to right, color-mix(in hsl, var(--text-3), transparent 90%) 40%, transparent); + --reply-hover: linear-gradient(to right, color-mix(in hsl, var(--text-3), transparent 95%) 40%, transparent); + + /* status indicators */ + --online: var(--green-2); + --dnd: var(--red-2); + --idle: var(--yellow-2); + --streaming: var(--purple-2); + --offline: var(--text-4); + + /* borders */ + --border-light: var(--hover); + --border: var(--active); + --border-hover: var(--accent-2); + --button-border: rgb(${textRgb} / 0.1); + + /* base ramps */ + ${ramp " " "accent-c" (p.accent or p.base06)} + ${ramp " " "red" p.base08} + ${ramp " " "green" p.base0B} + ${ramp " " "blue" p.base0D} + ${ramp " " "yellow" p.base0A} + ${ramp " " "purple" p.base0E} + ${ramp " " "cyan" p.base0C} + } + + @media (prefers-color-scheme: light) { + :root { + color-scheme: light; + + --text-0: var(--bg-4); + --text-1: ${light.onSurface}; + --text-2: ${lighten light.onSurface 6}; + --text-3: ${lighten light.onSurface 12}; + --text-4: ${light.secondary}; + --text-5: ${lighten light.secondary 12}; + + --bg-1: ${light.outline}; + --bg-2: ${darken light.surfaceVariant 6}; + --bg-3: ${light.surfaceVariant}; + --bg-4: ${light.surface}; + --hover: rgb(38 37 36 / 0.08); + --active: rgb(38 37 36 / 0.16); + --active-2: rgb(38 37 36 / 0.24); + --message-hover: var(--hover); + + ${ramp " " "accent-c" light.tertiary} + --accent-1: var(--accent-c-2); + --accent-2: var(--accent-c-2); + --accent-3: var(--accent-c-2); + --accent-4: var(--accent-c-3); + --accent-5: var(--accent-c-4); + --border-hover: var(--accent-c-2); + --button-border: rgb(38 37 36 / 0.12); + --mention: linear-gradient(to right, color-mix(in hsl, var(--accent-2), transparent 85%) 40%, transparent); + --mention-hover: linear-gradient(to right, color-mix(in hsl, var(--accent-2), transparent 92%) 40%, transparent); + + ${ramp " " "red" light.error} + ${ramp " " "green" (darken p.base0B 28)} + ${ramp " " "yellow" (darken p.base0A 28)} + ${ramp " " "purple" (darken p.base0E 28)} + ${ramp " " "blue" (darken p.base0D 28)} + + --online: var(--green-3); + --dnd: var(--red-3); + --idle: var(--yellow-3); + --streaming: var(--purple-3); + --offline: var(--text-5); + } + } + ''; + in + { + xdg.configFile."legcord/quickCss.css".text = '' + ${builtins.readFile ./discord-system24.css} + ${colors} + ''; + }; +}