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

Implement framework for custom modules and out of the box custom modules as well. (#213)

Browse Source 
* Create declarative module scaffolding

* Added ram module (WIP)

* Updates to options, styling and more.

* Added function for styling custom modules.

* Added utility functions and cleaned up code

* Type and fn name updates.

* Update module utils to handle absent values.

* Added icon color in style2 that was missing.

* Linted utils.ts

* Add CPU module and update RAM module to use /proc/meminfo.

* Added disk storage module.

* Consolidate code

* Added netstat module and removed elements from systray default ignore list.

* Added keyboard layout module.

* Fix hook types and move module to customModules directory

* Added updates modules.

* Spacing updates

* Added weather module.

* Added power menu and power module in bar. Increased update default interval to 6 ours.

* Updated styling of bar buttons, made power menu label toggleable, etc.

* Consolidate code and add dynamic tooltips based on data being used.

* Make default custom mogules matugen compatible

* Update base theme

* Fix custom module background coloring

* Remove testing opacity.

* Update themes to account for new modules

* Update nix stuff for libgtop (Need someone to test this)

* Update nix

* Update fractions to multiplications

* Move styling in style directory

* Implement a polling framework for variables that can dynamically adjust polling intervals.

* Netstat module updates when interface name is changed.

* Readme update
This commit is contained in:
Jas Singh
2024-09-02 21:10:59 -07:00
committed by GitHub
parent 4f009b9978
commit 4cdda38604
107 changed files with 6444 additions and 1482 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
scss/style/menus/audiomenu.scss
View File

@@ -1,17 +1,17 @@
.menu-items-container.audio {
min-width: 18em * $bar-menus-menu-volume-scaling/100;
min-width: 18em * $bar-menus-menu-volume-scaling * 0.01;
@import "./menu.scss";
* {
font-size: $font-size * $bar-menus-menu-volume-scaling/100;
font-size: $font-size * $bar-menus-menu-volume-scaling * 0.01;
}
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-volume-background-color);
.menu-items {
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-volume-border-color);
opacity: $bar-menus-opacity/100;
opacity: $bar-menus-opacity * 0.01;
}
.menu-dropdown-label.audio {

10
scss/style/menus/bluetooth.scss
View File

@@ -1,5 +1,5 @@
.menu-items-container.bluetooth * {
font-size: $font-size * $bar-menus-menu-bluetooth-scaling/100;
font-size: $font-size * $bar-menus-menu-bluetooth-scaling * 0.01;
}
@import "./menu.scss";
@@ -7,13 +7,13 @@
.menu-items.bluetooth {
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-bluetooth-background-color);
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-bluetooth-border-color);
opacity: $bar-menus-opacity/100;
font-size: $font-size * $bar-menus-menu-bluetooth-scaling/100;
opacity: $bar-menus-opacity * 0.01;
font-size: $font-size * $bar-menus-menu-bluetooth-scaling * 0.01;
}
.menu-items-container.bluetooth {
min-width: 18em * $bar-menus-menu-bluetooth-scaling/100;
min-width: 18em * $bar-menus-menu-bluetooth-scaling * 0.01;
font-size: 1.3em;
@@ -36,7 +36,7 @@
.menu-items-section {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-bluetooth-card-color);
min-height: 20em * $bar-menus-menu-bluetooth-scaling/100;
min-height: 20em * $bar-menus-menu-bluetooth-scaling * 0.01;
font-size: 1em;
}

4
scss/style/menus/calendar.scss
View File

