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

Implemented configurable and toggleable button borders. (#279)

Browse Source 
* Implemented configurable and toggleable button borders.

* Improve and simplify border logic

* Fix hidden label icon borders.

* Removed button hover property from bar buttons, they dim on hover now by default.

* Rename file.

* Update catppuccin normal theme's storage module color.

* update mocha items

* update mochas

* Update themes to account for borders
This commit is contained in:
Jas Singh
2024-09-22 02:59:30 -07:00
committed by GitHub
parent b47864d8e1
commit 6905fb4eb7
58 changed files with 2315 additions and 1404 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
scss/style/bar/audio.scss
View File

@@ -1,28 +1,59 @@
.bar-button-icon.volume {
font-size: 1.3em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-icon);
font-size: 1.3em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-icon);
}
.bar-button-label.volume {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-text);
min-width: 2.2em;
margin-left: $bar-buttons-volume-spacing;
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-text);
min-width: 2.2em;
margin-left: $bar-buttons-volume-spacing;
}
.style2 {
.bar-button-icon.volume {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-volume-spacing;
}
.bar-button-icon.volume {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-volume-spacing;
border-top-left-radius: if(
$bar-buttons-volume-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-volume-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.volume {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-volume-spacing;
margin-left: 0em;
}
.bar-button-label.volume {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-volume-spacing;
margin-left: 0em;
}
&.no-label.volume-container {
.bar-button-icon.volume {
border-top-right-radius: if(
$bar-buttons-volume-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-right-radius: if(
$bar-buttons-volume-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
}
}
.bar_item_box_visible.volume {
border: if(
$bar-buttons-volume-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-border),
0em
);
}

305
scss/style/bar/bar.scss
View File

@@ -1,22 +1,21 @@
.bar {
* {
font-size: $font-size * $bar-scaling * 0.01;
}
* {
font-size: $font-size * $bar-scaling * 0.01;
}
.bar-panel-container {
margin-top: if($bar-floating, $bar-margin_top, 0em);
margin-bottom: if($bar-floating, $bar-margin_bottom, 0em);
margin-left: if($bar-floating, $bar-margin_sides, 0em);
margin-right: if($bar-floating, $bar-margin_sides, 0em);
}
.bar-panel-container {
margin-top: if($bar-floating, $bar-margin_top, 0em);
margin-bottom: if($bar-floating, $bar-margin_bottom, 0em);
margin-left: if($bar-floating, $bar-margin_sides, 0em);
margin-right: if($bar-floating, $bar-margin_sides, 0em);
}
.bar-panel {
$bar-opacity-ratio: $bar-opacity * 0.01;
$transparency-value: 1 - $bar-opacity-ratio;
background: if($bar-transparent, transparent, transparentize($bar-background, $transparency-value));
border-radius: if($bar-floating, $bar-border_radius, 0em);
}
.bar-panel {
$bar-opacity-ratio: $bar-opacity * 0.01;
$transparency-value: 1 - $bar-opacity-ratio;
background: if($bar-transparent, transparent, transparentize($bar-background, $transparency-value));
border-radius: if($bar-floating, $bar-border_radius, 0em);
}
}
$bar-button-background-opacity-ratio: $bar-buttons-background_opacity * 0.01;
@@ -26,186 +25,132 @@ $bar-button-background-hover-opacity-ratio: $bar-buttons-background_hover_opacit
$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;
margin: $bar-buttons-y_margins $bar-buttons-spacing;
opacity: $bar-buttons-opacity * 0.01;
padding: $bar-buttons-padding_y $bar-buttons-padding_x;
background-color: transparentize($bar-buttons-background, $transparency-value);
border-radius: $bar-buttons-radius;
margin: $bar-buttons-y_margins $bar-buttons-spacing;
opacity: $bar-buttons-opacity * 0.01;
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);
}
&.battery {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-battery-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-battery-hover), $transparency-value-hover);
}
}
&.bluetooth {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-bluetooth-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-bluetooth-hover), $transparency-value-hover);
}
}
&.clock {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-clock-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-clock-hover), $transparency-value-hover);
}
}
&.media {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-media-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-media-hover), $transparency-value-hover);
}
}
&.dashboard {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-dashboard-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-dashboard-hover), $transparency-value-hover);
}
}
&.network {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-network-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-network-hover), $transparency-value-hover);
}
}
&.notifications {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-notifications-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-notifications-hover), $transparency-value-hover);
}
}
&.systray {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-systray-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-systray-hover), $transparency-value-hover);
}
}
&.volume {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-volume-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-volume-hover), $transparency-value-hover);
}
}
&.windowtitle {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-windowtitle-background), $transparency-value);
&:hover {
background: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-windowtitle-hover), $transparency-value-hover);
}
}
&.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;
}
&.style3 {
border-bottom-left-radius: 1.3em;
border-top-right-radius: 1.3em;
}
&: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;
}
&.style4 {
border-bottom-right-radius: 1.3em;
border-top-left-radius: 1.3em;
}
.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;
}
.clock.bar-button-icon {
background-color: transparentize(if($bar-buttons-monochrome, $bar-buttons-hover, $bar-buttons-clock-hover), $transparency-value);
color: $bar-buttons-clock-icon_background;
}
.bar-button-icon {
&:hover {
opacity: 0.5;
}
}
}
&.battery {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-battery-background),
$transparency-value
);
}
&.bluetooth {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-bluetooth-background),
$transparency-value
);
}
&.clock {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-clock-background),
$transparency-value
);
}
&.media {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-media-background),
$transparency-value
);
}
&.dashboard {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-dashboard-background),
$transparency-value
);
}
&.network {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-network-background),
$transparency-value
);
}
&.notifications {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-notifications-background),
$transparency-value
);
}
&.systray {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-systray-background),
$transparency-value
);
&:hover {
opacity: 1;
}
}
&.volume {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-volume-background),
$transparency-value
);
}
&.windowtitle {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-windowtitle-background),
$transparency-value
);
}
&.workspaces {
background-color: transparentize(
if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-workspaces-background),
$transparency-value
);
&:hover {
opacity: 1;
}
}
&.style2 {
padding: 0em;
}
}
.no-label.style2 {
.bar-button-icon {
border-top-right-radius: $bar-buttons-radius;
border-bottom-right-radius: $bar-buttons-radius;
}
.bar-button-icon {
border-top-right-radius: $bar-buttons-radius;
border-bottom-right-radius: $bar-buttons-radius;
}
}
.bar_item_box_hidden {
background: none;
border-radius: 0rem;
padding: 0rem 0rem 0rem 0rem;
margin: 0rem 0rem 0rem 0rem;
background: none;
border-radius: 0rem;
padding: 0rem 0rem 0rem 0rem;
margin: 0rem 0rem 0rem 0rem;
}
.box-left {
margin-left: $bar-outer_spacing;
margin-left: $bar-outer_spacing;
}
.box-right {
margin-right: $bar-outer_spacing;
margin-right: $bar-outer_spacing;
}

