LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement styling options for all the bar components (not menus) through options variables.

Browse Source
This commit is contained in:
Jas Singh
2024-07-17 01:44:50 -07:00
parent f4ff5bba27
commit 50eeb4275d
64 changed files with 783 additions and 2074 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
scss/bar/audio.scss
View File

@@ -1,10 +0,0 @@
@import '../colors';
.bar-volume_icon {
font-size: 1.3em;
color: $maroon;
}
.bar-volume_percentage {
color: $maroon;
}

31
scss/bar/bar.scss
View File

@@ -1,31 +0,0 @@
@import "../colors";
.bar {
background: $crust;
}
.bar_item_box_visible {
background-color: $base2;
border-radius: 0.35em;
padding: 0.2rem 0.9rem;
margin: 0.5rem 0.25rem;
&:hover {
background: $surface1;
}
}
.bar_item_box_hidden {
background: none;
border-radius: 0rem;
padding: 0rem 0rem 0rem 0rem;
margin: 0rem 0rem 0rem 0rem;
}
.box-left {
margin-left: 1.9rem;
}
.box-right {
margin-right: 1.9rem;
}

19
scss/bar/battery.scss
View File

@@ -1,19 +0,0 @@
@import '../colors';
.bar {
.battery {
label {
color: $yellow;
}
image {
color: $yellow;
}
}
}
.menu-section-container.brightness {
margin-bottom: 0em;
}
.menu-section-container.energy {
margin-top: 0.5em;
}

21
scss/bar/bluetooth.scss
View File

@@ -1,21 +0,0 @@
@import '../colors';
.bar-bt_icon {
font-size: 1.15em;
color: $sky;
}
.bar-bt_label {
color: $sky;
}
.bluetooth-disabled-menu {
font-weight: bold;
font-size: 1.1rem;
color: $surface2;
margin: 6rem 0rem;
}
.menu-button-isactive {
color: $sky;
}

5
scss/bar/clock.scss
View File

@@ -1,5 +0,0 @@
@import "../colors";
.clock {
color: $pink;
}

10
scss/bar/media.scss
View File

@@ -1,10 +0,0 @@
@import "../colors";
.media {
color: $lavender;
}
.bar-media_icon {
font-size: 1.2em;
color: $lavender;
}

6
scss/bar/menu.scss
View File

@@ -1,6 +0,0 @@
@import "../colors";
.bar-menu_label {
color: $yellow;
font-size: 1.3em;
}

5
scss/bar/network.scss
View File

@@ -1,5 +0,0 @@
@import "../colors";
.bar-network {
color: $mauve;
}

7
scss/bar/notifications.scss
View File

@@ -1,7 +0,0 @@
@import "../colors";
.bar-notifications-label {
color: $lavender;
font-size: 1.3em;
min-width: 1em;
}

6
scss/bar/power.scss
View File

@@ -1,6 +0,0 @@
@import "../colors";
.bar-power_label {
color: $red;
margin-top: 0.2rem;
}

5
scss/bar/window_title.scss
View File

@@ -1,5 +0,0 @@
@import "../colors";
.window_title {
color: $pink;
}

33
scss/bar/workspace.scss
View File

@@ -1,33 +0,0 @@
@import "../colors";
.workspaces {
label {
font-size: 0.2em;
min-width: 4em;
min-height: 4em;
border-radius: 1.9rem * .6;
margin: 0rem 0.5rem * .5;
transition: 300ms * .5;
background-color: $sky;
color: $sky;
&.occupied {
background-color: $flamingo;
color: $flamingo;
min-width: 4em;
min-height: 4em;
}
&.active {
color: $pink;
background-color: $pink;
min-width: 12em;
min-height: 4em;
}
}
}
.workspaces label:not(:first-child) {
margin-left: 4.5em;
}

43
scss/entry.scss Normal file
View File

