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

Added 3 new styles for bar buttons. (#168)

Browse Source 
* Added a new style called split for bar buttons

* Added wavy button styles.

* Added padding configuration

* Update bar padding

* Fix styling for battery style2

* Fix icon only setting for bar

* Update types and options

* Add button style to exported theme props.

* Fix top margin for menus.
This commit is contained in:
Jas Singh
2024-08-24 00:01:21 -07:00
committed by GitHub
parent c0d9c594c9
commit 2908ff7dd6
31 changed files with 459 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
scss/style/bar/bar.scss
View File

@@ -28,9 +28,19 @@ $transparency-value-hover: 1 - $bar-button-background-hover-opacity-ratio;
.bar_item_box_visible {
background-color: transparentize($bar-buttons-background, $transparency-value);
border-radius: $bar-buttons-radius;
padding: 0.2rem 0.9rem;
margin: $bar-buttons-y_margins $bar-buttons-spacing;
opacity: $bar-buttons-opacity/100;
padding: $bar-buttons-padding_y $bar-buttons-padding_x;
&.style3 {
border-bottom-left-radius: 1.3em;
border-top-right-radius: 1.3em;
}
&.style4 {
border-bottom-right-radius: 1.3em;
border-top-left-radius: 1.3em;
}
&:hover {
background: transparentize($bar-buttons-hover, $transparency-value-hover);
@@ -119,6 +129,61 @@ $transparency-value-hover: 1 - $bar-button-background-hover-opacity-ratio;
&.workspaces {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-workspaces-background), $transparency-value);
}
&.style2 {
padding: 0em;
&:hover {
.dashboard .bar-button_icon {
color: $bar-buttons-dashboard_background;
}
}
&:hover .no-label {
.battery .bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-battery-hover), $transparency-value);
color: $bar-buttons-battery-icon_background;
}
.bluetooth.bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-bluetooth-hover), $transparency-value);
color: $bar-buttons-bluetooth-icon_background;
}
.media.bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-media-hover), $transparency-value);
color: $bar-buttons-media-icon_background;
}
.network.bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-network-hover), $transparency-value);
color: $bar-buttons-network-icon_background;
}
.notifications.bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-notifications-hover), $transparency-value);
color: $bar-buttons-notifications-icon_background;
}
.volume.bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-volume-hover), $transparency-value);
color: $bar-buttons-volume-icon_background;
}
.windowtitle.bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-windowtitle-hover), $transparency-value);
color: $bar-buttons-windowtitle-icon_background;
}
}
}
}
.no-label.style2 {
.bar-button-icon {
border-top-right-radius: $bar-buttons-radius;
border-bottom-right-radius: $bar-buttons-radius;
}
}
.bar_item_box_hidden {