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

Implemented strict linting standards and prettier formatting config. (#248)

Browse Source 
* Implemented strict linting standards and prettier formatting config.

* More linter fixes and type updates.

* More linter updates and type fixes

* Remove noisy comments

* Linter and type updates

* Linter, formatting and type updates.

* Linter updates

* Type updates

* Type updates

* fixed all linter errors

* Fixed all linting, formatting and type issues.

* Resolve merge conflicts.
This commit is contained in:
Jas Singh
2024-09-14 16:20:05 -07:00
committed by GitHub
parent ff13e3dd3c
commit 2c72cc66d8
222 changed files with 13141 additions and 8433 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,25 +1,65 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const BarTheme = () => {
export const BarTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "always",
hscroll: "automatic",
class_name: "bar-theme-page paged-container",
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.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' }),
@@ -27,8 +67,9 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Dashboard Button'),
@@ -38,12 +79,36 @@ export const BarTheme = () => {
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.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',
}),
Header('Window Title'),
Option({ opt: options.theme.bar.buttons.windowtitle.background, title: 'Background', type: 'color' }),
@@ -53,8 +118,9 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Media'),
@@ -65,8 +131,9 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Volume'),
@@ -77,8 +144,9 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Network'),
@@ -89,8 +157,9 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Bluetooth'),
@@ -101,8 +170,9 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('System Tray'),
@@ -117,8 +187,9 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Clock'),
@@ -129,22 +200,28 @@ export const BarTheme = () => {
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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
Header('Notifications'),
Option({ opt: options.theme.bar.buttons.notifications.background, title: 'Background', type: 'color' }),
Option({ opt: options.theme.bar.buttons.notifications.hover, title: 'Hover', type: 'color' }),
Option({ opt: options.theme.bar.buttons.notifications.total, title: 'Notification Count', 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'
subtitle:
"Applies a background color to the icon section of the button.\nRequires 'split' button styling.",
type: 'color',
}),
]
})
})
}
],
}),
});
};

169
widget/settings/pages/theme/index.ts
View File

@@ -1,108 +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 { 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";
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 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",
]
'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 = () => {
export const ThemesMenu = (): GBox => {
return Widget.Box({
vertical: true,
children: CurrentPage.bind("value").as(v => {
children: CurrentPage.bind('value').as((v) => {
return [
Widget.Box({
class_name: "option-pages-container",
hpack: "center",
class_name: 'option-pages-container',
hpack: 'center',
hexpand: true,
vertical: true,
children: [0, 1, 2].map(section => {
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",
hpack: 'center',
xalign: 0,
class_name: `pager-button ${v === page ? 'active' : ''}`,
label: page,
on_primary_click: () => CurrentPage.value = page
})
on_primary_click: () => (CurrentPage.value = page),
});
}
return Widget.Box();
})
})
})
}),
});
}),
}),
Widget.Stack({
vexpand: true,
class_name: "themes-menu-stack",
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(),
'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"),
})
]
})
})
}
shown: CurrentPage.bind('value'),
}),
];
}),
});
};

54
widget/settings/pages/theme/menus/battery.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const BatteryMenuTheme = () => {
export const BatteryMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page battery paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page battery paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -19,7 +21,11 @@ export const BatteryMenuTheme = () => {
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' }),
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' }),
@@ -28,8 +34,16 @@ export const BatteryMenuTheme = () => {
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' }),
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' }),
@@ -37,10 +51,18 @@ export const BatteryMenuTheme = () => {
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.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' }),
]
})
})
}
],
}),
});
};

72
widget/settings/pages/theme/menus/bluetooth.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const BluetoothMenuTheme = () => {
export const BluetoothMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page bluetooth paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page bluetooth paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -19,7 +21,11 @@ export const BluetoothMenuTheme = () => {
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' }),
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' }),
@@ -28,28 +34,56 @@ export const BluetoothMenuTheme = () => {
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' }),
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' }),
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' }),
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.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' }),
]
})
})
}
Option({
opt: options.theme.bar.menus.menu.bluetooth.switch_divider,
title: 'Switch Divider',
type: 'color',
}),
],
}),
});
};

133
widget/settings/pages/theme/menus/clock.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const ClockMenuTheme = () => {
export const ClockMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page clock paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page clock paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -19,37 +21,110 @@ export const ClockMenuTheme = () => {
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' }),
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' }),
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.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.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' }),
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' }),
]
})
})
}
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',
}),
],
}),
});
};

296
widget/settings/pages/theme/menus/dashboard.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const DashboardMenuTheme = () => {
export const DashboardMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "always",
hscroll: "automatic",
class_name: "menu-theme-page dashboard paged-container",
vscroll: 'always',
hscroll: 'automatic',
class_name: 'menu-theme-page dashboard paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -16,69 +18,251 @@ export const DashboardMenuTheme = () => {
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' }),
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' }),
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.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' }),
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.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' }),
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' }),
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' }),
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' }),
]
})
})
}
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',
}),
],
}),
});
};

