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

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;
}

30
scss/style/bar/systray.scss Normal file
View File

@@ -0,0 +1,30 @@
@import "../colors";
.systray button:not(:first-child) {
margin-left: 0.75rem;
}
.systray-menu {
background: $crust;
}
.systray-menu label {
font-weight: bold;
color: $text;
}
.systray-menu separator {
background-color: $surface1;
}
.systray-menu check:not(:checked) {
background-color: $surface0;
border: 1px solid $lavender;
}
.systray-menu check:checked {
background-color: $lavender;
}
.systray-icon {
font-size: 1.3em;
}

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;
}