diff options
| author | srdusr <trevorgray@srdusr.com> | 2025-08-30 19:22:59 +0200 |
|---|---|---|
| committer | srdusr <trevorgray@srdusr.com> | 2025-08-30 19:22:59 +0200 |
| commit | 19120d4f9761c67d99ed1ce3da6084b83f5a49c9 (patch) | |
| tree | f234cad1bdad88114a63c9702144da487024967a /.config/ags/style | |
| parent | 5928998af5404ae2be84c6cecc10ebf84bd3f3ed (diff) | |
| download | dotfiles-19120d4f9761c67d99ed1ce3da6084b83f5a49c9.tar.gz dotfiles-19120d4f9761c67d99ed1ce3da6084b83f5a49c9.zip | |
Linux-specific dotfiles
Diffstat (limited to '.config/ags/style')
| -rw-r--r-- | .config/ags/style/extra.scss | 67 | ||||
| -rw-r--r-- | .config/ags/style/mixins/a11y-button.scss | 48 | ||||
| -rw-r--r-- | .config/ags/style/mixins/button.scss | 70 | ||||
| -rw-r--r-- | .config/ags/style/mixins/floating-widget.scss | 12 | ||||
| -rw-r--r-- | .config/ags/style/mixins/hidden.scss | 15 | ||||
| -rw-r--r-- | .config/ags/style/mixins/media.scss | 42 | ||||
| -rw-r--r-- | .config/ags/style/mixins/scrollable.scss | 42 | ||||
| -rw-r--r-- | .config/ags/style/mixins/slider.scss | 74 | ||||
| -rw-r--r-- | .config/ags/style/mixins/spacing.scss | 53 | ||||
| -rw-r--r-- | .config/ags/style/mixins/switch.scss | 16 | ||||
| -rw-r--r-- | .config/ags/style/mixins/unset.scss | 9 | ||||
| -rw-r--r-- | .config/ags/style/mixins/widget.scss | 7 | ||||
| -rw-r--r-- | .config/ags/style/style.ts | 103 |
13 files changed, 0 insertions, 558 deletions
diff --git a/.config/ags/style/extra.scss b/.config/ags/style/extra.scss deleted file mode 100644 index e7f9d44..0000000 --- a/.config/ags/style/extra.scss +++ /dev/null @@ -1,67 +0,0 @@ -@import './mixins/button.scss'; - -* { - font-size: $font-size; - font-family: $font-name; -} - -separator { - &.horizontal { - min-height: $border-width; - } - - &.vertical { - min-width: $border-width; - } -} - -window.popup { - >* { - border: none; - box-shadow: none; - } - - menu { - border-radius: $popover-radius; - background-color: $bg; - padding: $popover-padding; - border: $border-width solid $popover-border-color; - - separator { - background-color: $border-color; - } - - menuitem { - @include button; - padding: $spacing * .5; - margin: ($spacing * .5) 0; - - &:first-child { - margin-top: 0; - } - - &:last-child { - margin-bottom: 0; - } - } - } -} - -tooltip { - * { - all: unset; - } - - background-color: transparent; - border: none; - - >*>* { - background-color: $bg; - border-radius: $radius; - border: $border-width solid $popover-border-color; - color: $fg; - padding: 8px; - margin: 4px; - box-shadow: 0 0 3px 0 $shadow-color; - } -} diff --git a/.config/ags/style/mixins/a11y-button.scss b/.config/ags/style/mixins/a11y-button.scss deleted file mode 100644 index 00b24c6..0000000 --- a/.config/ags/style/mixins/a11y-button.scss +++ /dev/null @@ -1,48 +0,0 @@ -@import './button'; - -@mixin accs-button($flat: false, $reactive: true) { - @include unset; - color: $fg; - - >* { - border-radius: $radius; - transition: $transition; - - @if $flat { - background-color: transparent; - box-shadow: none; - } - - @else { - background-color: $widget-bg; - box-shadow: inset 0 0 0 $border-width $border-color; - } - } - - - @if $reactive { - - &:focus>*, - &.focused>* { - @include button-focus; - } - - &:hover>* { - @include button-hover; - } - - &:active, - &.active, - &.on, - &:checked { - >* { - @include button-active; - } - - &:hover>* { - box-shadow: inset 0 0 0 $border-width $border-color, - inset 0 0 0 99px $hover-bg; - } - } - } -} diff --git a/.config/ags/style/mixins/button.scss b/.config/ags/style/mixins/button.scss deleted file mode 100644 index 79ec275..0000000 --- a/.config/ags/style/mixins/button.scss +++ /dev/null @@ -1,70 +0,0 @@ -@mixin button-focus() { - box-shadow: inset 0 0 0 $border-width $primary-bg; - background-color: $hover-bg; - color: $hover-fg; -} - -@mixin button-hover() { - box-shadow: inset 0 0 0 $border-width $border-color; - background-color: $hover-bg; - color: $hover-fg; -} - -@mixin button-active() { - box-shadow: inset 0 0 0 $border-width $border-color; - background-image: $active-gradient; - background-color: $primary-bg; - color: $primary-fg; -} - -@mixin button-disabled() { - box-shadow: none; - background-color: transparent; - color: transparentize($fg, 0.7); -} - -@mixin button($flat: false, $reactive: true, $radius: $radius, $focusable: true) { - all: unset; - transition: $transition; - border-radius: $radius; - color: $fg; - - @if $flat { - background-color: transparent; - background-image: none; - box-shadow: none; - } - - @else { - background-color: $widget-bg; - box-shadow: inset 0 0 0 $border-width $border-color; - } - - @if $reactive { - @if $focusable { - &:focus { - @include button-focus; - } - } - - &:hover { - @include button-hover; - } - - &:active, - &.on, - &.active, - &:checked { - @include button-active; - - &:hover { - box-shadow: inset 0 0 0 $border-width $border-color, - inset 0 0 0 99px $hover-bg; - } - } - } - - &:disabled { - @include button-disabled; - } -} diff --git a/.config/ags/style/mixins/floating-widget.scss b/.config/ags/style/mixins/floating-widget.scss deleted file mode 100644 index 613668d..0000000 --- a/.config/ags/style/mixins/floating-widget.scss +++ /dev/null @@ -1,12 +0,0 @@ -@mixin floating-widget { - @if $shadows { - box-shadow: 0 0 5px 0 $shadow-color; - } - - margin: max($spacing, 8px); - border: $border-width solid $popover-border-color; - background-color: $bg; - color: $fg; - border-radius: $popover-radius; - padding: $popover-padding; -} diff --git a/.config/ags/style/mixins/hidden.scss b/.config/ags/style/mixins/hidden.scss deleted file mode 100644 index ea6a42c..0000000 --- a/.config/ags/style/mixins/hidden.scss +++ /dev/null @@ -1,15 +0,0 @@ -@mixin hidden { - background-color: transparent; - background-image: none; - border-color: transparent; - box-shadow: none; - -gtk-icon-transform: scale(0); - - * { - background-color: transparent; - background-image: none; - border-color: transparent; - box-shadow: none; - -gtk-icon-transform: scale(0); - } -} diff --git a/.config/ags/style/mixins/media.scss b/.config/ags/style/mixins/media.scss deleted file mode 100644 index 3178029..0000000 --- a/.config/ags/style/mixins/media.scss +++ /dev/null @@ -1,42 +0,0 @@ -@mixin media() { - @include widget; - padding: $padding; - - .cover { - @if $shadows { - box-shadow: 2px 2px 2px 0 $shadow-color; - } - - background-size: cover; - background-position: center; - border-radius: $radius*0.8; - margin-right: $spacing; - } - - button { - @include button($flat: true); - padding: $padding * .5; - - &.play-pause { - margin: 0 ($spacing * .5); - } - - image { - font-size: 1.2em; - } - } - - .artist { - color: transparentize($fg, .2); - font-size: .9em; - } - - scale { - @include slider($width: .5em, $slider: false, $gradient: linear-gradient($fg, $fg)); - margin-bottom: $padding * .5; - - trough { - border: none; - } - } -} diff --git a/.config/ags/style/mixins/scrollable.scss b/.config/ags/style/mixins/scrollable.scss deleted file mode 100644 index b66f246..0000000 --- a/.config/ags/style/mixins/scrollable.scss +++ /dev/null @@ -1,42 +0,0 @@ -@mixin scrollable($top: false, $bottom: false) { - - @if $top and $shadows { - undershoot.top { - background: linear-gradient(to bottom, $shadow-color, transparent, transparent, transparent, transparent, transparent); - } - } - - @if $bottom and $shadows { - undershoot.bottom { - background: linear-gradient(to top, $shadow-color, transparent, transparent, transparent, transparent, transparent); - } - } - - scrollbar, - scrollbar * { - all: unset; - } - - scrollbar.vertical { - transition: $transition; - background-color: transparentize($bg, 0.7); - - &:hover { - background-color: transparentize($bg, 0.3); - - slider { - background-color: transparentize($fg, 0.3); - min-width: .6em; - } - } - } - - - scrollbar.vertical slider { - background-color: transparentize($fg, 0.5); - border-radius: $radius; - min-width: .4em; - min-height: 2em; - transition: $transition; - } -} diff --git a/.config/ags/style/mixins/slider.scss b/.config/ags/style/mixins/slider.scss deleted file mode 100644 index b90e566..0000000 --- a/.config/ags/style/mixins/slider.scss +++ /dev/null @@ -1,74 +0,0 @@ -@import './unset'; - -@mixin slider($width: 0.7em, $slider-width: .5em, $gradient: $active-gradient, $slider: true, $focusable: true, $radius: $radius) { - @include unset($rec: true); - - trough { - transition: $transition; - border-radius: $radius; - border: $border; - background-color: $widget-bg; - min-height: $width; - min-width: $width; - - highlight, - progress { - border-radius: max($radius - $border-width, 0); - background-image: $gradient; - min-height: $width; - min-width: $width; - } - } - - slider { - box-shadow: none; - background-color: transparent; - border: $border-width solid transparent; - transition: $transition; - border-radius: $radius; - min-height: $width; - min-width: $width; - margin: -$slider-width; - } - - &:hover { - trough { - background-color: $hover-bg; - } - - slider { - @if $slider { - background-color: $fg; - border-color: $border-color; - - @if $shadows { - box-shadow: 0 0 3px 0 $shadow-color; - } - } - } - } - - &:disabled { - - highlight, - progress { - background-color: transparentize($fg, 0.4); - background-image: none; - } - } - - @if $focusable { - trough:focus { - background-color: $hover-bg; - box-shadow: inset 0 0 0 $border-width $primary-bg; - - slider { - @if $slider { - background-color: $fg; - box-shadow: inset 0 0 0 $border-width $primary-bg; - } - } - } - - } -} diff --git a/.config/ags/style/mixins/spacing.scss b/.config/ags/style/mixins/spacing.scss deleted file mode 100644 index 4096fba..0000000 --- a/.config/ags/style/mixins/spacing.scss +++ /dev/null @@ -1,53 +0,0 @@ -@mixin spacing($multiplier: 1, $spacing: $spacing, $rec: false) { - &.horizontal>* { - margin: 0 calc($spacing * $multiplier / 2); - - &:first-child { - margin-left: 0; - } - - &:last-child { - margin-right: 0; - } - } - - &.vertical>* { - margin: calc($spacing * $multiplier / 2) 0; - - &:first-child { - margin-top: 0; - } - - &:last-child { - margin-bottom: 0; - } - } - - @if $rec { - box { - &.horizontal>* { - margin: 0 $spacing * $multiplier / 2; - - &:first-child { - margin-left: 0; - } - - &:last-child { - margin-right: 0; - } - } - - &.vertical>* { - margin: $spacing * $multiplier / 2 0; - - &:first-child { - margin-top: 0; - } - - &:last-child { - margin-bottom: 0; - } - } - } - } -} diff --git a/.config/ags/style/mixins/switch.scss b/.config/ags/style/mixins/switch.scss deleted file mode 100644 index 2abf360..0000000 --- a/.config/ags/style/mixins/switch.scss +++ /dev/null @@ -1,16 +0,0 @@ -@import './button'; - -@mixin switch { - @include button; - - slider { - background-color: $primary-fg; - border-radius: $radius; - min-width: 24px; - min-height: 24px; - } - - image { - color: transparent; - } -} diff --git a/.config/ags/style/mixins/unset.scss b/.config/ags/style/mixins/unset.scss deleted file mode 100644 index eb80af5..0000000 --- a/.config/ags/style/mixins/unset.scss +++ /dev/null @@ -1,9 +0,0 @@ -@mixin unset($rec: false) { - all: unset; - - @if $rec { - * { - all: unset - } - } -} diff --git a/.config/ags/style/mixins/widget.scss b/.config/ags/style/mixins/widget.scss deleted file mode 100644 index 053f1aa..0000000 --- a/.config/ags/style/mixins/widget.scss +++ /dev/null @@ -1,7 +0,0 @@ -@mixin widget { - transition: $transition; - border-radius: $radius; - color: $fg; - background-color: $widget-bg; - border: $border; -} diff --git a/.config/ags/style/style.ts b/.config/ags/style/style.ts deleted file mode 100644 index a9b94fe..0000000 --- a/.config/ags/style/style.ts +++ /dev/null @@ -1,103 +0,0 @@ -/* eslint-disable max-len */ -import { type Opt } from "lib/option" -import options from "options" -import { bash, dependencies, sh } from "lib/utils" - -const deps = [ - "font", - "theme", - "bar.flatButtons", - "bar.position", - "bar.battery.charging", - "bar.battery.blocks", -] - -const { - dark, - light, - blur, - scheme, - padding, - spacing, - radius, - shadows, - widget, - border, -} = options.theme - -const popoverPaddingMultiplier = 1.6 - -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const t = (dark: Opt<any> | string, light: Opt<any> | string) => scheme.value === "dark" - ? `${dark}` : `${light}` - -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const $ = (name: string, value: string | Opt<any>) => `$${name}: ${value};` - -const variables = () => [ - $("bg", blur.value ? `transparentize(${t(dark.bg, light.bg)}, ${blur.value / 100})` : t(dark.bg, light.bg)), - $("fg", t(dark.fg, light.fg)), - - $("primary-bg", t(dark.primary.bg, light.primary.bg)), - $("primary-fg", t(dark.primary.fg, light.primary.fg)), - - $("error-bg", t(dark.error.bg, light.error.bg)), - $("error-fg", t(dark.error.fg, light.error.fg)), - - $("scheme", scheme), - $("padding", `${padding}pt`), - $("spacing", `${spacing}pt`), - $("radius", `${radius}px`), - $("transition", `${options.transition}ms`), - - $("shadows", `${shadows}`), - - $("widget-bg", `transparentize(${t(dark.widget, light.widget)}, ${widget.opacity.value / 100})`), - - $("hover-bg", `transparentize(${t(dark.widget, light.widget)}, ${(widget.opacity.value * .9) / 100})`), - $("hover-fg", `lighten(${t(dark.fg, light.fg)}, 8%)`), - - $("border-width", `${border.width}px`), - $("border-color", `transparentize(${t(dark.border, light.border)}, ${border.opacity.value / 100})`), - $("border", "$border-width solid $border-color"), - - $("active-gradient", `linear-gradient(to right, ${t(dark.primary.bg, light.primary.bg)}, darken(${t(dark.primary.bg, light.primary.bg)}, 4%))`), - $("shadow-color", t("rgba(0,0,0,.6)", "rgba(0,0,0,.4)")), - $("text-shadow", t("2pt 2pt 2pt $shadow-color", "none")), - - $("popover-border-color", `transparentize(${t(dark.border, light.border)}, ${Math.max(((border.opacity.value - 1) / 100), 0)})`), - $("popover-padding", `$padding * ${popoverPaddingMultiplier}`), - $("popover-radius", radius.value === 0 ? "0" : "$radius + $popover-padding"), - - $("font-size", `${options.font.size}pt`), - $("font-name", options.font.name), - - // etc - $("charging-bg", options.bar.battery.charging), - $("bar-battery-blocks", options.bar.battery.blocks), - $("bar-position", options.bar.position), - $("hyprland-gaps-multiplier", options.hyprland.gaps), -] - -async function resetCss() { - if (!dependencies("sass", "fd")) - return - - try { - const vars = `${TMP}/variables.scss` - await Utils.writeFile(variables().join("\n"), vars) - - const fd = await sh(`fd ".scss" ${App.configDir}`) - const files = fd.split(/\s+/).map(f => `@import '${f}';`) - const scss = [`@import '${vars}';`, ...files].join("\n") - const css = await bash`echo "${scss}" | sass --stdin` - - App.applyCss(css, true) - } catch (error) { - logError(error) - } -} - -Utils.monitorFile(App.configDir, resetCss) -options.handler(deps, resetCss) -await resetCss() |
