hyprpanel

This commit is contained in:
wt committed 2024-10-23 21:12:15 +07:00
1 parent 10080a83ee
commit 5151ac24da
322 files changed
+38276

No files matched your search

@@ -0,0 +1,781 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import Gtk from 'types/@girs/gtk-3.0/gtk-3.0';
export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
return Widget.Scrollable({
vscroll: 'always',
hscroll: 'automatic',
class_name: 'menu-theme-page paged-container',
child: Widget.Box({
vertical: true,
children: [
/*
******************************
* LAYOUTS *
******************************
*/
Header('Layouts'),
Option(
{
opt: options.bar.layouts,
title: 'Bar Layouts for Monitors',
subtitle: 'Wiki Link: https://hyprpanel.com/configuration/panel.html#layouts',
type: 'object',
subtitleLink: 'https://hyprpanel.com/configuration/panel.html#layouts',
},
'bar-layout-input',
),
Option({
opt: options.theme.bar.floating,
title: 'Floating Bar',
type: 'boolean',
}),
Option({
opt: options.theme.bar.location,
title: 'Location',
type: 'enum',
enums: ['top', 'bottom'],
}),
Option({
opt: options.theme.bar.buttons.enableBorders,
title: 'Enable Button Borders',
subtitle: 'Enables button borders for all buttons in the bar.',
type: 'boolean',
}),
Option({
opt: options.theme.bar.buttons.borderSize,
title: 'Button Border Size',
subtitle: 'Button border for the individual modules must be enabled first',
type: 'string',
}),
/*
******************************
* SPACING *
******************************
*/
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.y_margins,
title: 'Vertical Margins',
subtitle: 'Spacing above/below the buttons in 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.padding_x,
title: 'Button Horizontal Padding',
type: 'string',
}),
Option({
opt: options.theme.bar.buttons.padding_y,
title: 'Button Vertical Padding',
type: 'string',
}),
Option({
opt: options.theme.bar.buttons.radius,
title: 'Button Radius',
type: 'string',
}),
Option({
opt: options.theme.bar.layer,
title: 'Layer',
type: 'enum',
subtitle: 'Layer determines the Z index of your bar.',
enums: ['top', 'bottom', 'overlay', 'background'],
}),
Option({
opt: options.theme.bar.dropdownGap,
title: 'Dropdown Gap',
subtitle: 'The gap between the dropdown and the bar',
type: 'string',
}),
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',
}),
Option({
opt: options.theme.bar.margin_sides,
title: 'Margin Sides',
subtitle: 'Only applies if floating is enabled',
type: 'string',
}),
Option({
opt: options.theme.bar.border_radius,
title: 'Border Radius',
subtitle: 'Only applies if floating is enabled',
type: 'string',
}),
/*
******************************
* Actions *
******************************
*/
Header('Actions'),
Option({
opt: options.bar.scrollSpeed,
title: 'Scrolling Speed',
subtitle: 'The speed at which the commands assigned to the scroll event will trigger',
type: 'number',
}),
/*
******************************
* DASHBOARD *
******************************
*/
Header('Dashboard'),
Option({
opt: options.bar.launcher.icon,
title: 'Dashboard Menu Icon',
type: 'string',
}),
Option({
opt: options.theme.bar.buttons.dashboard.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.launcher.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.launcher.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.launcher.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.launcher.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
/*
******************************
* WORKSPACES *
******************************
*/
Header('Workspaces'),
Option({
opt: options.theme.bar.buttons.workspaces.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.workspaces.showAllActive,
title: 'Mark Active Workspace On All Monitors',
subtitle: 'Marks the currently active workspace on each monitor.',
type: 'boolean',
}),
Option({
opt: options.theme.bar.buttons.workspaces.fontSize,
title: 'Indicator Size',
subtitle:
'Only applicable to numbered workspaces and mapped icons\n' +
'Adjust with caution as it may cause the bar to expand',
type: 'string',
}),
Option({
opt: options.bar.workspaces.show_icons,
title: 'Show Workspace Icons',
type: 'boolean',
}),
Option({
opt: options.bar.workspaces.icons.available,
title: 'Workspace Available',
type: 'string',
}),
Option({
opt: options.bar.workspaces.icons.active,
title: 'Workspace Active',
type: 'string',
}),
Option({
opt: options.bar.workspaces.icons.occupied,
title: 'Workspace Occupied',
type: 'string',
}),
Option({
opt: options.bar.workspaces.show_numbered,
title: 'Show Workspace Numbers',
type: 'boolean',
}),
Option({
opt: options.bar.workspaces.numbered_active_indicator,
title: 'Numbered Workspace Identifier',
subtitle: 'Only applicable if Workspace Numbers are enabled',
type: 'enum',
enums: ['underline', 'highlight', 'color'],
}),
Option({
opt: options.theme.bar.buttons.workspaces.smartHighlight,
title: 'Smart Highlight',
subtitle:
'Automatically determines the highlight color of the workspace icon.\n' +
'Only compatible with mapped icons.',
type: 'boolean',
}),
Option({
opt: options.theme.bar.buttons.workspaces.numbered_active_highlight_border,
title: 'Highlight Radius',
subtitle: 'Only applicable if Workspace Numbers are enabled',
type: 'string',
}),
Option({
opt: options.theme.bar.buttons.workspaces.numbered_active_highlight_padding,
title: 'Highlight Padding',
subtitle: 'Only applicable if Workspace Numbers are enabled',
type: 'string',
}),
Option({
opt: options.bar.workspaces.showWsIcons,
title: 'Map Workspaces to Icons',
type: 'boolean',
}),
Option({
opt: options.bar.workspaces.workspaceIconMap,
title: 'Workspace Icon Mappings',
type: 'object',
}),
Option({
opt: options.bar.workspaces.spacing,
title: 'Spacing',
subtitle: 'Spacing between workspace icons',
type: 'float',
}),
Option({
opt: options.bar.workspaces.workspaces,
title: 'Total Workspaces',
subtitle: 'The least amount of workspaces to always show.',
type: 'number',
}),
Option({
opt: options.bar.workspaces.monitorSpecific,
title: 'Monitor Specific',
subtitle:
'Only workspaces applicable to the monitor will be displayed.\n' +
"Works in conjuction with 'Total Workspaces'.",
type: 'boolean',
}),
Option({
opt: options.bar.workspaces.hideUnoccupied,
title: 'Hide Unoccupied',
subtitle: 'Only show workspaces that are occupied or active',
type: 'boolean',
}),
Option({
opt: options.bar.workspaces.workspaceMask,
title: 'Mask Workspace Numbers On Monitors',
subtitle:
'Only applicable if Workspace Numbers and Monitor Specific are enabled.\n' +
"Forces each Monitor's Workspace labels to start from 1.",
type: 'boolean',
}),
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',
}),
Option({
opt: options.bar.workspaces.ignored,
title: 'Ignored Workspaces',
subtitle: 'A regex that defines workspaces to ignore',
type: 'string',
}),
/*
******************************
* WINDOW TITLES *
******************************
*/
Header('Window Titles'),
Option({
opt: options.theme.bar.buttons.windowtitle.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.windowtitle.custom_title,
title: 'Use Custom Title',
type: 'boolean',
}),
Option({
opt: options.bar.windowtitle.title_map,
title: 'Window Title Mappings',
subtitle:
'Only applicable if Show Custom Title is enabled\nWiki Link: https://hyprpanel.com/configuration/panel.html#window-title-mappings',
type: 'object',
subtitleLink: 'https://hyprpanel.com/configuration/panel.html#window-title-mappings',
}),
Option({
opt: options.bar.windowtitle.class_name,
title: 'Use Class Name',
subtitle:
"Only applicable if Show Custom Title is disabled\nDisplays the window's class name instead of its title.",
type: 'boolean',
}),
Option({
opt: options.bar.windowtitle.label,
title: 'Show Window Title Label',
type: 'boolean',
}),
Option({
opt: options.bar.windowtitle.icon,
title: 'Show Icon',
type: 'boolean',
}),
Option({
opt: options.bar.windowtitle.truncation,
title: 'Truncate Window Title',
subtitle: 'Will truncate the window title to the specified size below.',
type: 'boolean',
}),
Option({
opt: options.bar.windowtitle.truncation_size,
title: 'Truncation Size',
type: 'number',
min: 10,
}),
Option({
opt: options.theme.bar.buttons.windowtitle.spacing,
title: 'Inner Spacing',
subtitle: 'Spacing between the icon and the label inside the buttons.',
type: 'string',
}),
Option({
opt: options.bar.windowtitle.leftClick,
title: 'Left Click',
type: 'string',
}),
Option({
opt: options.bar.windowtitle.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.windowtitle.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.windowtitle.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.windowtitle.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
/*
******************************
* VOLUME *
******************************
*/
Header('Volume'),
Option({
opt: options.theme.bar.buttons.volume.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
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',
}),
Option({
opt: options.bar.volume.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.volume.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.volume.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.volume.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
/*
******************************
* NETWORK *
******************************
*/
Header('Network'),
Option({
opt: options.theme.bar.buttons.network.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.network.label,
title: 'Show Network Name',
type: 'boolean',
}),
Option({
opt: options.bar.network.truncation,
title: 'Truncate Network Name',
subtitle: 'Will truncate the network name to the specified size below.',
type: 'boolean',
}),
Option({
opt: options.bar.network.truncation_size,
title: 'Truncation Size',
type: 'number',
}),
Option({
opt: options.theme.bar.buttons.network.spacing,
title: 'Inner Spacing',
subtitle: 'Spacing between the icon and the label inside the buttons.',
type: 'string',
}),
Option({
opt: options.bar.network.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.network.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.network.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.network.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
/*
******************************
* BLUETOOTH *
******************************
*/
Header('Bluetooth'),
Option({
opt: options.theme.bar.buttons.bluetooth.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
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',
}),
Option({
opt: options.bar.bluetooth.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.bluetooth.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.bluetooth.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.bluetooth.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
/*
******************************
* BATTERY *
******************************
*/
Header('Battery'),
Option({
opt: options.theme.bar.buttons.battery.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.battery.label,
title: 'Show Battery Percentage',
type: 'boolean',
}),
Option({
opt: options.bar.battery.hideLabelWhenFull,
title: 'Hide Battery Percentage When Full',
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',
}),
Option({
opt: options.bar.battery.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.battery.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.battery.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.battery.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
/*
******************************
* SYSTEM TRAY *
******************************
*/
Header('System Tray'),
Option({
opt: options.theme.bar.buttons.systray.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.systray.ignore,
title: 'Ignore List',
subtitle:
'An array of applications to prevent from showing in the system tray.\n' +
'Wiki: https://hyprpanel.com/configuration/panel.html#system-tray',
subtitleLink: 'https://hyprpanel.com/configuration/panel.html#system-tray',
type: 'object',
}),
/*
******************************
* CLOCK *
******************************
*/
Header('Clock'),
Option({
opt: options.theme.bar.buttons.clock.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.clock.format,
title: 'Clock Format',
type: 'string',
}),
Option({
opt: options.bar.clock.icon,
title: 'Icon',
type: 'string',
}),
Option({
opt: options.bar.clock.showIcon,
title: 'Show Icon',
type: 'boolean',
}),
Option({
opt: options.bar.clock.showTime,
title: 'Show Time',
type: 'boolean',
}),
Option({
opt: options.theme.bar.buttons.clock.spacing,
title: 'Inner Spacing',
subtitle: 'Spacing between the icon and the label inside the buttons.',
type: 'string',
}),
Option({
opt: options.bar.clock.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.clock.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.clock.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.clock.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
/*
******************************
* MEDIA *
******************************
*/
Header('Media'),
Option({
opt: options.theme.bar.buttons.media.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.theme.bar.buttons.media.spacing,
title: 'Inner Spacing',
subtitle: 'Spacing between the icon and the label inside the buttons.',
type: 'string',
}),
Option({
opt: options.bar.media.show_artist,
title: 'Show Track Artist',
type: 'boolean',
}),
Option({
opt: options.bar.media.show_label,
title: 'Toggle Media Label',
type: 'boolean',
}),
Option({
opt: options.bar.media.truncation,
title: 'Truncate Media Label',
subtitle: 'Only applicable if Toggle Media Label is enabled',
type: 'boolean',
}),
Option({
opt: options.bar.media.truncation_size,
title: 'Truncation Size',
subtitle: 'Only applicable if Toggle Media Label is enabled',
type: 'number',
min: 10,
}),
Option({
opt: options.bar.media.show_active_only,
title: 'Auto Hide',
subtitle: 'Button will automatically hide if no media is detected.',
type: 'boolean',
}),
Option({
opt: options.bar.media.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.media.middleClick,
title: 'Middle Click',
type: 'string',
}),
/*
******************************
* NOTIFICATIONS *
******************************
*/
Header('Notifications'),
Option({
opt: options.theme.bar.buttons.notifications.enableBorder,
title: 'Button Border',
type: 'boolean',
}),
Option({
opt: options.bar.notifications.show_total,
title: 'Show Total # of notifications',
type: 'boolean',
}),
Option({
opt: options.bar.notifications.hideCountWhenZero,
title: 'Auto Hide Label',
subtitle: 'Hide Total # of notifications when zero',
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',
}),
Option({
opt: options.bar.notifications.rightClick,
title: 'Right Click',
type: 'string',
}),
Option({
opt: options.bar.notifications.middleClick,
title: 'Middle Click',
type: 'string',
}),
Option({
opt: options.bar.notifications.scrollUp,
title: 'Scroll Up',
type: 'string',
}),
Option({
opt: options.bar.notifications.scrollDown,
title: 'Scroll Down',
type: 'string',
}),
],
}),
});
};
@@ -0,0 +1,180 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const BarGeneral = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
class_name: 'bar-theme-page paged-container',
vscroll: 'automatic',
child: Widget.Box({
vertical: true,
children: [
Header('General Settings'),
Option({ opt: options.theme.font.name, title: 'Font', type: 'font' }),
Option({ opt: options.theme.font.size, title: 'Font Size', type: 'string' }),
Option({
opt: options.theme.font.weight,
title: 'Font Weight',
subtitle: '100, 200, 300, etc.',
type: 'number',
increment: 100,
min: 100,
max: 900,
}),
Option({
opt: options.dummy,
title: 'Config',
subtitle: 'WARNING: Importing a configuration will replace your current configuration settings.',
type: 'config_import',
exportData: {
filePath: OPTIONS,
themeOnly: false,
},
}),
Option({
opt: options.terminal,
title: 'Terminal',
subtitle: "Tools such as 'btop' will open in this terminal",
type: 'string',
}),
Option({
opt: options.tear,
title: 'Tearing Compatible',
subtitle:
'Makes HyprPanel compatible with Hyprland tearing.\n' +
"Enabling this will change all overlays (Notifications, OSDs, Bar) to the 'top' layer instead the 'overlay' layer.",
type: 'boolean',
}),
Option({
opt: options.menus.transition,
title: 'Menu Transition',
type: 'enum',
enums: ['none', 'crossfade'],
}),
Option({
opt: options.menus.transitionTime,
title: 'Menu Transition Duration',
type: 'number',
min: 100,
max: 10000,
increment: 100,
}),
Header('Scaling'),
Option({
opt: options.scalingPriority,
title: 'Scaling Priority',
type: 'enum',
enums: ['both', 'gdk', 'hyprland'],
}),
Option({
opt: options.theme.bar.scaling,
title: 'Bar',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.notification.scaling,
title: 'Notifications',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.osd.scaling,
title: 'OSD',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.scaling,
title: 'Dashboard Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.confirmation_scaling,
title: 'Confirmation Dialog',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.media.scaling,
title: 'Media Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.volume.scaling,
title: 'Volume Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.network.scaling,
title: 'Network Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.bluetooth.scaling,
title: 'Bluetooth Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.battery.scaling,
title: 'Battery Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.clock.scaling,
title: 'Clock Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.notifications.scaling,
title: 'Notifications Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
Option({
opt: options.theme.bar.menus.menu.power.scaling,
title: 'Power Menu',
type: 'number',
min: 1,
max: 100,
increment: 5,
}),
],
}),
});
};
@@ -0,0 +1,70 @@
import { BarGeneral } from './general/index';
import { BarSettings } from './bar/index';
import { ClockMenuSettings } from './menus/clock';
import { DashboardMenuSettings } from './menus/dashboard';
import { NotificationSettings } from './notifications/index';
import { OSDSettings } from './osd/index';
import { CustomModuleSettings } from 'customModules/config';
import { PowerMenuSettings } from './menus/power';
import { GBox } from 'lib/types/widget';
type Page =
| 'General'
| 'Bar'
| 'Clock Menu'
| 'Dashboard Menu'
| 'Power Menu'
| 'Notifications'
| 'OSD'
| 'Custom Modules';
const CurrentPage = Variable<Page>('General');
const pagerMap: Page[] = [
'General',
'Bar',
'Notifications',
'OSD',
'Power Menu',
'Clock Menu',
'Dashboard Menu',
'Custom Modules',
];
export const SettingsMenu = (): GBox => {
return Widget.Box({
vertical: true,
children: CurrentPage.bind('value').as((v) => {
return [
Widget.Box({
class_name: 'option-pages-container',
hpack: 'center',
hexpand: true,
children: pagerMap.map((page) => {
return Widget.Button({
hpack: 'center',
class_name: `pager-button ${v === page ? 'active' : ''}`,
label: page,
on_primary_click: () => (CurrentPage.value = page),
});
}),
}),
Widget.Stack({
vexpand: true,
class_name: 'themes-menu-stack',
children: {
General: BarGeneral(),
Bar: BarSettings(),
Notifications: NotificationSettings(),
OSD: OSDSettings(),
'Clock Menu': ClockMenuSettings(),
'Dashboard Menu': DashboardMenuSettings(),
'Custom Modules': CustomModuleSettings(),
'Power Menu': PowerMenuSettings(),
},
shown: CurrentPage.bind('value'),
}),
];
}),
});
};
@@ -0,0 +1,48 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const ClockMenuSettings = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
child: Widget.Box({
class_name: 'bar-theme-page paged-container',
vertical: true,
children: [
Header('Time'),
Option({ opt: options.menus.clock.time.military, title: 'Use 24hr time', type: 'boolean' }),
Option({ opt: options.menus.clock.time.hideSeconds, title: 'Hide seconds', type: 'boolean' }),
Header('Weather'),
Option({ opt: options.menus.clock.weather.enabled, title: 'Enabled', type: 'boolean' }),
Option({
opt: options.menus.clock.weather.location,
title: 'Location',
subtitle: 'Zip Code, Postal Code, City, etc.',
type: 'string',
}),
Option({
opt: options.menus.clock.weather.key,
title: 'Weather API Key',
subtitle: 'May require AGS restart. https://weatherapi.com/',
type: 'string',
}),
Option({
opt: options.menus.clock.weather.unit,
title: 'Units',
type: 'enum',
enums: ['imperial', 'metric'],
}),
Option({
opt: options.menus.clock.weather.interval,
title: 'Weather Fetching Interval (ms)',
subtitle: 'May require AGS restart.',
type: 'number',
}),
],
}),
});
};
@@ -0,0 +1,214 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const DashboardMenuSettings = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
class_name: 'bar-theme-page paged-container',
vscroll: 'always',
hscroll: 'automatic',
vexpand: true,
overlayScrolling: true,
child: Widget.Box({
vertical: true,
children: [
Header('Power Menu'),
Option({ opt: options.menus.dashboard.powermenu.avatar.image, title: 'Profile Image', type: 'img' }),
Option({
opt: options.menus.dashboard.powermenu.avatar.name,
title: 'Profile Name',
subtitle: "Use 'system' to automatically set system name",
type: 'string',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.profile.size,
title: 'Profile Image Size',
type: 'string',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.profile.radius,
title: 'Profile Image Radius',
type: 'string',
}),
Option({
opt: options.menus.dashboard.powermenu.confirmation,
title: 'Show Confirmation Dialogue',
type: 'boolean',
}),
Option({ opt: options.menus.dashboard.powermenu.shutdown, title: 'Shutdown Command', type: 'string' }),
Option({ opt: options.menus.dashboard.powermenu.reboot, title: 'Reboot Command', type: 'string' }),
Option({ opt: options.menus.dashboard.powermenu.logout, title: 'Logout Command', type: 'string' }),
Option({ opt: options.menus.dashboard.powermenu.sleep, title: 'Sleep Command', type: 'string' }),
Header('Controls'),
Option({ opt: options.menus.dashboard.controls.enabled, title: 'Enabled', type: 'boolean' }),
Header('Resource Usage Metrics'),
Option({ opt: options.menus.dashboard.stats.enabled, title: 'Enabled', type: 'boolean' }),
Option({
opt: options.menus.dashboard.stats.enable_gpu,
title: 'Track GPU',
subtitle: "NOTE: This is currently only available for NVidia GPUs and requires 'python-gpustat'.",
type: 'boolean',
}),
Header('Shortcuts'),
Option({ opt: options.menus.dashboard.shortcuts.enabled, title: 'Enabled', type: 'boolean' }),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut1.icon,
title: 'Left - Shortcut 1 (Icon)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut1.command,
title: 'Left - Shortcut 1 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut1.tooltip,
title: 'Left - Shortcut 1 (Tooltip)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut2.icon,
title: 'Left - Shortcut 2 (Icon)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut2.command,
title: 'Left - Shortcut 2 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut2.tooltip,
title: 'Left - Shortcut 2 (Tooltip)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut3.icon,
title: 'Left - Shortcut 3 (Icon)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut3.command,
title: 'Left - Shortcut 3 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut3.tooltip,
title: 'Left - Shortcut 3 (Tooltip)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut4.icon,
title: 'Left - Shortcut 4 (Icon)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut4.command,
title: 'Left - Shortcut 4 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.left.shortcut4.tooltip,
title: 'Left - Shortcut 4 (Tooltip)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.right.shortcut1.icon,
title: 'Right - Shortcut 1 (Icon)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.right.shortcut1.command,
title: 'Right - Shortcut 1 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.right.shortcut1.tooltip,
title: 'Right - Shortcut 1 (Tooltip)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.right.shortcut3.icon,
title: 'Right - Shortcut 3 (Icon)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.right.shortcut3.command,
title: 'Right - Shortcut 3 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.shortcuts.right.shortcut3.tooltip,
title: 'Right - Shortcut 3 (Tooltip)',
type: 'string',
}),
Header('Directories'),
Option({ opt: options.menus.dashboard.directories.enabled, title: 'Enabled', type: 'boolean' }),
Option({
opt: options.menus.dashboard.directories.left.directory1.label,
title: 'Left - Directory 1 (Label)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.left.directory1.command,
title: 'Left - Directory 1 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.left.directory2.label,
title: 'Left - Directory 2 (Label)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.left.directory2.command,
title: 'Left - Directory 2 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.left.directory3.label,
title: 'Left - Directory 3 (Label)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.left.directory3.command,
title: 'Left - Directory 3 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.right.directory1.label,
title: 'Right - Directory 1 (Label)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.right.directory1.command,
title: 'Right - Directory 1 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.right.directory2.label,
title: 'Right - Directory 2 (Label)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.right.directory2.command,
title: 'Right - Directory 2 (Command)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.right.directory3.label,
title: 'Right - Directory 3 (Label)',
type: 'string',
}),
Option({
opt: options.menus.dashboard.directories.right.directory3.command,
title: 'Right - Directory 3 (Command)',
type: 'string',
}),
],
}),
});
};
@@ -0,0 +1,28 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import { Attribute, Child } from 'lib/types/widget';
import Scrollable from 'types/widgets/scrollable';
export const PowerMenuSettings = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
class_name: 'bar-theme-page paged-container',
vscroll: 'always',
hscroll: 'automatic',
vexpand: true,
overlayScrolling: true,
child: Widget.Box({
vertical: true,
children: [
Header('Power Menu'),
Option({ opt: options.menus.power.showLabel, title: 'Show Label', type: 'boolean' }),
Option({ opt: options.menus.power.confirmation, title: 'Confirmation Dialog', type: 'boolean' }),
Option({ opt: options.menus.power.shutdown, title: 'Shutdown Command', type: 'string' }),
Option({ opt: options.menus.power.reboot, title: 'Reboot Command', type: 'string' }),
Option({ opt: options.menus.power.logout, title: 'Logout Command', type: 'string' }),
Option({ opt: options.menus.power.sleep, title: 'Sleep Command', type: 'string' }),
],
}),
});
};
@@ -0,0 +1,104 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const NotificationSettings = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
child: Widget.Box({
class_name: 'bar-theme-page paged-container',
vertical: true,
children: [
Header('Notification Settings'),
Option({
opt: options.notifications.ignore,
title: 'Ignored Applications',
subtitle:
'Applications to ignore.\n' +
'Wiki: https://hyprpanel.com/configuration/notifications.html#ignored-applications',
subtitleLink: 'https://hyprpanel.com/configuration/notifications.html#ignored-applications',
type: 'object',
}),
Option({
opt: options.notifications.position,
title: 'Notification Location',
type: 'enum',
enums: ['top left', 'top', 'top right', 'right', 'bottom right', 'bottom', 'bottom left', 'left'],
}),
Option({
opt: options.theme.notification.border_radius,
title: 'Border Radius',
type: 'string',
}),
Option({
opt: options.notifications.monitor,
title: 'Monitor',
subtitle: 'The ID of the monitor on which to display the notification',
type: 'number',
}),
Option({
opt: options.notifications.active_monitor,
title: 'Follow Cursor',
subtitle: 'The notification will follow the monitor of your cursor',
type: 'boolean',
}),
Option({
opt: options.notifications.clearDelay,
title: 'Clear Delay',
subtitle:
'The delay in milliseconds before a notification is cleared' +
'\nWARNING: Setting this value too low may crash AGS depending on your system.',
type: 'number',
increment: 20,
}),
Option({
opt: options.notifications.timeout,
title: 'Notification Timeout',
subtitle: 'How long notification popups will last (in milliseconds).',
type: 'number',
}),
Option({
opt: options.notifications.cache_actions,
title: 'Preserve Actions',
subtitle: 'This will persist the action buttons of a notification after rebooting.',
type: 'boolean',
}),
Header('Notification Menu Settings'),
Option({
opt: options.theme.bar.menus.menu.notifications.height,
title: 'Notification Menu Height',
type: 'string',
}),
Option({
opt: options.notifications.displayedTotal,
title: 'Displayed Total',
subtitle:
'How many notifications to show in the menu at once.\n' +
'Newer notifications will display towards the top.',
type: 'number',
min: 1,
}),
Option({
opt: options.theme.bar.menus.menu.notifications.pager.show,
title: 'Show Pager',
subtitle: 'Shows the pagination footer at the bottom of the menu.',
type: 'boolean',
}),
Option({
opt: options.theme.bar.menus.menu.notifications.scrollbar.width,
title: 'Scrollbar Width',
type: 'string',
}),
Option({
opt: options.theme.bar.menus.menu.notifications.scrollbar.radius,
title: 'Scrollbar Radius',
type: 'string',
}),
],
}),
});
};
@@ -0,0 +1,71 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const OSDSettings = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
child: Widget.Box({
class_name: 'bar-theme-page paged-container',
vertical: true,
children: [
Header('On Screen Display'),
Option({ opt: options.theme.osd.enable, title: 'Enabled', type: 'boolean' }),
Option({
opt: options.theme.osd.duration,
title: 'Duration',
type: 'number',
min: 100,
max: 10000,
increment: 500,
}),
Option({
opt: options.theme.osd.orientation,
title: 'Orientation',
type: 'enum',
enums: ['horizontal', 'vertical'],
}),
Option({
opt: options.theme.osd.location,
title: 'Position',
subtitle: 'Position of the OSD on the screen',
type: 'enum',
enums: ['top left', 'top', 'top right', 'right', 'bottom right', 'bottom', 'bottom left', 'left'],
}),
Option({
opt: options.theme.osd.monitor,
title: 'Monitor',
subtitle: 'The ID of the monitor on which to display the OSD',
type: 'number',
}),
Option({
opt: options.theme.osd.active_monitor,
title: 'Follow Cursor',
subtitle: 'The OSD will follow the monitor of your cursor',
type: 'boolean',
}),
Option({
opt: options.theme.osd.radius,
title: 'Radius',
subtitle: 'Radius of the on-screen-display that indicates volume/brightness change',
type: 'string',
}),
Option({
opt: options.theme.osd.margins,
title: 'Margins',
subtitle: 'Margins in the following format: top right bottom left',
type: 'string',
}),
Option({
opt: options.theme.osd.muted_zero,
title: 'Mute Volume as Zero',
subtitle: 'Display volume as 0 when muting, instead of previous device volume',
type: 'boolean',
}),
],
}),
});
};
@@ -0,0 +1,227 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const BarTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'always',
hscroll: 'automatic',
class_name: 'bar-theme-page paged-container',
child: Widget.Box({
vertical: true,
children: [
Header('General'),
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.style,
title: 'Button Style',
type: 'enum',
enums: ['default', 'split', 'wave', 'wave2'],
}),
Option({
opt: options.theme.bar.opacity,
title: 'Background Opacity',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Option({
opt: options.theme.bar.buttons.opacity,
title: 'Button Opacity',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Option({
opt: options.theme.bar.buttons.background_opacity,
title: 'Button Background Opacity',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Option({
opt: options.theme.bar.buttons.background_hover_opacity,
title: 'Button Background Hover Opacity',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Option({
opt: options.theme.bar.buttons.monochrome,
title: 'Use Global Colors',
type: 'boolean',
disabledBinding: options.theme.matugen,
}),
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' }),
Option({ opt: options.theme.bar.buttons.icon, title: 'Button Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Dashboard Button'),
Option({ opt: options.theme.bar.buttons.dashboard.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.dashboard.icon, title: 'Icon', type: 'color' }),
Option({ opt: options.theme.bar.buttons.dashboard.border, title: 'Border', type: 'color' }),
Header('Workspaces'),
Option({ opt: options.theme.bar.buttons.workspaces.background, title: 'Background', type: 'color' }),
Option({
opt: options.theme.bar.buttons.workspaces.hover,
title: 'Workspace Hover Color',
type: 'color',
}),
Option({
opt: options.theme.bar.buttons.workspaces.available,
title: 'Workspace Available Color',
type: 'color',
}),
Option({
opt: options.theme.bar.buttons.workspaces.occupied,
title: 'Workspace Occupied Color',
type: 'color',
}),
Option({
opt: options.theme.bar.buttons.workspaces.active,
title: 'Workspace Active Color',
type: 'color',
}),
Option({
opt: options.theme.bar.buttons.workspaces.numbered_active_highlighted_text_color,
title: 'Highlighted Workspace Text Color',
type: 'color',
}),
Option({
opt: options.theme.bar.buttons.workspaces.numbered_active_underline_color,
title: 'Workspace Underline Color',
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.workspaces.border, title: 'Border', type: 'color' }),
Header('Window Title'),
Option({ opt: options.theme.bar.buttons.windowtitle.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.windowtitle.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.buttons.windowtitle.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.windowtitle.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.windowtitle.border, title: 'Border', type: 'color' }),
Header('Media'),
Option({ opt: options.theme.bar.buttons.media.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.media.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.buttons.media.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.media.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.media.border, title: 'Border', type: 'color' }),
Header('Volume'),
Option({ opt: options.theme.bar.buttons.volume.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.volume.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.buttons.volume.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.volume.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.volume.border, title: 'Border', type: 'color' }),
Header('Network'),
Option({ opt: options.theme.bar.buttons.network.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.network.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.buttons.network.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.network.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.network.border, title: 'Border', type: 'color' }),
Header('Bluetooth'),
Option({ opt: options.theme.bar.buttons.bluetooth.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.bluetooth.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.buttons.bluetooth.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.bluetooth.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.bluetooth.border, title: 'Border', type: 'color' }),
Header('System Tray'),
Option({ opt: options.theme.bar.buttons.systray.background, title: 'Background', type: 'color' }),
Header('Battery'),
Option({ opt: options.theme.bar.buttons.battery.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.battery.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.buttons.battery.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.battery.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.battery.border, title: 'Border', type: 'color' }),
Header('Clock'),
Option({ opt: options.theme.bar.buttons.clock.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.clock.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.buttons.clock.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.clock.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.clock.border, title: 'Border', type: 'color' }),
Header('Notifications'),
Option({ opt: options.theme.bar.buttons.notifications.background, title: 'Background', type: 'color' }),
Option({
opt: options.theme.bar.buttons.notifications.total,
title: 'Notification Count',
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.notifications.icon, title: 'Icon', type: 'color' }),
Option({
opt: options.theme.bar.buttons.notifications.icon_background,
title: 'Button Icon Background',
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Option({ opt: options.theme.bar.buttons.notifications.border, title: 'Border', type: 'color' }),
],
}),
});
};
@@ -0,0 +1,111 @@
import { BarTheme } from './bar/index';
import { NotificationsTheme } from './notifications/index';
import { BatteryMenuTheme } from './menus/battery';
import { BluetoothMenuTheme } from './menus/bluetooth';
import { ClockMenuTheme } from './menus/clock';
import { DashboardMenuTheme } from './menus/dashboard';
import { MenuTheme } from './menus/index';
import { MediaMenuTheme } from './menus/media';
import { NetworkMenuTheme } from './menus/network';
import { NotificationsMenuTheme } from './menus/notifications';
import { SystrayMenuTheme } from './menus/systray';
import { VolumeMenuTheme } from './menus/volume';
import { OsdTheme } from './osd/index';
import { Matugen } from './menus/matugen';
import { CustomModuleTheme } from 'customModules/theme';
import { PowerMenuTheme } from './menus/power';
import { GBox } from 'lib/types/widget';
type Page =
| 'General Settings'
| 'Matugen Settings'
| 'Bar'
| 'Notifications'
| 'OSD'
| 'Battery Menu'
| 'Bluetooth Menu'
| 'Clock Menu'
| 'Dashboard Menu'
| 'Media Menu'
| 'Network Menu'
| 'Notifications Menu'
| 'System Tray'
| 'Volume Menu'
| 'Power Menu'
| 'Custom Modules';
const CurrentPage = Variable<Page>('General Settings');
const pagerMap: Page[] = [
'General Settings',
'Matugen Settings',
'Bar',
'Notifications',
'OSD',
'Battery Menu',
'Bluetooth Menu',
'Clock Menu',
'Dashboard Menu',
'Media Menu',
'Network Menu',
'Notifications Menu',
'System Tray',
'Volume Menu',
'Power Menu',
'Custom Modules',
];
export const ThemesMenu = (): GBox => {
return Widget.Box({
vertical: true,
children: CurrentPage.bind('value').as((v) => {
return [
Widget.Box({
class_name: 'option-pages-container',
hpack: 'center',
hexpand: true,
vertical: true,
children: [0, 1, 2].map((section) => {
return Widget.Box({
children: pagerMap.map((page, index) => {
if (index >= section * 6 && index < section * 6 + 6) {
return Widget.Button({
hpack: 'center',
xalign: 0,
class_name: `pager-button ${v === page ? 'active' : ''}`,
label: page,
on_primary_click: () => (CurrentPage.value = page),
});
}
return Widget.Box();
}),
});
}),
}),
Widget.Stack({
vexpand: true,
class_name: 'themes-menu-stack',
children: {
'General Settings': MenuTheme(),
'Matugen Settings': Matugen(),
Bar: BarTheme(),
Notifications: NotificationsTheme(),
OSD: OsdTheme(),
'Battery Menu': BatteryMenuTheme(),
'Bluetooth Menu': BluetoothMenuTheme(),
'Clock Menu': ClockMenuTheme(),
'Dashboard Menu': DashboardMenuTheme(),
'Media Menu': MediaMenuTheme(),
'Network Menu': NetworkMenuTheme(),
'Notifications Menu': NotificationsMenuTheme(),
'System Tray': SystrayMenuTheme(),
'Volume Menu': VolumeMenuTheme(),
'Power Menu': PowerMenuTheme(),
'Custom Modules': CustomModuleTheme(),
},
shown: CurrentPage.bind('value'),
}),
];
}),
});
};
@@ -0,0 +1,68 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const BatteryMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page battery paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Battery Menu Theme Settings'),
Option({ opt: options.theme.bar.menus.menu.battery.text, title: 'Text', type: 'color' }),
Header('Card'),
Option({ opt: options.theme.bar.menus.menu.battery.card.color, title: 'Card', type: 'color' }),
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.battery.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.battery.border.color, title: 'Border', type: 'color' }),
Header('Label'),
Option({ opt: options.theme.bar.menus.menu.battery.label.color, title: 'Label', type: 'color' }),
Header('List Items'),
Option({
opt: options.theme.bar.menus.menu.battery.listitems.active,
title: 'Active/Hover',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.battery.listitems.passive,
title: 'Passive',
type: 'color',
}),
Header('Icons'),
Option({ opt: options.theme.bar.menus.menu.battery.icons.active, title: 'Active', type: 'color' }),
Option({ opt: options.theme.bar.menus.menu.battery.icons.passive, title: 'Passive', type: 'color' }),
Header('Slider'),
Option({ opt: options.theme.bar.menus.menu.battery.slider.primary, title: 'Primary', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.battery.slider.background,
title: 'Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.battery.slider.backgroundhover,
title: 'Background (Hover)',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.battery.slider.puck, title: 'Puck', type: 'color' }),
],
}),
});
};
@@ -0,0 +1,89 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const BluetoothMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page bluetooth paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Bluetooth Menu Theme Settings'),
Option({ opt: options.theme.bar.menus.menu.bluetooth.text, title: 'Text', type: 'color' }),
Header('Card'),
Option({ opt: options.theme.bar.menus.menu.bluetooth.card.color, title: 'Card', type: 'color' }),
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.bluetooth.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.bluetooth.border.color, title: 'Border', type: 'color' }),
Header('Label'),
Option({ opt: options.theme.bar.menus.menu.bluetooth.label.color, title: 'Label', type: 'color' }),
Header('Status'),
Option({
opt: options.theme.bar.menus.menu.bluetooth.status,
title: 'Connection Status',
type: 'color',
}),
Header('List Items'),
Option({
opt: options.theme.bar.menus.menu.bluetooth.listitems.active,
title: 'Active/Hover',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.bluetooth.listitems.passive,
title: 'Passive',
type: 'color',
}),
Header('Icons'),
Option({ opt: options.theme.bar.menus.menu.bluetooth.icons.active, title: 'Active', type: 'color' }),
Option({ opt: options.theme.bar.menus.menu.bluetooth.icons.passive, title: 'Passive', type: 'color' }),
Header('Icon Buttons'),
Option({
opt: options.theme.bar.menus.menu.bluetooth.iconbutton.active,
title: 'Active',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.bluetooth.iconbutton.passive,
title: 'Passive',
type: 'color',
}),
Header('Switch'),
Option({ opt: options.theme.bar.menus.menu.bluetooth.switch.enabled, title: 'Enabled', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.bluetooth.switch.disabled,
title: 'Disabled',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.bluetooth.switch.puck, title: 'Puck', type: 'color' }),
Header('Switch Divider'),
Option({
opt: options.theme.bar.menus.menu.bluetooth.switch_divider,
title: 'Switch Divider',
type: 'color',
}),
],
}),
});
};
@@ -0,0 +1,130 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const ClockMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page clock paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Clock Menu Theme Settings'),
Option({ opt: options.theme.bar.menus.menu.clock.text, title: 'Text', type: 'color' }),
Header('Card'),
Option({ opt: options.theme.bar.menus.menu.clock.card.color, title: 'Card', type: 'color' }),
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.clock.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.clock.border.color, title: 'Border', type: 'color' }),
Header('Time'),
Option({ opt: options.theme.bar.menus.menu.clock.time.time, title: 'Time', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.clock.time.timeperiod,
title: 'Period',
subtitle: 'AM/PM',
type: 'color',
}),
Header('Calendar'),
Option({
opt: options.theme.bar.menus.menu.clock.calendar.yearmonth,
title: 'Year/Month',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.clock.calendar.weekdays, title: 'Weekdays', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.clock.calendar.paginator,
title: 'Navigation Arrows (Hover)',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.calendar.currentday,
title: 'Current Day',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.clock.calendar.days, title: 'Days', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.clock.calendar.contextdays,
title: 'Trailing/Leading Days',
type: 'color',
}),
Header('Weather'),
Option({
opt: options.theme.bar.menus.menu.clock.weather.icon,
title: 'Current Weather Icon',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.temperature,
title: 'Current Temperature',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.status,
title: 'Current Status',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.stats,
title: 'Current Stats',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.thermometer.extremelyhot,
title: 'Thermometer - Extremely Hot',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.thermometer.hot,
title: 'Thermometer - Hot',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.thermometer.moderate,
title: 'Thermometer - Moderate',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.thermometer.cold,
title: 'Thermometer - Cold',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.thermometer.extremelycold,
title: 'Thermometer - Extremely Cold',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.hourly.time,
title: 'Hourly Weather Time',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.hourly.icon,
title: 'Hourly Weather Icon',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.clock.weather.hourly.temperature,
title: 'Hourly Weather Temperature',
type: 'color',
}),
],
}),
});
};
@@ -0,0 +1,268 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const DashboardMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'always',
hscroll: 'automatic',
class_name: 'menu-theme-page dashboard paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Card'),
Option({ opt: options.theme.bar.menus.menu.dashboard.card.color, title: 'Card', type: 'color' }),
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.dashboard.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.dashboard.border.color, title: 'Border', type: 'color' }),
Header('Profile'),
Option({
opt: options.theme.bar.menus.menu.dashboard.profile.name,
title: 'Profile Name',
type: 'color',
}),
Header('Power Menu'),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.shutdown,
title: 'Shutdown',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.restart,
title: 'Restart',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.logout,
title: 'Log Out',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.dashboard.powermenu.sleep, title: 'Sleep', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.card,
title: 'Confirmation Dialog Card',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.background,
title: 'Confirmation Dialog Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.border,
title: 'Confirmation Dialog Border',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.label,
title: 'Confirmation Dialog Label',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.body,
title: 'Confirmation Dialog Description',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.confirm,
title: 'Confirmation Dialog Confirm Button',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.deny,
title: 'Confirmation Dialog Cancel Button',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.powermenu.confirmation.button_text,
title: 'Confirmation Dialog Button Text',
type: 'color',
}),
Header('Shortcuts'),
Option({
opt: options.theme.bar.menus.menu.dashboard.shortcuts.background,
title: 'Primary',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.dashboard.shortcuts.text, title: 'Text', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.dashboard.shortcuts.recording,
title: 'Recording',
subtitle: 'Color of the Record button when recording is in progress',
type: 'color',
}),
Header('Controls'),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.disabled,
title: 'Module Off',
subtitle: 'Button color when element is disabled',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.wifi.background,
title: 'Wifi Button',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.wifi.text,
title: 'Wifi Button Text',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.bluetooth.background,
title: 'Bluetooth Button',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.bluetooth.text,
title: 'Bluetooth Button Text',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.notifications.background,
title: 'Notifications Button',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.notifications.text,
title: 'Notifications Button Text',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.volume.background,
title: 'Volume Button',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.volume.text,
title: 'Volume Button Text',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.input.background,
title: 'Input Button',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.controls.input.text,
title: 'Input Button Text',
type: 'color',
}),
Header('Directories'),
Option({
opt: options.theme.bar.menus.menu.dashboard.directories.left.top.color,
title: 'Directory: Left - Top',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.directories.left.middle.color,
title: 'Directory: Left - Middle',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.directories.left.bottom.color,
title: 'Directory: Left - Bottom',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.directories.right.top.color,
title: 'Directory: Right - Top',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.directories.right.middle.color,
title: 'Directory: Right - Middle',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.directories.right.bottom.color,
title: 'Directory: Right - Bottom',
type: 'color',
}),
Header('System Stats'),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.bar_background,
title: 'Bar Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.cpu.icon,
title: 'CPU Icon',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.cpu.bar,
title: 'CPU Bar',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.cpu.label,
title: 'CPU Label',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.ram.icon,
title: 'RAM Icon',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.ram.bar,
title: 'RAM Bar',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.ram.label,
title: 'RAM Label',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.gpu.icon,
title: 'GPU Icon',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.gpu.bar,
title: 'GPU Bar',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.gpu.label,
title: 'GPU Label',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.disk.icon,
title: 'Disk Icon',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.disk.bar,
title: 'Disk Bar',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.dashboard.monitors.disk.label,
title: 'Disk Label',
type: 'color',
}),
],
}),
});
};
@@ -0,0 +1,139 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const MenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('General'),
Option({
opt: options.dummy,
title: 'Theme',
subtitle: 'WARNING: Importing a theme will replace your current theme color settings.',
type: 'config_import',
exportData: {
filePath: OPTIONS,
themeOnly: true,
},
}),
Option({
opt: options.theme.bar.menus.monochrome,
title: 'Use Global Colors',
type: 'boolean',
disabledBinding: options.theme.matugen,
}),
Option({
opt: options.wallpaper.pywal,
title: 'Generate Pywal Colors',
subtitle: 'Whether to also generate pywal colors with chosen wallpaper',
type: 'boolean',
}),
Option({
opt: options.wallpaper.enable,
title: 'Apply Wallpapers',
subtitle: 'Whether to apply the wallpaper or to only use it for Matugen color generation.',
type: 'boolean',
}),
Option({
opt: options.wallpaper.image,
title: 'Wallpaper',
subtitle: options.wallpaper.image.bind('value'),
type: 'wallpaper',
}),
Option({ opt: options.theme.bar.menus.background, title: 'Background Color', type: 'color' }),
Option({
opt: options.theme.bar.menus.opacity,
title: 'Menu Opacity',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Option({ opt: options.theme.bar.menus.cards, title: 'Cards', type: 'color' }),
Option({ opt: options.theme.bar.menus.card_radius, title: 'Card Radius', type: 'string' }),
Option({ opt: options.theme.bar.menus.text, title: 'Primary Text', type: 'color' }),
Option({ opt: options.theme.bar.menus.dimtext, title: 'Dim Text', type: 'color' }),
Option({ opt: options.theme.bar.menus.feinttext, title: 'Feint Text', type: 'color' }),
Option({ opt: options.theme.bar.menus.label, title: 'Label Color', type: 'color' }),
Header('Border'),
Option({ opt: options.theme.bar.menus.border.size, title: 'Border Width', type: 'string' }),
Option({ opt: options.theme.bar.menus.border.radius, title: 'Border Radius', type: 'string' }),
Option({ opt: options.theme.bar.menus.border.color, title: 'Border Color', type: 'color' }),
Header('Popover'),
Option({ opt: options.theme.bar.menus.popover.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.menus.popover.background, title: 'Background', type: 'color' }),
Header('List Items'),
Option({
opt: options.theme.bar.menus.listitems.active,
title: 'Active',
subtitle:
'Items of a list (network name, bluetooth device name, playback device, etc.) when active or hovered.',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.listitems.passive, title: 'Passive', type: 'color' }),
Header('Icons'),
Option({ opt: options.theme.bar.menus.icons.active, title: 'Active', type: 'color' }),
Option({ opt: options.theme.bar.menus.icons.passive, title: 'Passive', type: 'color' }),
Header('Switch'),
Option({ opt: options.theme.bar.menus.switch.enabled, title: 'Enabled', type: 'color' }),
Option({ opt: options.theme.bar.menus.switch.disabled, title: 'Disabled', type: 'color' }),
Option({ opt: options.theme.bar.menus.switch.puck, title: 'Puck', type: 'color' }),
Header('Check/Radio Buttons'),
Option({
opt: options.theme.bar.menus.check_radio_button.background,
title: 'Background',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.check_radio_button.active, title: 'Active', type: 'color' }),
Header('Buttons'),
Option({ opt: options.theme.bar.menus.buttons.default, title: 'Primary', type: 'color' }),
Option({ opt: options.theme.bar.menus.buttons.active, title: 'Active', type: 'color' }),
Option({ opt: options.theme.bar.menus.buttons.disabled, title: 'Disabled', type: 'color' }),
Option({ opt: options.theme.bar.menus.buttons.text, title: 'Text', type: 'color' }),
Header('Icon Buttons'),
Option({ opt: options.theme.bar.menus.iconbuttons.passive, title: 'Primary', type: 'color' }),
Option({ opt: options.theme.bar.menus.iconbuttons.active, title: 'Active/Hovered', type: 'color' }),
Header('Progress Bar'),
Option({ opt: options.theme.bar.menus.progressbar.foreground, title: 'Primary', type: 'color' }),
Option({ opt: options.theme.bar.menus.progressbar.background, title: 'Background', type: 'color' }),
Header('Slider'),
Option({ opt: options.theme.bar.menus.slider.primary, title: 'Primary', type: 'color' }),
Option({ opt: options.theme.bar.menus.slider.background, title: 'Background', type: 'color' }),
Option({
opt: options.theme.bar.menus.slider.backgroundhover,
title: 'Background (Hover)',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.slider.puck, title: 'Puck', type: 'color' }),
Header('Dropdown Menu'),
Option({ opt: options.theme.bar.menus.dropdownmenu.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.menus.dropdownmenu.text, title: 'Text', type: 'color' }),
Option({ opt: options.theme.bar.menus.dropdownmenu.divider, title: 'Divider', type: 'color' }),
Header('Tooltips'),
Option({ opt: options.theme.bar.menus.tooltip.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.menus.tooltip.text, title: 'Text', type: 'color' }),
],
}),
});
};
@@ -0,0 +1,71 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const Matugen = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Matugen Settings'),
Option({
opt: options.theme.matugen,
title: 'Enable Matugen',
subtitle: 'WARNING: THIS WILL REPLACE YOUR CURRENT COLOR SCHEME!!!',
type: 'boolean',
dependencies: ['matugen', 'swww'],
}),
Option({
opt: options.theme.matugen_settings.mode,
title: 'Matugen Theme',
type: 'enum',
enums: ['light', 'dark'],
}),
Option({
opt: options.theme.matugen_settings.scheme_type,
title: 'Matugen Scheme',
type: 'enum',
enums: [
'content',
'expressive',
'fidelity',
'fruit-salad',
'monochrome',
'neutral',
'rainbow',
'tonal-spot',
],
}),
Option({
opt: options.theme.matugen_settings.variation,
title: 'Matugen Variation',
type: 'enum',
enums: [
'standard_1',
'standard_2',
'standard_3',
'monochrome_1',
'monochrome_2',
'monochrome_3',
'vivid_1',
'vivid_2',
'vivid_3',
],
}),
Option({
opt: options.theme.matugen_settings.contrast,
title: 'Contrast',
subtitle: 'Range: -1 to 1 (Default: 0)',
type: 'float',
}),
],
}),
});
};
@@ -0,0 +1,83 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const MediaMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page media paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Media Menu Theme Settings'),
Option({ opt: options.theme.bar.menus.menu.media.song, title: 'Song', type: 'color' }),
Option({ opt: options.theme.bar.menus.menu.media.artist, title: 'Artist', type: 'color' }),
Option({ opt: options.theme.bar.menus.menu.media.album, title: 'Album', type: 'color' }),
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.media.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.media.border.color, title: 'Border', type: 'color' }),
Header('Card/Album Art'),
Option({ opt: options.theme.bar.menus.menu.media.card.color, title: 'Color', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.media.card.tint,
title: 'Tint',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Header('Buttons'),
Option({
opt: options.theme.bar.menus.menu.media.buttons.inactive,
title: 'Unavailable',
subtitle: "Disabled button when media control isn't available.",
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.media.buttons.enabled,
title: 'Enabled',
subtitle: 'Ex: Button color when shuffle/loop is enabled.',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.media.buttons.background,
title: 'Background',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.media.buttons.text, title: 'Text', type: 'color' }),
Header('Slider'),
Option({
opt: options.theme.bar.menus.menu.media.slider.primary,
title: 'Primary Color',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.media.slider.background,
title: 'Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.media.slider.backgroundhover,
title: 'Backround (Hover)',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.media.slider.puck, title: 'Puck', type: 'color' }),
],
}),
});
};
@@ -0,0 +1,86 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const NetworkMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page network paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Network Menu Theme Settings'),
Option({ opt: options.theme.bar.menus.menu.network.text, title: 'Text', type: 'color' }),
Header('Card'),
Option({ opt: options.theme.bar.menus.menu.network.card.color, title: 'Card', type: 'color' }),
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.network.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.network.border.color, title: 'Border', type: 'color' }),
Header('Label'),
Option({ opt: options.theme.bar.menus.menu.network.label.color, title: 'Label', type: 'color' }),
Header('Status'),
Option({
opt: options.theme.bar.menus.menu.network.status.color,
title: 'Connection Status',
type: 'color',
}),
Header('Switch'),
Option({
opt: options.theme.bar.menus.menu.network.switch.enabled,
title: 'Enabled',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.network.switch.disabled,
title: 'Disabled',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.network.switch.puck, title: 'Puck', type: 'color' }),
Header('List Items'),
Option({
opt: options.theme.bar.menus.menu.network.listitems.active,
title: 'Active/Hover',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.network.listitems.passive,
title: 'Passive',
type: 'color',
}),
Header('Icons'),
Option({ opt: options.theme.bar.menus.menu.network.icons.active, title: 'Active', type: 'color' }),
Option({ opt: options.theme.bar.menus.menu.network.icons.passive, title: 'Passive', type: 'color' }),
Header('Icon Buttons'),
Option({
opt: options.theme.bar.menus.menu.network.iconbuttons.active,
title: 'Active',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.network.iconbuttons.passive,
title: 'Passive',
type: 'color',
}),
],
}),
});
};
@@ -0,0 +1,81 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const NotificationsMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page notifications paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Notifications Menu Theme Settings'),
Option({ opt: options.theme.bar.menus.menu.notifications.label, title: 'Menu Label', type: 'color' }),
Option({ opt: options.theme.bar.menus.menu.notifications.card, title: 'Card', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.notifications.background,
title: 'Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.notifications.no_notifications_label,
title: 'Empty Notifications Backdrop',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.notifications.border, title: 'Border', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.notifications.switch_divider,
title: 'Switch Divider',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.notifications.clear,
title: 'Clear Notifications Button',
type: 'color',
}),
Header('Switch'),
Option({
opt: options.theme.bar.menus.menu.notifications.switch.enabled,
title: 'Enabled',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.notifications.switch.disabled,
title: 'Disabled',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.notifications.switch.puck, title: 'Puck', type: 'color' }),
Header('Scrollbar'),
Option({
opt: options.theme.bar.menus.menu.notifications.scrollbar.color,
title: 'Scrollbar Color',
type: 'color',
}),
Header('Pagination'),
Option({
opt: options.theme.bar.menus.menu.notifications.pager.background,
title: 'Pager Footer Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.notifications.pager.button,
title: 'Pager Button Color',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.notifications.pager.label,
title: 'Pager Label Color',
type: 'color',
}),
],
}),
});
};
@@ -0,0 +1,101 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const PowerMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page power paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.power.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.power.border.color, title: 'Border', type: 'color' }),
Header('Shutdown Button'),
Option({
opt: options.theme.bar.menus.menu.power.buttons.shutdown.background,
title: 'Label Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.shutdown.icon_background,
title: 'Icon Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.shutdown.text,
title: 'Label Text',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.power.buttons.shutdown.icon, title: 'Icon', type: 'color' }),
Header('Reboot Button'),
Option({
opt: options.theme.bar.menus.menu.power.buttons.restart.background,
title: 'Label Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.restart.icon_background,
title: 'Icon Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.restart.text,
title: 'Label Text',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.power.buttons.restart.icon, title: 'Icon', type: 'color' }),
Header('Logout Button'),
Option({
opt: options.theme.bar.menus.menu.power.buttons.logout.background,
title: 'Label Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.logout.icon_background,
title: 'Icon Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.logout.text,
title: 'Label Text',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.power.buttons.logout.icon, title: 'Icon', type: 'color' }),
Header('Sleep Button'),
Option({
opt: options.theme.bar.menus.menu.power.buttons.sleep.background,
title: 'Label Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.sleep.icon_background,
title: 'Icon Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.power.buttons.sleep.text,
title: 'Label Text',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.power.buttons.sleep.icon, title: 'Icon', type: 'color' }),
],
}),
});
};
@@ -0,0 +1,32 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const SystrayMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page systray paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Dropdown Menu'),
Option({
opt: options.theme.bar.menus.menu.systray.dropdownmenu.background,
title: 'Background',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.systray.dropdownmenu.text, title: 'Text', type: 'color' }),
Option({
opt: options.theme.bar.menus.menu.systray.dropdownmenu.divider,
title: 'Section Divider',
type: 'color',
}),
],
}),
});
};
@@ -0,0 +1,98 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const VolumeMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page volume paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Volume Menu Theme Settings'),
Option({ opt: options.theme.bar.menus.menu.volume.text, title: 'Text', type: 'color' }),
Header('Card'),
Option({ opt: options.theme.bar.menus.menu.volume.card.color, title: 'Card', type: 'color' }),
Header('Background'),
Option({
opt: options.theme.bar.menus.menu.volume.background.color,
title: 'Background',
type: 'color',
}),
Header('Border'),
Option({ opt: options.theme.bar.menus.menu.volume.border.color, title: 'Border', type: 'color' }),
Header('Label'),
Option({ opt: options.theme.bar.menus.menu.volume.label.color, title: 'Label', type: 'color' }),
Header('List Items'),
Option({
opt: options.theme.bar.menus.menu.volume.listitems.active,
title: 'Active/Hover',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.volume.listitems.passive, title: 'Passive', type: 'color' }),
Header('Icon Button'),
Option({
opt: options.theme.bar.menus.menu.volume.iconbutton.active,
title: 'Active/Hover',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.volume.iconbutton.passive,
title: 'Passive',
type: 'color',
}),
Header('Icons'),
Option({ opt: options.theme.bar.menus.menu.volume.icons.active, title: 'Active', type: 'color' }),
Option({ opt: options.theme.bar.menus.menu.volume.icons.passive, title: 'Passive', type: 'color' }),
Header('Audio Slider'),
Option({
opt: options.theme.bar.menus.menu.volume.audio_slider.primary,
title: 'Primary',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.volume.audio_slider.background,
title: 'Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.volume.audio_slider.backgroundhover,
title: 'Background (Hover)',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.volume.audio_slider.puck, title: 'Puck', type: 'color' }),
Header('Input Slider'),
Option({
opt: options.theme.bar.menus.menu.volume.input_slider.primary,
title: 'Primary',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.volume.input_slider.background,
title: 'Background',
type: 'color',
}),
Option({
opt: options.theme.bar.menus.menu.volume.input_slider.backgroundhover,
title: 'Background (Hover)',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.menu.volume.input_slider.puck, title: 'Puck', type: 'color' }),
],
}),
});
};
@@ -0,0 +1,61 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const NotificationsTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'notifications-theme-page paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('Notifications Theme Settings'),
Option({ opt: options.theme.notification.background, title: 'Notification Background', type: 'color' }),
Option({
opt: options.theme.notification.opacity,
title: 'Notification Opacity',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Option({
opt: options.theme.notification.actions.background,
title: 'Action Button Background',
subtitle: 'Buttons that perform actions within a notification',
type: 'color',
}),
Option({
opt: options.theme.notification.actions.text,
title: 'Action Button Text Color',
type: 'color',
}),
Option({ opt: options.theme.notification.label, title: 'Label', type: 'color' }),
Option({ opt: options.theme.notification.border, title: 'Border', type: 'color' }),
Option({ opt: options.theme.notification.time, title: 'Time Stamp', type: 'color' }),
Option({ opt: options.theme.notification.text, title: 'Body Text', type: 'color' }),
Option({
opt: options.theme.notification.labelicon,
title: 'Label Icon',
subtitle: "Icon that accompanies the label. Doesn't apply if icon is an app icon.",
type: 'color',
}),
Option({
opt: options.theme.notification.close_button.background,
title: 'Dismiss Button',
type: 'color',
}),
Option({
opt: options.theme.notification.close_button.label,
title: 'Dismiss Button Text',
type: 'color',
}),
],
}),
});
};
@@ -0,0 +1,41 @@
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const OsdTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'osd-theme-page paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
children: [
Header('On Screen Display Settings'),
Option({
opt: options.theme.osd.opacity,
title: 'OSD Opacity',
type: 'number',
increment: 5,
min: 0,
max: 100,
}),
Option({ opt: options.theme.osd.bar_color, title: 'Bar', type: 'color' }),
Option({
opt: options.theme.osd.bar_overflow_color,
title: 'Bar Overflow',
subtitle: 'Overflow color is for when the volume goes over a 100',
type: 'color',
}),
Option({ opt: options.theme.osd.bar_empty_color, title: 'Bar Background', type: 'color' }),
Option({ opt: options.theme.osd.bar_container, title: 'Bar Container', type: 'color' }),
Option({ opt: options.theme.osd.icon, title: 'Icon', type: 'color' }),
Option({ opt: options.theme.osd.icon_container, title: 'Icon Container', type: 'color' }),
Option({ opt: options.theme.osd.label, title: 'Value Text', type: 'color' }),
],
}),
});
};