66
scss/style/bar/battery.scss
View File

@@ -1,26 +1,58 @@
.bar-button-label.battery {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-battery-text);
margin-left: $bar-buttons-battery-spacing;
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-battery-text);
margin-left: $bar-buttons-battery-spacing;
}
.bar-button-icon.battery {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-battery-icon);
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-battery-icon);
}
.style2 {
.bar-button-icon.battery {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-battery-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-battery-spacing;
}
.bar-button-icon.battery {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-battery-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-battery-spacing;
border-top-left-radius: if(
$bar-buttons-battery-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-battery-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.battery {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-battery-spacing;
margin-left: 0em;
}
.bar-button-label.battery {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-battery-spacing;
margin-left: 0em;
}
&.no-label.battery-container {
.bar-button-icon.battery {
border-top-right-radius: if(
$bar-buttons-battery-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-right-radius: if(
$bar-buttons-battery-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
}
}
.bar_item_box_visible.battery {
border: if(
$bar-buttons-battery-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-battery-border),
0em
);
}

78
scss/style/bar/bluetooth.scss
View File

@@ -1,38 +1,70 @@
.bar-button-icon.bluetooth {
font-size: 1.15em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-bluetooth-icon);
font-size: 1.15em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-bluetooth-icon);
}
.bar-button-label.bluetooth {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-bluetooth-text);
margin-left: $bar-buttons-bluetooth-spacing;
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-bluetooth-text);
margin-left: $bar-buttons-bluetooth-spacing;
}
.bluetooth-disabled-menu {
font-weight: bold;
font-size: 1.1rem;
color: $surface2;
margin: 6rem 0rem;
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);
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-bluetooth-text);
}
.style2 {
.bar-button-icon.bluetooth {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-bluetooth-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-bluetooth-spacing;
}
.bar-button-icon.bluetooth {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-bluetooth-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-bluetooth-spacing;
border-top-left-radius: if(
$bar-buttons-bluetooth-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-bluetooth-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.bluetooth {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-bluetooth-spacing;
margin-left: 0em;
}
.bar-button-label.bluetooth {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-bluetooth-spacing;
margin-left: 0em;
}
&.no-label.bluetooth-container {
.bar-button-icon.bluetooth {
border-top-right-radius: if(
$bar-buttons-bluetooth-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-right-radius: if(
$bar-buttons-bluetooth-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
}
}
.bar_item_box_visible.bluetooth {
border: if(
$bar-buttons-bluetooth-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-bluetooth-border),
0em
);
}

68
scss/style/bar/clock.scss
View File

@@ -1,27 +1,59 @@
.bar-button-label.clock {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-clock-text);
margin-left: $bar-buttons-clock-spacing;
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-clock-text);
margin-left: $bar-buttons-clock-spacing;
}
.bar-button-icon.clock {
font-size: 1.2em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-clock-icon);
font-size: 1.2em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-clock-icon);
}
.style2 {
.bar-button-icon.clock {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-clock-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-media-spacing;
}
.bar-button-icon.clock {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-clock-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-clock-spacing;
border-top-left-radius: if(
$bar-buttons-clock-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-clock-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.clock {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-clock-spacing;
margin-left: 0em;
}
.bar-button-label.clock {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-clock-spacing;
margin-left: 0em;
}
&.no-label.clock-container {
.bar-button-icon.clock {
border-top-right-radius: if(
$bar-buttons-clock-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-right-radius: if(
$bar-buttons-clock-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
}
}
.bar_item_box_visible.clock {
border: if(
$bar-buttons-clock-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-clock-border),
0em
);
}

52
scss/style/bar/media.scss
View File

@@ -1,27 +1,43 @@
.bar-button-label.media {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-media-text);
margin-left: $bar-buttons-media-spacing;
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-media-text);
margin-left: $bar-buttons-media-spacing;
}
.bar-button-icon.media {
font-size: 1.2em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-media-icon);
font-size: 1.2em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-media-icon);
}
.style2 {
.bar-button-icon.media {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-media-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-media-spacing;
}
.bar-button-icon.media {
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-media-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-media-spacing;
border-top-left-radius: if(
$bar-buttons-media-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-media-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.media {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-media-spacing;
margin-left: 0em;
}
.bar-button-label.media {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-media-spacing;
margin-left: 0em;
}
}
.bar_item_box_visible.media {
border: if(
$bar-buttons-media-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-media-border),
0em
);
}

27
scss/style/bar/menu.scss
View File

@@ -1,24 +1,25 @@
.bar-menu_label {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-dashboard-icon);
font-size: 1.3em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-dashboard-icon);
font-size: 1.3em;
border-radius: $bar-buttons-radius;
}
.bar_item_box_visible.style2.dashboard {
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-dashboard-background);
.bar-menu_label {
color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-dashboard-icon);
}
&:hover {
background: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-dashboard-icon);
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-dashboard-background);
.bar-menu_label {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-dashboard-background);
color: if($bar-buttons-monochrome, $bar-buttons-background, $bar-buttons-dashboard-icon);
}
}
}
.style2 .bar-menu_label {
padding: $bar-buttons-padding_y $bar-buttons-padding_x;
padding: $bar-buttons-padding_y $bar-buttons-padding_x;
}
.bar_item_box_visible.dashboard {
border: if(
$bar-buttons-dashboard-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-dashboard-border),
0em
);
}