@@ -0,0 +1,43 @@
@import '/home/jaskir/.config/ags/scss/variables.scss';
* {
all: unset;
font-family: "Ubuntu Nerd Font";
font-size: 1.2rem;
font-weight: 600;
}
//general
@import "style/colors";
@import "style/common/common.scss";
@import "style/common/floating-widget.scss";
@import "style/common/widget-button.scss";
//modules - bar
@import "style/bar/menu";
@import "style/bar/audio";
@import "style/bar/media";
@import "style/bar/network";
@import "style/bar/bluetooth";
@import "style/bar/clock";
@import "style/bar/workspace";
@import "style/bar/window_title";
@import "style/bar/systray";
@import "style/bar/notifications";
@import "style/bar/power";
@import "style/bar/bar";
@import "style/bar/battery";
//modules - menus
@import "style/menus/menu";
@import "style/menus/power";
@import "style/menus/audiomenu";
@import "style/menus/network";
@import "style/menus/bluetooth";
@import "style/menus/media";
@import "style/menus/notifications";
@import "style/menus/calendar";
@import "style/menus/energy";
@import "style/menus/dashboard";
//notifications
@import "style/notifications/popups";

71
scss/main.scss
View File

@@ -6,52 +6,37 @@
}
//general
@import "colors";
@import "../scss/common/common.scss";
@import "../scss/common/floating-widget.scss";
@import "../scss/common/widget-button.scss";
@import "style/colors";
@import "style/common/common.scss";
@import "style/common/floating-widget.scss";
@import "style/common/widget-button.scss";
//modules - bar
@import "bar/menu";
@import "bar/audio";
@import "bar/media";
@import "bar/network";
@import "bar/bluetooth";
@import "bar/clock";
@import "bar/workspace";
@import "bar/window_title";
@import "bar/systray";
@import "bar/notifications";
@import "bar/power";
@import "bar/bar";
@import "bar/battery";
@import "style/bar/menu";
@import "style/bar/audio";
@import "style/bar/media";
@import "style/bar/network";
@import "style/bar/bluetooth";
@import "style/bar/clock";
@import "style/bar/workspace";
@import "style/bar/window_title";
@import "style/bar/systray";
@import "style/bar/notifications";
@import "style/bar/power";
@import "style/bar/bar";
@import "style/bar/battery";
//modules - menus
@import "menus/menu";
@import "menus/power";
@import "menus/audiomenu";
@import "menus/network";
@import "menus/bluetooth";
@import "menus/media";
@import "menus/notifications";
@import "menus/calendar";
@import "menus/energy";
@import "menus/dashboard";
@import "style/menus/menu";
@import "style/menus/power";
@import "style/menus/audiomenu";
@import "style/menus/network";
@import "style/menus/bluetooth";
@import "style/menus/media";
@import "style/menus/notifications";
@import "style/menus/calendar";
@import "style/menus/energy";
@import "style/menus/dashboard";
//notifications
@import "notifications/popups";
// Eventbox styling for debugging purposes
// .parent-event {
// background-color: $red;
// }
// .mid-eb {
// background-color: $red;
// }
// .in-eb {
// background-color: $red;
// }
// .main-eb {
// background-color: $red;
// }
//
@import "style/notifications/popups";

76
scss/style.ts Normal file
View File

@@ -0,0 +1,76 @@
/* eslint-disable max-len */
import { exec } from "resource:///com/github/Aylur/ags/utils.js";
import { type Opt } from "lib/option"
import options from "options"
import { bash, dependencies } from "lib/utils"
const deps = [
"font",
"theme",
"bar.flatButtons",
"bar.position",
"bar.battery.charging",
"bar.battery.blocks",
]
const $ = (name: string, value: string | Opt<any>) => `$${name}: ${value};`
function extractVariables(theme: any, prefix: string = ""): string[] {
let result: string[] = [];
for (let key in theme) {
if (theme.hasOwnProperty(key)) {
const value = theme[key];
const newPrefix = prefix ? `${prefix}-${key}` : key;
if (typeof value === 'object' && value !== null && !Array.isArray(value)) {
// Check if the object contains an Opt value or is a nested object
if (typeof value.value !== 'undefined') {
result.push($(`${newPrefix}`, `${value.value}`));
} else {
result = result.concat(extractVariables(value, newPrefix));
}
} else if (typeof value === 'function' && value.name === 'opt') {
result.push($(`${newPrefix}`, value));
}
}
}
return result;
}
const variables = () => [
...extractVariables(options.theme)
];
async function resetCss() {
if (!dependencies("sass", "fd"))
return
try {
const vars = `${App.configDir}/scss/variables.scss`
const css = `${TMP}/main.css`
const scss = `${App.configDir}/scss/entry.scss`
const localScss = `${App.configDir}/scss/main.scss`;
const imports = [vars].map(f => `@import '${f}';`)
console.log(variables());
await Utils.writeFile(variables().join("\n"), vars)
let mainScss = await Utils.readFile(localScss);
mainScss = `${imports}\n${mainScss}`;
await Utils.writeFile(mainScss, scss)
await bash(`sass ${scss} ${css}`);
App.applyCss(css, true);
} catch (error) {
error instanceof Error
? logError(error)
: console.error(error)
}
}
Utils.monitorFile(`${App.configDir}/scss/style`, resetCss)
options.handler(deps, resetCss)
await resetCss()

