Made the settings menu significantly more responsive. (#454)
This commit is contained in:
@@ -39,33 +39,33 @@ const PageContainer = (): GBox => {
|
|||||||
hpack: 'fill',
|
hpack: 'fill',
|
||||||
hexpand: true,
|
hexpand: true,
|
||||||
vertical: true,
|
vertical: true,
|
||||||
children: CurrentPage.bind('value').as((v) => {
|
children: [
|
||||||
return [
|
Widget.Box({
|
||||||
Widget.Box({
|
class_name: 'option-pages-container',
|
||||||
class_name: 'option-pages-container',
|
hpack: 'center',
|
||||||
hpack: 'center',
|
hexpand: true,
|
||||||
hexpand: true,
|
children: pagerMap.map((page) => {
|
||||||
children: pagerMap.map((page) => {
|
return Widget.Button({
|
||||||
return Widget.Button({
|
xalign: 0,
|
||||||
xalign: 0,
|
hpack: 'center',
|
||||||
hpack: 'center',
|
class_name: CurrentPage.bind('value').as(
|
||||||
class_name: `pager-button ${v === page ? 'active' : ''} category`,
|
(v) => `pager-button ${v === page ? 'active' : ''} category`,
|
||||||
label: page,
|
),
|
||||||
on_primary_click: () => (CurrentPage.value = page),
|
label: page,
|
||||||
});
|
on_primary_click: () => (CurrentPage.value = page),
|
||||||
}),
|
});
|
||||||
}),
|
}),
|
||||||
Widget.Stack({
|
}),
|
||||||
vexpand: false,
|
Widget.Stack({
|
||||||
class_name: 'themes-menu-stack',
|
vexpand: false,
|
||||||
children: {
|
class_name: 'themes-menu-stack',
|
||||||
Configuration: SettingsMenu(),
|
children: {
|
||||||
Theming: ThemesMenu(),
|
Configuration: SettingsMenu(),
|
||||||
},
|
Theming: ThemesMenu(),
|
||||||
shown: CurrentPage.bind('value'),
|
},
|
||||||
}),
|
shown: CurrentPage.bind('value'),
|
||||||
];
|
}),
|
||||||
}),
|
],
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -43,40 +43,38 @@ const pagerMap: Page[] = [
|
|||||||
export const SettingsMenu = (): GBox => {
|
export const SettingsMenu = (): GBox => {
|
||||||
return Widget.Box({
|
return Widget.Box({
|
||||||
vertical: true,
|
vertical: true,
|
||||||
children: CurrentPage.bind('value').as((v) => {
|
children: [
|
||||||
return [
|
Widget.Box({
|
||||||
Widget.Box({
|
class_name: 'option-pages-container',
|
||||||
class_name: 'option-pages-container',
|
hpack: 'center',
|
||||||
hpack: 'center',
|
hexpand: true,
|
||||||
hexpand: true,
|
children: pagerMap.map((page) => {
|
||||||
children: pagerMap.map((page) => {
|
return Widget.Button({
|
||||||
return Widget.Button({
|
hpack: 'center',
|
||||||
hpack: 'center',
|
class_name: CurrentPage.bind('value').as((v) => `pager-button ${v === page ? 'active' : ''}`),
|
||||||
class_name: `pager-button ${v === page ? 'active' : ''}`,
|
label: page,
|
||||||
label: page,
|
on_primary_click: () => (CurrentPage.value = page),
|
||||||
on_primary_click: () => (CurrentPage.value = page),
|
});
|
||||||
});
|
|
||||||
}),
|
|
||||||
}),
|
}),
|
||||||
Widget.Stack({
|
}),
|
||||||
vexpand: true,
|
Widget.Stack({
|
||||||
class_name: 'themes-menu-stack',
|
vexpand: true,
|
||||||
children: {
|
class_name: 'themes-menu-stack',
|
||||||
General: BarGeneral(),
|
children: {
|
||||||
Bar: BarSettings(),
|
General: BarGeneral(),
|
||||||
'Media Menu': MediaMenuSettings(),
|
Bar: BarSettings(),
|
||||||
Notifications: NotificationSettings(),
|
'Media Menu': MediaMenuSettings(),
|
||||||
OSD: OSDSettings(),
|
Notifications: NotificationSettings(),
|
||||||
Volume: VolumeMenuSettings(),
|
OSD: OSDSettings(),
|
||||||
'Clock Menu': ClockMenuSettings(),
|
Volume: VolumeMenuSettings(),
|
||||||
'Dashboard Menu': DashboardMenuSettings(),
|
'Clock Menu': ClockMenuSettings(),
|
||||||
'Custom Modules': CustomModuleSettings(),
|
'Dashboard Menu': DashboardMenuSettings(),
|
||||||
'Bluetooth Menu': BluetoothMenuSettings(),
|
'Custom Modules': CustomModuleSettings(),
|
||||||
'Power Menu': PowerMenuSettings(),
|
'Bluetooth Menu': BluetoothMenuSettings(),
|
||||||
},
|
'Power Menu': PowerMenuSettings(),
|
||||||
shown: CurrentPage.bind('value'),
|
},
|
||||||
}),
|
shown: CurrentPage.bind('value'),
|
||||||
];
|
}),
|
||||||
}),
|
],
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -58,54 +58,54 @@ const pagerMap: Page[] = [
|
|||||||
export const ThemesMenu = (): GBox => {
|
export const ThemesMenu = (): GBox => {
|
||||||
return Widget.Box({
|
return Widget.Box({
|
||||||
vertical: true,
|
vertical: true,
|
||||||
children: CurrentPage.bind('value').as((v) => {
|
children: [
|
||||||
return [
|
Widget.Box({
|
||||||
Widget.Box({
|
class_name: 'option-pages-container',
|
||||||
class_name: 'option-pages-container',
|
hpack: 'center',
|
||||||
hpack: 'center',
|
hexpand: true,
|
||||||
hexpand: true,
|
vertical: true,
|
||||||
vertical: true,
|
children: [0, 1, 2].map((section) => {
|
||||||
children: [0, 1, 2].map((section) => {
|
return Widget.Box({
|
||||||
return Widget.Box({
|
children: pagerMap.map((page, index) => {
|
||||||
children: pagerMap.map((page, index) => {
|
if (index >= section * 6 && index < section * 6 + 6) {
|
||||||
if (index >= section * 6 && index < section * 6 + 6) {
|
return Widget.Button({
|
||||||
return Widget.Button({
|
hpack: 'center',
|
||||||
hpack: 'center',
|
xalign: 0,
|
||||||
xalign: 0,
|
class_name: CurrentPage.bind('value').as(
|
||||||
class_name: `pager-button ${v === page ? 'active' : ''}`,
|
(v) => `pager-button ${v === page ? 'active' : ''}`,
|
||||||
label: page,
|
),
|
||||||
on_primary_click: () => (CurrentPage.value = page),
|
label: page,
|
||||||
});
|
on_primary_click: () => (CurrentPage.value = page),
|
||||||
}
|
});
|
||||||
return Widget.Box();
|
}
|
||||||
}),
|
return Widget.Box();
|
||||||
});
|
}),
|
||||||
}),
|
});
|
||||||
}),
|
}),
|
||||||
Widget.Stack({
|
}),
|
||||||
vexpand: true,
|
Widget.Stack({
|
||||||
class_name: 'themes-menu-stack',
|
vexpand: true,
|
||||||
children: {
|
class_name: 'themes-menu-stack',
|
||||||
'General Settings': MenuTheme(),
|
children: {
|
||||||
'Matugen Settings': Matugen(),
|
'General Settings': MenuTheme(),
|
||||||
Bar: BarTheme(),
|
'Matugen Settings': Matugen(),
|
||||||
Notifications: NotificationsTheme(),
|
Bar: BarTheme(),
|
||||||
OSD: OsdTheme(),
|
Notifications: NotificationsTheme(),
|
||||||
'Battery Menu': BatteryMenuTheme(),
|
OSD: OsdTheme(),
|
||||||
'Bluetooth Menu': BluetoothMenuTheme(),
|
'Battery Menu': BatteryMenuTheme(),
|
||||||
'Clock Menu': ClockMenuTheme(),
|
'Bluetooth Menu': BluetoothMenuTheme(),
|
||||||
'Dashboard Menu': DashboardMenuTheme(),
|
'Clock Menu': ClockMenuTheme(),
|
||||||
'Media Menu': MediaMenuTheme(),
|
'Dashboard Menu': DashboardMenuTheme(),
|
||||||
'Network Menu': NetworkMenuTheme(),
|
'Media Menu': MediaMenuTheme(),
|
||||||
'Notifications Menu': NotificationsMenuTheme(),
|
'Network Menu': NetworkMenuTheme(),
|
||||||
'System Tray': SystrayMenuTheme(),
|
'Notifications Menu': NotificationsMenuTheme(),
|
||||||
'Volume Menu': VolumeMenuTheme(),
|
'System Tray': SystrayMenuTheme(),
|
||||||
'Power Menu': PowerMenuTheme(),
|
'Volume Menu': VolumeMenuTheme(),
|
||||||
'Custom Modules': CustomModuleTheme(),
|
'Power Menu': PowerMenuTheme(),
|
||||||
},
|
'Custom Modules': CustomModuleTheme(),
|
||||||
shown: CurrentPage.bind('value'),
|
},
|
||||||
}),
|
shown: CurrentPage.bind('value'),
|
||||||
];
|
}),
|
||||||
}),
|
],
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user