Upgrade to Agsv2 + Astal (#533)
* migrate to astal * Reorganize project structure. * progress * Migrate Dashboard and Window Title modules. * Migrate clock and notification bar modules. * Remove unused code * Media menu * Rework network and volume modules * Finish custom modules. * Migrate battery bar module. * Update battery module and organize helpers. * Migrate workspace module. * Wrap up bar modules. * Checkpoint before I inevitbly blow something up. * Updates * Fix event propagation logic. * Type fixes * More type fixes * Fix padding for event boxes. * Migrate volume menu and refactor scroll event handlers. * network module WIP * Migrate network service. * Migrate bluetooth menu * Updates * Migrate notifications * Update scrolling behavior for custom modules. * Improve popup notifications and add timer functionality. * Migration notifications menu header/controls. * Migrate notifications menu and consolidate notifications menu code. * Migrate power menu. * Dashboard progress * Migrate dashboard * Migrate media menu. * Reduce media menu nesting. * Finish updating media menu bindings to navigate active player. * Migrate battery menu * Consolidate code * Migrate calendar menu * Fix workspace logic to update on client add/change/remove and consolidate code. * Migrate osd * Consolidate hyprland service connections. * Implement startup dropdown menu position allocation. * Migrate settings menu (WIP) * Settings dialo menu fixes * Finish Dashboard menu * Type updates * update submoldule for types * update github ci * ci * Submodule update * Ci updates * Remove type checking for now. * ci fix * Fix a bunch of stuff, losing track... need rest. Brb coffee * Validate dropdown menu before render. * Consolidate code and add auto-hide functionality. * Improve auto-hide behavior. * Consolidate audio menu code * Organize bluetooth code * Improve active player logic * Properly dismiss a notification on action button resolution. * Implement CLI command engine and migrate CLI commands. * Handle variable disposal * Bar component fixes and add hyprland startup rules. * Handle potentially null bindings network and bluetooth bindings. * Handle potentially null wired adapter. * Fix GPU stats * Handle poller for GPU * Fix gpu bar logic. * Clean up logic for stat bars. * Handle wifi and wired bar icon bindings. * Fix battery percentages * Fix switch behavior * Wifi staging fixes * Reduce redundant hyprland service calls. * Code cleanup * Document the option code and reduce redundant calls to optimize performance. * Remove outdated comment. * Add JSDocs * Add meson to build hyprpanel * Consistency updates * Organize commands * Fix images not showing up on notifications. * Remove todo * Move hyprpanel configuration to the ~/.config/hyprpanel directory and add utility commands. * Handle SRC directory for the bundled/built hyprpanel. * Add namespaces to all windows * Migrate systray * systray updates * Update meson to include ts, tsx and scss files. * Remove log from meson * Fix file choose path and make it float. * Added a command to check the dependency status * Update dep names. * Get scale directly from env * Add todo
This commit is contained in:
Jas Singh
GitHub
151
src/components/settings/pages/theme/bar/index.tsx
Normal file
151
src/components/settings/pages/theme/bar/index.tsx
Normal file
@@ -0,0 +1,151 @@
|
||||
import { Option } from 'src/components/settings/shared/Option';
|
||||
import { Header } from 'src/components/settings/shared/Header';
|
||||
|
||||
import options from 'src/options';
|
||||
import { Gtk } from 'astal/gtk3';
|
||||
|
||||
export const BarTheme = (): JSX.Element => {
|
||||
return (
|
||||
<scrollable
|
||||
name={'Bar'}
|
||||
className="bar-theme-page paged-container"
|
||||
vscroll={Gtk.PolicyType.ALWAYS}
|
||||
hscroll={Gtk.PolicyType.AUTOMATIC}
|
||||
vexpand={false}
|
||||
>
|
||||
<box vertical>
|
||||
{/* General Section */}
|
||||
<Header title="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.border.color} title="Bar Border Color" type="color" />
|
||||
<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.borderColor} title="Button Border" 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"
|
||||
/>
|
||||
|
||||
{/* Dashboard Button Section */}
|
||||
<Header title="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" />
|
||||
|
||||
{/* Workspaces Section */}
|
||||
<Header title="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" />
|
||||
|
||||
{/* Window Title Section */}
|
||||
<Header title="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" />
|
||||
|
||||
{/* Media Section */}
|
||||
<Header title="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" />
|
||||
|
||||
{/* Volume Section */}
|
||||
<Header title="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" />
|
||||
</box>
|
||||
</scrollable>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user