11
scss/style/bar/audio.scss Normal file
View File

@@ -0,0 +1,11 @@
@import '../colors';
@import '../../variables';
.bar-volume_icon {
font-size: 1.3em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-icon);
}
.bar-volume_percentage {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-text);
}

108
scss/style/bar/bar.scss Normal file
View File

@@ -0,0 +1,108 @@
@import "../colors";
@import "../../variables";
.bar {
background: if($bar-transparent, transparent, $bar-background);
.transparent {
background: transparent;
}
}
.bar_item_box_visible {
background-color: $bar-buttons-background;
border-radius: 0.35em;
padding: 0.2rem 0.9rem;
margin: 0.5rem 0.25rem;
&:hover {
background: $bar-buttons-hover;
}
&.battery {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-battery-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-battery-background);
}
}
&.bluetooth {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-bluetooth-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-bluetooth-background);
}
}
&.clock {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-clock-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-clock-background);
}
}
&.media {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-media-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-media-background);
}
}
&.dashboard {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-dashboard-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-dashboard-background);
}
}
&.network {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-network-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-network-background);
}
}
&.notifications {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-notifications-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-notifications-background);
}
}
&.power {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-power-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-power-background);
}
}
&.systray {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-systray-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-systray-background);
}
}
&.volume {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-volume-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-volume-background);
}
}
&.windowtitle {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-windowtitle-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-windowtitle-background);
}
}
&.workspaces {
background-color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-workspaces-background);
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-workspaces-background);
}
}
}
.bar_item_box_hidden {
background: none;
border-radius: 0rem;
padding: 0rem 0rem 0rem 0rem;
margin: 0rem 0rem 0rem 0rem;
}
.box-left {
margin-left: 1.9rem;
}
.box-right {
margin-right: 1.9rem;
}

20
scss/style/bar/battery.scss Normal file
View File

@@ -0,0 +1,20 @@
@import '../colors';
@import '../../variables';
.bar {
.battery {
label {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-battery-text);
}
image {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-battery-icon);
}
}
}
.menu-section-container.brightness {
margin-bottom: 0em;
}
.menu-section-container.energy {
margin-top: 0.5em;
}

22
scss/style/bar/bluetooth.scss Normal file
View File

@@ -0,0 +1,22 @@
@import '../colors';
@import '../../variables';
.bar-bt_icon {
font-size: 1.15em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-bluetooth-icon);
}
.bar-bt_label {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-bluetooth-text);
}
.bluetooth-disabled-menu {
font-weight: bold;
font-size: 1.1rem;
color: $surface2;
margin: 6rem 0rem;
}
.menu-button-isactive {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-bluetooth-text);
}

6
scss/style/bar/clock.scss Normal file
View File

@@ -0,0 +1,6 @@
@import "../colors";
@import '../../variables';
.clock {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-clock-text);
}

11
scss/style/bar/media.scss Normal file
View File

@@ -0,0 +1,11 @@
@import "../colors";
@import '../../variables';
.media {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-media-text);
}
.bar-media_icon {
font-size: 1.2em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-media-icon);
}

7
scss/style/bar/menu.scss Normal file
View File

@@ -0,0 +1,7 @@
@import "../colors";
@import '../../variables';
.bar-menu_label {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-dashboard-icon);
font-size: 1.3em;
}

10
scss/style/bar/network.scss Normal file
View File

@@ -0,0 +1,10 @@
@import "../colors";
@import '../../variables';
.bar-network-label {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-network-text);
}
.bar-network-icon {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-network-icon);
}

7
scss/style/bar/notifications.scss Normal file
View File

@@ -0,0 +1,7 @@
@import "../colors";
.bar-notifications-label {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-notifications-icon);
font-size: 1.3em;
min-width: 1em;
}

