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

Adding configuration options to change spacing between icons and labels inside the buttons in the bar. (#30)

Browse Source 
* Branch protection check.

* Move button spacing config into the Configuration section instead of Theming.

* Partially Resolves #26 - Added the ability to configure outer spacing on the bar.

* Renamed all class names for buttons so they can be styled with margins.

* Added configurable spacing to buttons.

* Fixed styling for network module when using wifi.

* Fixed ghost margins that occur when labels are disabled in the bar buttons.

* Change the default page of the settings dialog to configuration.
This commit is contained in:
Jas Singh
2024-07-28 15:16:31 -07:00
committed by GitHub
parent 83b60ddaab
commit 3dc5bbbe13
20 changed files with 137 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
widget/settings/SettingsDialog.ts
View File

@@ -6,7 +6,7 @@ import { SettingsMenu } from "./pages/config/index"
type Page = "Configuration" | "Theming"
const CurrentPage = Variable<Page>("Theming");
const CurrentPage = Variable<Page>("Configuration");
const pagerMap: Page[] = [
"Configuration",

14
widget/settings/pages/config/bar/index.ts
View File

@@ -15,6 +15,9 @@ export const BarSettings = () => {
Option({ opt: options.bar.layouts, title: 'Bar Layouts for Monitors', subtitle: 'Please refer to the github README for instructions: https://github.com/Jas-SinghFSU/HyprPanel', type: 'object' }, 'bar-layout-input'),
Header('Spacing'),
Option({ opt: options.theme.bar.outer_spacing, title: 'Outer Spacing', subtitle: 'Spacing on the outer left and right edges of the bar.', type: 'string' }),
Option({ opt: options.theme.bar.buttons.spacing, title: 'Button Spacing', subtitle: 'Spacing between the buttons in the bar.', type: 'string' }),
Option({ opt: options.theme.bar.buttons.radius, title: 'Button Radius', type: 'string' }),
Option({ opt: options.theme.bar.floating, title: 'Floating Bar', type: 'boolean' }),
Option({ opt: options.theme.bar.margin_top, title: 'Margin Top', subtitle: 'Only applies if floating is enabled', type: 'string' }),
Option({ opt: options.theme.bar.margin_bottom, title: 'Margin Bottom', subtitle: 'Only applies if floating is enabled', type: 'string' }),
@@ -35,17 +38,24 @@ export const BarSettings = () => {
Option({ opt: options.bar.workspaces.reverse_scroll, title: 'Invert Scroll', subtitle: 'Scrolling up will go to the previous workspace rather than the next.', type: 'boolean' }),
Option({ opt: options.bar.workspaces.scroll_speed, title: 'Scrolling Speed', type: 'number' }),
Header('Window Titles'),
Option({ opt: options.theme.bar.buttons.windowtitle.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
Header('Volume'),
Option({ opt: options.bar.volume.label, title: 'Show Volume Percentage', type: 'boolean' }),
Option({ opt: options.theme.bar.buttons.volume.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
Header('Network'),
Option({ opt: options.bar.network.label, title: 'Show Network Name', type: 'boolean' }),
Option({ opt: options.theme.bar.buttons.network.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
Header('Bluetooth'),
Option({ opt: options.bar.bluetooth.label, title: 'Show Bluetooth Label', type: 'boolean' }),
Option({ opt: options.theme.bar.buttons.bluetooth.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
Header('Battery'),
Option({ opt: options.bar.battery.label, title: 'Show Battery Percentage', type: 'boolean' }),
Option({ opt: options.theme.bar.buttons.battery.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
// Header('System Tray'),
// TODO: Figure out how to handle arrays
@@ -54,8 +64,12 @@ export const BarSettings = () => {
Header('Clock'),
Option({ opt: options.bar.clock.format, title: 'Clock Format', type: 'string' }),
Header('Media'),
Option({ opt: options.theme.bar.buttons.media.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
Header('Notifications'),
Option({ opt: options.bar.notifications.show_total, title: 'Show Total # of notifications', type: 'boolean' }),
Option({ opt: options.theme.bar.buttons.notifications.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
]
})
})

2
widget/settings/pages/theme/bar/index.ts
View File

@@ -15,8 +15,6 @@ export const BarTheme = () => {
Option({ opt: options.theme.bar.transparent, title: 'Transparent', type: 'boolean' }),
Option({ opt: options.theme.bar.background, title: 'Background Color', type: 'color' }),
Option({ opt: options.theme.bar.buttons.monochrome, title: 'Use Global Colors', type: 'boolean' }),
Option({ opt: options.theme.bar.buttons.spacing, title: 'Button Spacing', type: 'string' }),
Option({ opt: options.theme.bar.buttons.radius, title: 'Button Radius', type: 'string' }),
Option({ opt: options.theme.bar.buttons.background, title: 'Button Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.hover, title: 'Button Hover', type: 'color' }),
Option({ opt: options.theme.bar.buttons.text, title: 'Button Text', type: 'color' }),