diff options
| author | 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com> | 2025-03-26 20:22:51 +1100 |
|---|---|---|
| committer | 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com> | 2025-03-26 20:22:51 +1100 |
| commit | 5a1ea91e35487dc877a4422c31c2e225b4ec2aef (patch) | |
| tree | 5f95a8e3a9717569164d7059217d3fd3e1a2dffe /scss/sidebar.scss | |
| parent | sidebar: fix negative content width warnings (diff) | |
| download | caelestia-shell-5a1ea91e35487dc877a4422c31c2e225b4ec2aef.tar.gz caelestia-shell-5a1ea91e35487dc877a4422c31c2e225b4ec2aef.tar.bz2 caelestia-shell-5a1ea91e35487dc877a4422c31c2e225b4ec2aef.zip | |
sidebar: networks module
Diffstat (limited to 'scss/sidebar.scss')
| -rw-r--r-- | scss/sidebar.scss | 61 |
1 files changed, 61 insertions, 0 deletions
diff --git a/scss/sidebar.scss b/scss/sidebar.scss index 8611ed9..ffbd0f8 100644 --- a/scss/sidebar.scss +++ b/scss/sidebar.scss @@ -284,6 +284,67 @@ } } + .networks { + .list { + @include lib.spacing(10, true); + } + + .network { + @include lib.rounded(20); + + background-color: color.change(scheme.$surface1, $alpha: 0.4); + padding: lib.s(10) lib.s(15); + + @include lib.spacing(5); + + &.connected { + background-color: color.change(color.mix(scheme.$surface1, scheme.$primary, 50%), $alpha: 0.4); + + & > button { + background-color: color.change(color.mix(scheme.$surface1, scheme.$primary, 50%), $alpha: 0.5); + + &:hover, + &:focus { + background-color: color.change(color.mix(scheme.$surface1, scheme.$primary, 30%), $alpha: 0.5); + } + + &:active { + background-color: color.change(color.mix(scheme.$surface1, scheme.$primary, 20%), $alpha: 0.5); + } + } + } + + .icon { + font-size: lib.s(28); + margin-right: lib.s(12); + } + + .sublabel { + font-size: lib.s(14); + color: scheme.$subtext0; + } + + & > button { + @include lib.rounded(1000); + @include lib.element-decel; + @include font.icon; + + font-size: lib.s(18); + min-width: lib.s(30); + min-height: lib.s(30); + background-color: color.change(scheme.$surface1, $alpha: 0.5); + + &:hover, + &:focus { + background-color: color.change(scheme.$surface2, $alpha: 0.5); + } + + &:active { + background-color: color.change(scheme.$overlay0, $alpha: 0.5); + } + } + } + } .bluetooth { .list { |