Added Power menu and show only the workspaces allocated to monitor

This commit is contained in:
Jas Singh
2024-06-09 18:40:51 -07:00
parent 3579e563b8
commit d695d9aa67
25 changed files with 784 additions and 383 deletions

View File

@@ -1,5 +1,6 @@
@import "../colors";
.media {
font-size: 1rem;
color: $green;
}

View File

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

View File

@@ -44,6 +44,8 @@ $crust: #11111b;
$default_fg: $primary-color;
$default_bg: #000000;
$primary_bg: $dark-background;
// $primary_fg: mix($mauve, $primary_bg, 70%);
$primary_fg: mix($mauve, $primary_bg, 70%);
$secondary_fg: $green;
$secondary_bg: $light-background;
$shadow-color: #1e1e2e;

View File

@@ -0,0 +1,11 @@
@import "../colors";
@mixin floating-widget {
// box-shadow: 0 0 5px 0 $shadow-color;
margin: max($spacing, 8px);
border: 3px solid $surface1;
background-color: $base;
color: $primary_fg;
border-radius: 11px;
padding: 20px;
}

View File

@@ -0,0 +1,53 @@
$popover-padding: 7px * 1.6;
$padding: 7px;
$spacing: 12px;
$radius: 11px;
.widget-button {
background: $crust;
opacity: 1;
font-size: 1.6rem;
font-weight: bold;
margin: 10px;
padding: 15px 20px;
border-radius: 10px;
border: 3px solid;
border-color: $crust;
transition: border-color .3s ease-in-out;
transition: opacity .3s ease-in-out;
&:hover {
border: 3px solid;
border-color: $lavender;
transition: border-color .3s ease-in-out;
}
&:focus,
&:active {
border: 3px solid;
border-color: $lavender;
}
image {
border-radius: $radius + ($popover-padding * 1.4);
min-width: 1.2em;
min-height: 1.2em;
font-size: 4em;
}
label {
margin-top: $spacing;
}
&:focus,
&:active {
image {
opacity: .3;
transition: opacity .3s ease-in-out;
}
label {
opacity: .3;
transition: opacity .3s ease-in-out;
}
}
}

View File

@@ -5,7 +5,9 @@
//general
@import "colors";
@import "common";
@import "../scss/common/common.scss";
@import "../scss/common/floating-widget.scss";
@import "../scss/common/widget-button.scss";
//modules - bar
@import "bar/menu";
@@ -19,3 +21,6 @@
@import "bar/systray";
@import "bar/power";
@import "bar/bar";
//modules - menus
@import "menus/powermenu";

105
scss/menus/powermenu.scss Normal file
View File

@@ -0,0 +1,105 @@
@import "../colors";
window#powermenu,
window#verification {
// the fraction has to be more than hyprland ignorealpha
background-color: rgba(0, 0, 0, .4);
}
$popover-padding: 7px * 1.6;
$padding: 7px;
$spacing: 12px;
$radius: 11px;
window#verification .verification {
@include floating-widget;
padding: 7px * 1.6 * 1.5;
min-width: 300px;
min-height: 100px;
.text-box {
margin-bottom: $spacing;
.title {
font-size: 1.6em;
}
.desc {
color: transparentize($primary_fg, 0.1);
font-size: 1.1em;
}
}
}
window#powermenu .powermenu {
@include floating-widget;
&.line {
padding: $popover-padding * 1.5;
}
&.box {
padding: $popover-padding * 2;
}
}
.widget-button {
&:hover {
&.powermenu-button-shutdown {
border-color: $red;
}
&.powermenu-button-logout {
border-color: $green;
}
&.powermenu-button-sleep {
border-color: $sky;
}
&.powermenu-button-reboot {
border-color: $peach;
}
}
&:focus,
&:active {
&.powermenu-button-shutdown {
border-color: rgba($red, .5);
}
&.powermenu-button-logout {
border-color: rgba($green, .5);
}
&.powermenu-button-sleep {
border-color: rgba($sky, .5);
}
&.powermenu-button-reboot {
border-color: rgba($peach, .5);
}
}
}
.system-button_icon {
&.shutdown {
color: $red;
}
&.logout {
color: $green;
}
&.reboot {
color: $peach;
}
&.sleep {
color: $sky;
}
}
.system-button_label {
&.shutdown {
color: $red;
}
&.logout {
color: $green;
}
&.reboot {
color: $peach;
}
&.sleep {
color: $sky;
}
}