86
widget/settings/pages/theme/menus/index.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const MenuTheme = () => {
export const MenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -20,15 +22,42 @@ export const MenuTheme = () => {
type: 'config_import',
exportData: {
filePath: OPTIONS,
themeOnly: true
}
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.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.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' }),
@@ -46,7 +75,13 @@ export const MenuTheme = () => {
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.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'),
@@ -59,7 +94,11 @@ export const MenuTheme = () => {
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.background,
title: 'Background',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.check_radio_button.active, title: 'Active', type: 'color' }),
Header('Buttons'),
@@ -79,7 +118,11 @@ export const MenuTheme = () => {
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.backgroundhover,
title: 'Background (Hover)',
type: 'color',
}),
Option({ opt: options.theme.bar.menus.slider.puck, title: 'Puck', type: 'color' }),
Header('Dropdown Menu'),
@@ -90,8 +133,7 @@ export const MenuTheme = () => {
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' }),
]
})
})
}
],
}),
});
};

84
widget/settings/pages/theme/menus/matugen.ts
View File

@@ -1,53 +1,71 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const Matugen = () => {
export const Matugen = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page paged-container",
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,
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"
]
'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",
]
'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' }),
]
})
})
}
Option({
opt: options.theme.matugen_settings.contrast,
title: 'Contrast',
subtitle: 'Range: -1 to 1 (Default: 0)',
type: 'float',
}),
],
}),
});
};

77
widget/settings/pages/theme/menus/media.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const MediaMenuTheme = () => {
export const MediaMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page media paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page media paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -18,27 +20,64 @@ export const MediaMenuTheme = () => {
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' }),
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 }),
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.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.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' }),
]
})
})
}
],
}),
});
};

60
widget/settings/pages/theme/menus/network.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const NetworkMenuTheme = () => {
export const NetworkMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page network paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page network paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -19,7 +21,11 @@ export const NetworkMenuTheme = () => {
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' }),
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' }),
@@ -28,20 +34,40 @@ export const NetworkMenuTheme = () => {
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' }),
Option({
opt: options.theme.bar.menus.menu.network.status.color,
title: 'Connection Status',
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' }),
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' }),
]
})
})
}
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',
}),
],
}),
});
};

84
widget/settings/pages/theme/menus/notifications.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const NotificationsMenuTheme = () => {
export const NotificationsMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page notifications paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page notifications paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -15,25 +17,65 @@ export const NotificationsMenuTheme = () => {
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.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' }),
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.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' }),
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' }),
]
})
})
}
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',
}),
],
}),
});
};

102
widget/settings/pages/theme/menus/power.ts
View File

@@ -1,47 +1,101 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const PowerMenuTheme = () => {
export const PowerMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page power paged-container",
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' }),
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.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.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.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.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' }),
]
})
})
}
],
}),
});
};

36
widget/settings/pages/theme/menus/systray.ts
View File

@@ -1,22 +1,32 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const SystrayMenuTheme = () => {
export const SystrayMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page systray paged-container",
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.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' }),
]
})
})
}
Option({
opt: options.theme.bar.menus.menu.systray.dropdownmenu.divider,
title: 'Section Divider',
type: 'color',
}),
],
}),
});
};

85
widget/settings/pages/theme/menus/volume.ts
View File

@@ -1,13 +1,15 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const VolumeMenuTheme = () => {
export const VolumeMenuTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "menu-theme-page volume paged-container",
vscroll: 'automatic',
hscroll: 'automatic',
class_name: 'menu-theme-page volume paged-container',
vexpand: true,
child: Widget.Box({
vertical: true,
@@ -19,7 +21,11 @@ export const VolumeMenuTheme = () => {
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' }),
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' }),
@@ -28,30 +34,65 @@ export const VolumeMenuTheme = () => {
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.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' }),
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.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.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' }),
]
})
})
}
],
}),
});
};

65
widget/settings/pages/theme/notifications/index.ts
View File

@@ -1,30 +1,61 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const NotificationsTheme = () => {
export const NotificationsTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "notifications-theme-page paged-container",
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.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' }),
]
})
})
}
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',
}),
],
}),
});
};

40
widget/settings/pages/theme/osd/index.ts
View File

@@ -1,27 +1,41 @@
import { Option } from "widget/settings/shared/Option";
import { Header } from "widget/settings/shared/Header";
import { Option } from 'widget/settings/shared/Option';
import { Header } from 'widget/settings/shared/Header';
import options from "options";
import options from 'options';
import Scrollable from 'types/widgets/scrollable';
import { Attribute, Child } from 'lib/types/widget';
export const OsdTheme = () => {
export const OsdTheme = (): Scrollable<Child, Attribute> => {
return Widget.Scrollable({
vscroll: "automatic",
hscroll: "automatic",
class_name: "osd-theme-page paged-container",
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.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_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' }),
]
})
})
}
],
}),
});
};