7
scss/style/bar/power.scss Normal file
View File

@@ -0,0 +1,7 @@
@import "../colors";
@import '../../variables';
.bar-power_label {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-power-icon);
margin-top: 0.2rem;
}

0
scss/bar/systray.scss → scss/style/bar/systray.scss
View File

6
scss/style/bar/window_title.scss Normal file
View File

@@ -0,0 +1,6 @@
@import "../colors";
@import '../../variables';
.window_title {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-windowtitle-text);
}

34
scss/style/bar/workspace.scss Normal file
View File

@@ -0,0 +1,34 @@
@import "../colors";
@import '../../variables';
.workspaces {
label {
font-size: 0.2em;
min-width: 4em;
min-height: 4em;
border-radius: 1.9rem * .6;
margin: 0rem 0.5rem * .5;
transition: 300ms * .5;
background-color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-workspaces-available);
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-workspaces-available);
&.occupied {
background-color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-workspaces-occupied);
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-workspaces-occupied);
min-width: 4em;
min-height: 4em;
}
&.active {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-workspaces-active);
background-color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-workspaces-active);
min-width: 12em;
min-height: 4em;
}
}
}
.workspaces label:not(:first-child) {
margin-left: 4.5em;
}

0
scss/colors.scss → scss/style/colors.scss
View File

0
scss/common/common.scss → scss/style/common/common.scss
View File

0
scss/common/floating-widget.scss → scss/style/common/floating-widget.scss
View File

0
scss/common/widget-button.scss → scss/style/common/widget-button.scss
View File

43
scss/style/entry.scss Normal file
View File

@@ -0,0 +1,43 @@
@import '/tmp/ags/hyprpanel/variables.scss';
* {
all: unset;
font-family: "Ubuntu Nerd Font";
font-size: 1.2rem;
font-weight: 600;
}
//general
@import "../scss/colors";
@import "../scss/common/common.scss";
@import "../scss/common/floating-widget.scss";
@import "../scss/common/widget-button.scss";
//modules - bar
@import "bar/menu";
@import "bar/audio";
@import "bar/media";
@import "bar/network";
@import "bar/bluetooth";
@import "bar/clock";
@import "bar/workspace";
@import "bar/window_title";
@import "bar/systray";
@import "bar/notifications";
@import "bar/power";
@import "bar/bar";
@import "bar/battery";
//modules - menus
@import "menus/menu";
@import "menus/power";
@import "menus/audiomenu";
@import "menus/network";
@import "menus/bluetooth";
@import "menus/media";
@import "menus/notifications";
@import "menus/calendar";
@import "menus/energy";
@import "menus/dashboard";
//notifications
@import "notifications/popups";

0
scss/highlights.scss → scss/style/highlights.scss
View File

0
scss/menus/audiomenu.scss → scss/style/menus/audiomenu.scss
View File

0
scss/menus/bluetooth.scss → scss/style/menus/bluetooth.scss
View File

0
scss/menus/calendar.scss → scss/style/menus/calendar.scss
View File

0
scss/menus/dashboard.scss → scss/style/menus/dashboard.scss
View File

0
scss/menus/energy.scss → scss/style/menus/energy.scss
View File

0
scss/menus/media.scss → scss/style/menus/media.scss
View File

0
scss/menus/menu.scss → scss/style/menus/menu.scss
View File

0
scss/menus/network.scss → scss/style/menus/network.scss
View File

0
scss/menus/notifications.scss → scss/style/menus/notifications.scss
View File

0
scss/menus/power.scss → scss/style/menus/power.scss
View File

0
scss/notifications/popups.scss → scss/style/notifications/popups.scss
View File

280
scss/variables.scss Normal file
View File