@@ -1,5 +1,5 @@
.calendar-menu-content * {
font-size: $font-size * $bar-menus-menu-clock-scaling/100;
font-size: $font-size * $bar-menus-menu-clock-scaling * 0.01;
}
.calendar-content-container {
@@ -10,7 +10,7 @@
border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-clock-border-color);
border-radius: $bar-menus-border-radius;
margin-right: 0.5em;
opacity: $bar-menus-opacity/100;
opacity: $bar-menus-opacity * 0.01;
}
.calendar-menu-item-container {

4
scss/style/menus/dashboard.scss
View File

@@ -1,5 +1,5 @@
.dashboard-menu-content * {
font-size: $font-size * $bar-menus-menu-dashboard-scaling/100;
font-size: $font-size * $bar-menus-menu-dashboard-scaling * 0.01;
}
.dashboard-content-items {
@@ -8,7 +8,7 @@
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-dashboard-background-color);
border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-dashboard-border-color);
border-radius: $bar-menus-border-radius;
opacity: $bar-menus-opacity/100;
opacity: $bar-menus-opacity * 0.01;
button {
border-radius: 0.4em;

8
scss/style/menus/energy.scss
View File

@@ -1,18 +1,18 @@
.menu-items-container.energy * {
font-size: $font-size * $bar-menus-menu-battery-scaling/100;
font-size: $font-size * $bar-menus-menu-battery-scaling * 0.01;
}
.menu-items.energy {
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-battery-background-color);
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-battery-border-color);
opacity: $bar-menus-opacity/100;
font-size: $font-size * $bar-menus-menu-battery-scaling/100;
opacity: $bar-menus-opacity * 0.01;
font-size: $font-size * $bar-menus-menu-battery-scaling * 0.01;
}
@import "./menu.scss";
.menu-items-container.energy {
min-width: 18em * $bar-menus-menu-battery-scaling/100;
min-width: 18em * $bar-menus-menu-battery-scaling * 0.01;
.menu-label {
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-battery-label-color);

8
scss/style/menus/media.scss
View File

@@ -1,17 +1,17 @@
.menu-items.media {
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-media-background-color);
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-media-border-color);
opacity: $bar-menus-opacity/100;
opacity: $bar-menus-opacity * 0.01;
}
.menu-items-container.media {
* {
font-size: $font-size * $bar-menus-menu-media-scaling/100;
font-size: $font-size * $bar-menus-menu-media-scaling * 0.01;
}
min-width: 23em * $bar-menus-menu-media-scaling/100;
min-height: 10em * $bar-menus-menu-media-scaling/100;
min-width: 23em * $bar-menus-menu-media-scaling * 0.01;
min-height: 10em * $bar-menus-menu-media-scaling * 0.01;
.menu-section-container {
margin: 1em 0em;

8
scss/style/menus/network.scss
View File

@@ -1,5 +1,5 @@
.menu-items-container.network * {
font-size: $font-size * $bar-menus-menu-network-scaling/100;
font-size: $font-size * $bar-menus-menu-network-scaling * 0.01;
}
@import "./menu.scss";
@@ -7,12 +7,12 @@
.menu-items.network {
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-network-background-color);
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-network-border-color);
opacity: $bar-menus-opacity/100;
font-size: $font-size * $bar-menus-menu-network-scaling/100;
opacity: $bar-menus-opacity * 0.01;
font-size: $font-size * $bar-menus-menu-network-scaling * 0.01;
}
.menu-items-container.network {
min-width: 18em * $bar-menus-menu-network-scaling/100;
min-width: 18em * $bar-menus-menu-network-scaling * 0.01;
font-size: 1.3em;
.menu-items-section {

18
scss/style/menus/notifications.scss
View File

@@ -1,16 +1,16 @@
.notification-menu-content * {
font-size: $font-size * $bar-menus-menu-notifications-scaling/100;
font-size: $font-size * $bar-menus-menu-notifications-scaling * 0.01;
}
.notification-card-container.menu {
margin: 0em;
min-width: 30.6em * $bar-menus-menu-notifications-scaling/100;
min-height: $bar-menus-menu-notifications-height * $bar-menus-menu-notifications-scaling/100;
min-width: 30.6em * $bar-menus-menu-notifications-scaling * 0.01;
min-height: $bar-menus-menu-notifications-height * $bar-menus-menu-notifications-scaling * 0.01;
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-notifications-background);
border: $bar-menus-border-size solid if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-notifications-border);
border-radius: $bar-menus-border-radius;
margin-right: 0.45em;
opacity: $bar-menus-opacity/100;
opacity: $bar-menus-opacity * 0.01;
.window-content.notificationsmenu-window {
margin-right: 0.50em;
@@ -32,8 +32,8 @@
.notification-card.menu {
background: $notification-background;
min-width: 26.2em * $bar-menus-menu-notifications-scaling/100;
font-size: $font-size * $bar-menus-menu-notifications-scaling/100;
min-width: 26.2em * $bar-menus-menu-notifications-scaling * 0.01;
font-size: $font-size * $bar-menus-menu-notifications-scaling * 0.01;
border: 0.15em solid $notification-border;
border-radius: 0em;
border-bottom-left-radius: $notification-border_radius;
@@ -55,7 +55,7 @@
.menu-label.notifications {
margin: 0em;
font-size: $font-size * $bar-menus-menu-notifications-scaling/100;
font-size: $font-size * $bar-menus-menu-notifications-scaling * 0.01;
color: if($bar-menus-monochrome, $bar-menus-label, $bar-menus-menu-notifications-label);
}
@@ -126,11 +126,11 @@
}
.bell {
font-size: 10em * $bar-menus-menu-notifications-scaling/100;
font-size: 10em * $bar-menus-menu-notifications-scaling * 0.01;
}
.message {
font-size: 1.5em * $bar-menus-menu-notifications-scaling/100;
font-size: 1.5em * $bar-menus-menu-notifications-scaling * 0.01;
}
}

8
scss/style/menus/power.scss
View File

@@ -8,7 +8,7 @@ $popover-padding: 0.6rem * 1.6;
window#verification .verification {
* {
font-size: $font-size * $bar-menus-menu-dashboard-confirmation_scaling/100;
font-size: $font-size * $bar-menus-menu-dashboard-confirmation_scaling * 0.01;
}
@include floating-widget;
@@ -17,11 +17,11 @@ window#verification .verification {
padding: 0.35em * 1.6 * 1.5;
min-width: 20em;
min-height: 6em;
opacity: $bar-menus-opacity/100;
opacity: $bar-menus-opacity * 0.01;
.verification-content {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-dashboard-powermenu-confirmation-card);
border-radius: $bar-menus-border-radius/2;
border-radius: $bar-menus-border-radius * 0.5;
padding: 1em;
}
@@ -46,7 +46,7 @@ window#verification .verification {
background: $bar-menus-buttons-default;
padding: 0.7em 0em;
margin: 0.4em 1.7em;
border-radius: $bar-menus-border-radius/2;
border-radius: $bar-menus-border-radius * 0.5;
opacity: 1;
transition: border-color 0.2s ease-in-out;
transition: opacity .3s ease-in-out;