70
scss/style/bar/network.scss
View File

@@ -1,26 +1,58 @@
.bar-button-label.network {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-network-text);
margin-left: $bar-buttons-network-spacing;
.bar-button-label.network-label {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-network-text);
margin-left: $bar-buttons-network-spacing;
}
.bar-button-icon.network {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-network-icon);
.bar-button-icon.network-icon {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-network-icon);
}
.style2 {
.bar-button-icon.network {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-network-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-network-spacing;
}
.bar-button-icon.network-icon {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-network-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-network-spacing;
border-top-left-radius: if(
$bar-buttons-network-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-network-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.network {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-network-spacing;
margin-left: 0em;
}
.bar-button-label.network-label {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-network-spacing;
margin-left: 0em;
}
&.no-label.network-container {
.bar-button-icon.network-icon {
border-top-right-radius: if(
$bar-buttons-network-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-right-radius: if(
$bar-buttons-network-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
}
}
.bar_item_box_visible.network {
border: if(
$bar-buttons-network-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-network-border),
0em
);
}

71
scss/style/bar/notifications.scss
View File

@@ -1,28 +1,61 @@
.bar-button-icon.notifications {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-notifications-icon);
font-size: 1.3em;
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-notifications-icon);
font-size: 1.3em;
}
.bar-button-label.notifications {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-notifications-total);
margin-left: $bar-buttons-notifications-spacing;
min-width: 1em;
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-notifications-total);
margin-left: $bar-buttons-notifications-spacing;
min-width: 1em;
}
.style2 {
.bar-button-icon.notifications {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-notifications-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-notifications-spacing;
}
.bar-button-icon.notifications {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-notifications-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-notifications-spacing;
border-top-left-radius: if(
$bar-buttons-notifications-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-notifications-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.notifications {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-notifications-spacing;
margin-left: 0em;
}
.bar-button-label.notifications {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-notifications-spacing;
margin-left: 0em;
}
&.no-label.notifications-container {
.bar-button-icon.notifications {
border-top-right-radius: if(
$bar-buttons-notifications-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-right-radius: if(
$bar-buttons-notifications-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
}
}
.bar_item_box_visible.notifications {
border: if(
$bar-buttons-notifications-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-notifications-border),
0em
);
}

8
scss/style/bar/systray.scss
View File

@@ -9,3 +9,11 @@
.style2.systray {
padding: $bar-buttons-padding_y $bar-buttons-padding_x;
}
.bar_item_box_visible.systray {
border: if(
$bar-buttons-systray-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-systray-border),
0em
);
}

76
scss/style/bar/window_title.scss
View File

@@ -1,30 +1,66 @@
.bar-button-icon.windowtitle {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-windowtitle-icon);
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-windowtitle-icon);
}
.bar-button-label.windowtitle {
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-windowtitle-text);
margin-left: $bar-buttons-windowtitle-spacing;
color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-windowtitle-text);
margin-left: $bar-buttons-windowtitle-spacing;
&.no-icon {
margin-left: 0;
}
&.no-icon {
margin-left: 0;
}
}
.style2 {
.bar-button-icon.windowtitle {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-windowtitle-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-windowtitle-spacing;
}
.bar-button-icon.windowtitle {
border-top-left-radius: $bar-buttons-radius;
border-bottom-left-radius: $bar-buttons-radius;
background: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-windowtitle-icon_background);
padding: $bar-buttons-padding_y 0em;
padding-left: $bar-buttons-padding_x;
padding-right: $bar-buttons-windowtitle-spacing;
border-top-left-radius: if(
$bar-buttons-windowtitle-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-left-radius: if(
$bar-buttons-windowtitle-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
.bar-button-label.windowtitle {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-windowtitle-spacing;
margin-left: 0em;
}
.bar-button-label.windowtitle {
padding: $bar-buttons-padding_y 0em;
padding-right: $bar-buttons-padding_x;
padding-left: $bar-buttons-windowtitle-spacing;
margin-left: 0em;
&.no-icon {
padding-left: $bar-buttons-padding_x;
}
}
&.no-label.windowtitle-container {
.bar-button-icon.windowtitle {
border-top-right-radius: if(
$bar-buttons-windowtitle-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
border-bottom-right-radius: if(
$bar-buttons-windowtitle-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-radius * 0.4,
$bar-buttons-radius
);
}
}
}
.bar_item_box_visible.windowtitle {
border: if(
$bar-buttons-windowtitle-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-windowtitle-border),
0em
);
}

8
scss/style/bar/workspace.scss
View File

@@ -80,3 +80,11 @@
.style2.workspaces {
padding: $bar-buttons-padding_y $bar-buttons-padding_x;
}
.bar_item_box_visible.workspaces {
border: if(
$bar-buttons-workspaces-enableBorder or $bar-buttons-enableBorders,
$bar-buttons-borderSize solid if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-workspaces-border),
0em
);
}