@@ -0,0 +1,280 @@
$notification-background: #1e1e2e;
$notification-actions-background: #313244;
$notification-actions-hover: #45475a;
$notification-actions-text: #181825;
$notification-label: #b4befe;
$notification-date: #7f849c;
$notification-text: #cdd6f4;
$notification-labelicon: #b4befe;
$notification-close: #f38ba8;
$bar-transparent: false;
$bar-background: #11111b;
$bar-buttons-monochrome: false;
$bar-buttons-background: #242438;
$bar-buttons-hover: #45475a;
$bar-buttons-text: #b4befe;
$bar-buttons-icon: #b4befe;
$bar-buttons-dashboard-background: #242438;
$bar-buttons-dashboard-hover: #45475a;
$bar-buttons-dashboard-icon: #f9e2af;
$bar-buttons-workspaces-background: #242438;
$bar-buttons-workspaces-hover: #45475a;
$bar-buttons-workspaces-available: #89dceb;
$bar-buttons-workspaces-occupied: #f2cdcd;
$bar-buttons-workspaces-active: #f5c2e7;
$bar-buttons-windowtitle-background: #242438;
$bar-buttons-windowtitle-hover: #45475a;
$bar-buttons-windowtitle-text: #f5c2e7;
$bar-buttons-windowtitle-icon: #f5c2e7;
$bar-buttons-media-background: #242438;
$bar-buttons-media-hover: #45475a;
$bar-buttons-media-text: #b4befe;
$bar-buttons-media-icon: #b4befe;
$bar-buttons-volume-background: #242438;
$bar-buttons-volume-hover: #45475a;
$bar-buttons-volume-text: #eba0ac;
$bar-buttons-volume-icon: #eba0ac;
$bar-buttons-network-background: #242438;
$bar-buttons-network-hover: #45475a;
$bar-buttons-network-text: #cba6f7;
$bar-buttons-network-icon: #cba6f7;
$bar-buttons-bluetooth-background: #242438;
$bar-buttons-bluetooth-hover: #45475a;
$bar-buttons-bluetooth-text: #89dceb;
$bar-buttons-bluetooth-icon: #89dceb;
$bar-buttons-systray-background: #242438;
$bar-buttons-systray-hover: #45475a;
$bar-buttons-power-background: #242438;
$bar-buttons-power-hover: #45475a;
$bar-buttons-power-icon: #f38ba8;
$bar-buttons-battery-background: #242438;
$bar-buttons-battery-hover: #45475a;
$bar-buttons-battery-text: #f9e2af;
$bar-buttons-battery-icon: #f9e2af;
$bar-buttons-clock-background: #242438;
$bar-buttons-clock-hover: #45475a;
$bar-buttons-clock-text: #f5c2e7;
$bar-buttons-clock-icon: #f5c2e7;
$bar-buttons-notifications-background: #242438;
$bar-buttons-notifications-hover: #45475a;
$bar-buttons-notifications-icon: #b4befe;
$bar-menus-monochrome: true;
$bar-menus-background: #11111b;
$bar-menus-cards: #1e1e2e;
$bar-menus-border: #313244;
$bar-menus-text: #cdd6f4;
$bar-menus-label: #b4befe;
$bar-menus-listitems-passive: #cdd6f4;
$bar-menus-listitems-active: #b4befe;
$bar-menus-icons-passive: #9399b2;
$bar-menus-icons-active: #b4befe;
$bar-menus-switch-enabled: #b4befe;
$bar-menus-switch-disabled: #313244;
$bar-menus-switch-puck: #6c7086;
$bar-menus-buttons-default: #b4befe;
$bar-menus-buttons-hover: #f5c2e7;
$bar-menus-buttons-text: #11111b;
$bar-menus-dashboard-background: #242438;
$bar-menus-dashboard-text: #f9e2af;
$bar-menus-workspaces-background: #242438;
$bar-menus-workspaces-available: #89dceb;
$bar-menus-workspaces-occupied: #f2cdcd;
$bar-menus-workspaces-active: #f5c2e7;
$bar-menus-progressbar: #b4befe;
$bar-menus-slider-primary: #b4befe;
$bar-menus-slider-background: #585b70;
$bar-menus-slider-backgroundhover: #45475a;
$bar-menus-slider-puck: #6c7086;
$bar-menus-dropdownmenu-background: #11111b;
$bar-menus-dropdownmenu-text: #cdd6f4;
$bar-menus-dropdownmenu-divider: #1e1e2e;
$bar-menus-tooltip-background: #11111b;
$bar-menus-tooltip-text: #cdd6f4;
$bar-menus-menu-media-song: #242438;
$bar-menus-menu-media-artist: #242438;
$bar-menus-menu-media-album: #242438;
$bar-menus-menu-media-buttons-inactive-background: #585b70;
$bar-menus-menu-media-buttons-inactive-text: #11111b;
$bar-menus-menu-media-buttons-shuffle-background: #b4befe;
$bar-menus-menu-media-buttons-shuffle-hover: #f5c2e7;
$bar-menus-menu-media-buttons-shuffle-active: #f5c2e7;
$bar-menus-menu-media-buttons-shuffle-text: #11111b;
$bar-menus-menu-media-buttons-previous-background: #b4befe;
$bar-menus-menu-media-buttons-previous-hover: #f5c2e7;
$bar-menus-menu-media-buttons-previous-text: #11111b;
$bar-menus-menu-media-buttons-playpause-background: #b4befe;
$bar-menus-menu-media-buttons-playpause-hover: #f5c2e7;
$bar-menus-menu-media-buttons-playpause-text: #11111b;
$bar-menus-menu-media-buttons-next-background: #b4befe;
$bar-menus-menu-media-buttons-next-hover: #f5c2e7;
$bar-menus-menu-media-buttons-next-text: #11111b;
$bar-menus-menu-media-buttons-loop-background: #b4befe;
$bar-menus-menu-media-buttons-loop-hover: #f5c2e7;
$bar-menus-menu-media-buttons-loop-active: #f5c2e7;
$bar-menus-menu-media-buttons-loop-text: #11111b;
$bar-menus-menu-media-slider-primary: #f5c2e7;
$bar-menus-menu-media-slider-background: #585b70;
$bar-menus-menu-media-slider-backgroundhover: #45475a;
$bar-menus-menu-media-slider-puck: #6c7086;
$bar-menus-menu-volume-card-color: #1e1e2e;
$bar-menus-menu-volume-background-color: #11111b;
$bar-menus-menu-volume-border-color: #313244;
$bar-menus-menu-volume-label-color: #eba0ac;
$bar-menus-menu-volume-text: #cdd6f4;
$bar-menus-menu-volume-listitems-passive: #cdd6f4;
$bar-menus-menu-volume-listitems-active: #eba0ac;
$bar-menus-menu-volume-icons-passive: #9399b2;
$bar-menus-menu-volume-icons-active: #eba0ac;
$bar-menus-menu-volume-icons-hover: #eba0ac;
$bar-menus-menu-volume-audio_slider-primary: #eba0ac;
$bar-menus-menu-volume-audio_slider-background: #585b70;
$bar-menus-menu-volume-audio_slider-backgroundhover: #45475a;
$bar-menus-menu-volume-audio_slider-puck: #6c7086;
$bar-menus-menu-volume-input_slider-primary: #eba0ac;
$bar-menus-menu-volume-input_slider-background: #585b70;
$bar-menus-menu-volume-input_slider-backgroundhover: #45475a;
$bar-menus-menu-volume-input_slider-puck: #6c7086;
$bar-menus-menu-network-card-color: #1e1e2e;
$bar-menus-menu-network-background-color: #11111b;
$bar-menus-menu-network-border-color: #313244;
$bar-menus-menu-network-label-color: #cba6f7;
$bar-menus-menu-network-text: #cdd6f4;
$bar-menus-menu-network-status-color: #6c7086;
$bar-menus-menu-network-listitems-passive: #cdd6f4;
$bar-menus-menu-network-listitems-active: #cba6f7;
$bar-menus-menu-network-icons-passive: #9399b2;
$bar-menus-menu-network-icons-active: #cba6f7;
$bar-menus-menu-network-icons-hover: #cba6f7;
$bar-menus-menu-network-iconbuttons-passive: #cdd6f4;
$bar-menus-menu-network-iconbuttons-hover: #cba6f7;
$bar-menus-menu-bluetooth-card-color: #1e1e2e;
$bar-menus-menu-bluetooth-background-color: #11111b;
$bar-menus-menu-bluetooth-border-color: #313244;
$bar-menus-menu-bluetooth-label-color: #89dceb;
$bar-menus-menu-bluetooth-text: #cdd6f4;
$bar-menus-menu-bluetooth-status: #6c7086;
$bar-menus-menu-bluetooth-switch_divider: #45475a;
$bar-menus-menu-bluetooth-switch-enabled: #89dceb;
$bar-menus-menu-bluetooth-switch-disabled: #313244;
$bar-menus-menu-bluetooth-switch-puck: #6c7086;
$bar-menus-menu-bluetooth-listitems-passive: #cdd6f4;
$bar-menus-menu-bluetooth-listitems-active: #89dceb;
$bar-menus-menu-bluetooth-icons-passive: #9399b2;
$bar-menus-menu-bluetooth-icons-active: #89dceb;
$bar-menus-menu-bluetooth-icons-hover: #89dceb;
$bar-menus-menu-bluetooth-iconbuttons-passive: #cdd6f4;
$bar-menus-menu-bluetooth-iconbuttons-hover: #89dceb;
$bar-menus-menu-systray-background-color: #242438;
$bar-menus-menu-systray-dropdownmenu-background: #11111b;
$bar-menus-menu-systray-dropdownmenu-text: #cdd6f4;
$bar-menus-menu-systray-dropdownmenu-divider: #1e1e2e;
$bar-menus-menu-battery-card-color: #1e1e2e;
$bar-menus-menu-battery-background-color: #11111b;
$bar-menus-menu-battery-border-color: #313244;
$bar-menus-menu-battery-label-color: #f9e2af;
$bar-menus-menu-battery-text: #cdd6f4;
$bar-menus-menu-battery-listitems-passive: #cdd6f4;
$bar-menus-menu-battery-listitems-active: #f9e2af;
$bar-menus-menu-battery-icons-passive: #9399b2;
$bar-menus-menu-battery-icons-active: #f9e2af;
$bar-menus-menu-battery-icons-hover: #f9e2af;
$bar-menus-menu-clock-card-color: #1e1e2e;
$bar-menus-menu-clock-background-color: #11111b;
$bar-menus-menu-clock-border-color: #313244;
$bar-menus-menu-clock-text: #cdd6f4;
$bar-menus-menu-clock-time-time: #f5c2e7;
$bar-menus-menu-clock-time-timeperiod: #94e2d5;
$bar-menus-menu-clock-calendar-yearmonth: #94e2d5;
$bar-menus-menu-clock-calendar-weekdays: #f5c2e7;
$bar-menus-menu-clock-calendar-paginator: #f5c2e7;
$bar-menus-menu-clock-calendar-days: #cdd6f4;
$bar-menus-menu-clock-calendar-contextdays: #585b70;
$bar-menus-menu-clock-weather-icon: #f5c2e7;
$bar-menus-menu-clock-weather-temperature: #cdd6f4;
$bar-menus-menu-clock-weather-status: #94e2d5;
$bar-menus-menu-clock-weather-stats: #f5c2e7;
$bar-menus-menu-clock-weather-thermometer-extremelyhot: #f38ba8;
$bar-menus-menu-clock-weather-thermometer-hot: #fab387;
$bar-menus-menu-clock-weather-thermometer-moderate: #b4befe;
$bar-menus-menu-clock-weather-thermometer-cold: #89b4fa;
$bar-menus-menu-clock-weather-thermometer-extremelycold: #89dceb;
$bar-menus-menu-clock-weather-hourly-time: #f5c2e7;
$bar-menus-menu-clock-weather-hourly-icon: #f5c2e7;
$bar-menus-menu-clock-weather-hourly-temperature: #f5c2e7;
$bar-menus-menu-dashboard-card-color: #1e1e2e;
$bar-menus-menu-dashboard-background-color: #11111b;
$bar-menus-menu-dashboard-border-color: #313244;
$bar-menus-menu-dashboard-profile-card: #1e1e2e;
$bar-menus-menu-dashboard-profile-name: #f5c2e7;
$bar-menus-menu-dashboard-powermenu-shutdown: #f38ba8;
$bar-menus-menu-dashboard-powermenu-restart: #fab387;
$bar-menus-menu-dashboard-powermenu-logout: #a6e3a1;
$bar-menus-menu-dashboard-powermenu-sleep: #89dceb;
$bar-menus-menu-dashboard-powermenu-confirmation-card: #1e1e2e;
$bar-menus-menu-dashboard-powermenu-confirmation-background: #11111b;
$bar-menus-menu-dashboard-powermenu-confirmation-border: #313244;
$bar-menus-menu-dashboard-powermenu-confirmation-label: #a6e3a1;
$bar-menus-menu-dashboard-powermenu-confirmation-body: #cdd6f4;
$bar-menus-menu-dashboard-powermenu-confirmation-confirm: #a6e3a1;
$bar-menus-menu-dashboard-powermenu-confirmation-deny: #f38ba8;
$bar-menus-menu-dashboard-shortcuts_left-shortcut1-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_left-shortcut1-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_left-shortcut1-text: #11111b;
$bar-menus-menu-dashboard-shortcuts_left-shortcut2-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_left-shortcut2-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_left-shortcut2-text: #11111b;
$bar-menus-menu-dashboard-shortcuts_left-shortcut3-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_left-shortcut3-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_left-shortcut3-text: #11111b;
$bar-menus-menu-dashboard-shortcuts_left-shortcut4-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_left-shortcut4-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_left-shortcut4-text: #11111b;
$bar-menus-menu-dashboard-shortcuts_right-shortcut1-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_right-shortcut1-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_right-shortcut1-text: #11111b;
$bar-menus-menu-dashboard-shortcuts_right-shortcut2-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_right-shortcut2-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_right-shortcut2-text: #11111b;
$bar-menus-menu-dashboard-shortcuts_right-shortcut3-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_right-shortcut3-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_right-shortcut3-text: #11111b;
$bar-menus-menu-dashboard-shortcuts_right-shortcut4-background: #b4befe;
$bar-menus-menu-dashboard-shortcuts_right-shortcut4-hover: #f5c2e7;
$bar-menus-menu-dashboard-shortcuts_right-shortcut4-text: #11111b;
$bar-menus-menu-dashboard-controls-wifi-background: #cba6f7;
$bar-menus-menu-dashboard-controls-wifi-text: #11111b;
$bar-menus-menu-dashboard-controls-bluetooth-background: #89dceb;
$bar-menus-menu-dashboard-controls-bluetooth-text: #11111b;
$bar-menus-menu-dashboard-controls-notifications-background: #f9e2af;
$bar-menus-menu-dashboard-controls-notifications-text: #11111b;
$bar-menus-menu-dashboard-controls-volume-background: #eba0ac;
$bar-menus-menu-dashboard-controls-volume-text: #11111b;
$bar-menus-menu-dashboard-controls-input-background: #f5c2e7;
$bar-menus-menu-dashboard-controls-input-text: #11111b;
$bar-menus-menu-dashboard-directories-left-top-color: #f5c2e7;
$bar-menus-menu-dashboard-directories-left-middle-color: #f9e2af;
$bar-menus-menu-dashboard-directories-left-bottom-color: #eba0ac;
$bar-menus-menu-dashboard-directories-right-top-color: #94e2d5;
$bar-menus-menu-dashboard-directories-right-middle-color: #cba6f7;
$bar-menus-menu-dashboard-directories-right-bottom-color: #b4befe;
$bar-menus-menu-dashboard-monitors-cpu-icon: #eba0ac;
$bar-menus-menu-dashboard-monitors-cpu-bar: #eba0ac;
$bar-menus-menu-dashboard-monitors-cpu-label: #eba0ac;
$bar-menus-menu-dashboard-monitors-ram-icon: #f9e2af;
$bar-menus-menu-dashboard-monitors-ram-bar: #f9e2af;
$bar-menus-menu-dashboard-monitors-ram-label: #f9e2af;
$bar-menus-menu-dashboard-monitors-gpu-icon: #a6e3a1;
$bar-menus-menu-dashboard-monitors-gpu-bar: #a6e3a1;
$bar-menus-menu-dashboard-monitors-gpu-label: #a6e3a1;
$bar-menus-menu-dashboard-monitors-disk-icon: #f5c2e7;
$bar-menus-menu-dashboard-monitors-disk-bar: #f5c2e7;
$bar-menus-menu-dashboard-monitors-disk-label: #f5c2e7;
$bar-menus-menu-notifications-background: #181825;
$bar-menus-menu-notifications-card: #1e1e2e;
$bar-menus-menu-notifications-border: #313244;
$bar-menus-menu-notifications-switch_divider: #45475a;
$bar-menus-menu-notifications-switch-enabled: #b4befe;
$bar-menus-menu-notifications-switch-disabled: #313244;
$bar-menus-menu-notifications-switch-puck: #6c7086;
$bar-menus-menu-notifications-clear-background: #f38ba8;
$bar-menus-menu-notifications-clear-font: #11111b;