136
scss/style/menus/powerdropdown.scss Normal file
View File

@@ -0,0 +1,136 @@
.menu-items-container.power-dropdown * {
font-size: $font-size * $bar-menus-menu-power-scaling * 0.01;
}
@import "./menu.scss";
.menu-items.power-dropdown {
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-power-background-color);
border-color: if($bar-menus-monochrome, $bar-menus-border-color, $bar-menus-menu-power-border-color);
opacity: $bar-menus-opacity * 0.01;
font-size: $font-size * $bar-menus-menu-power-scaling * 0.01;
}
.menu-items-container.power-dropdown {
&.reboot {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-power-buttons-restart-background);
}
&.logout {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-power-buttons-logout-background);
}
&.sleep {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-power-buttons-sleep-background);
}
min-height: 3.5em * $bar-menus-menu-power-scaling * 0.01;
font-size: 1.3em;
margin: 1em;
.menu-items-section {
padding-bottom: 1.5em;
}
.power-menu-button {
border-radius: $bar-menus-border-radius * 0.6;
// This doubles the border-radius so it doesn't show up as
// an artifact behind the button as that has a radius as well
border-top-left-radius: $bar-menus-border-radius * 2;
border-bottom-left-radius: $bar-menus-border-radius * 2;
&.no-label {
// This doubles the border-radius so it doesn't show up as
// an artifact behind the button as that has a radius as well
border-top-right-radius: $bar-menus-border-radius * 2;
border-bottom-right-radius: $bar-menus-border-radius * 2;
}
&:hover {
opacity: 0.4;
}
&:not(:last-child) {
margin-bottom: 1.5em;
}
.power-button-label {
font-size: 1.1em;
}
&.shutdown {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-power-buttons-shutdown-background);
}
&.reboot {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-power-buttons-restart-background);
}
&.logout {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-power-buttons-logout-background);
}
&.sleep {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-power-buttons-sleep-background);
}
.show-label {
padding-right: 1em;
}
.no-label {
border-top-right-radius: $bar-menus-border-radius * 0.35;
border-bottom-right-radius: $bar-menus-border-radius * 0.35;
}
.shutdown-label {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-shutdown-text);
}
.reboot-label {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-restart-text);
}
.logout-label {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-logout-text);
}
.sleep-label {
color: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-sleep-text);
}
}
label {
margin-left: 1em;
}
image {
min-width: 3.75rem * $bar-menus-menu-power-scaling * 0.01;
min-height: 3.75rem * $bar-menus-menu-power-scaling * 0.01;
background: $red;
border-top-left-radius: $bar-menus-border-radius * 0.35;
border-bottom-left-radius: $bar-menus-border-radius * 0.35;
font-size: 1.75em;
&.shutdown-icon {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-shutdown-icon_background);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-power-buttons-shutdown-icon);
}
&.reboot-icon {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-restart-icon_background);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-power-buttons-restart-icon);
}
&.logout-icon {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-logout-icon_background);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-power-buttons-logout-icon);
}
&.sleep-icon {
background: if($bar-menus-monochrome, $bar-menus-buttons-default, $bar-menus-menu-power-buttons-sleep-icon_background);
color: if($bar-menus-monochrome, $bar-menus-buttons-text, $bar-menus-menu-power-buttons-sleep-icon);
}
}
}