Added the ability to define custom icons for the system tray. (#408)

* Added the ability to define custom icons for the system tray.

* Add placeholder icon if icon is not defined.

* Update themes
This commit is contained in:
Jas Singh
2024-10-30 21:16:15 -07:00
committed by GitHub
parent aaad7c73b5
commit 77d4512c82
51 changed files with 534 additions and 399 deletions

1
globals.d.ts vendored
View File

@@ -5,6 +5,7 @@ import { Options, Variable as VariableType } from 'types/variable';
declare global {
var useTheme: (filePath: string) => void;
var getSystrayItems: () => string;
var isWindowVisible: (windowName: string) => boolean;
var globalWeatherVar: VariableType<Weather>;
var options: Options;

7
globals/systray.ts Normal file
View File

@@ -0,0 +1,7 @@
const systemtray = await Service.import('systemtray');
globalThis.getSystrayItems = (): string => {
return systemtray.items.map((systrayItem) => systrayItem.id).join('\n');
};
export { getSystrayItems };

View File

@@ -0,0 +1,6 @@
export type SystrayIconMap = {
[key: string]: {
icon: string;
color: string;
};
};

View File

@@ -1,6 +1,7 @@
import 'lib/session';
import 'scss/style';
import 'globals/useTheme';
import 'globals/systray';
import 'globals/dropdown.js';
import 'globals/utilities';

View File

@@ -4,17 +4,39 @@ import { Notify } from 'lib/utils';
const systemtray = await Service.import('systemtray');
import options from 'options';
const { ignore } = options.bar.systray;
const { ignore, customIcons } = options.bar.systray;
const SysTray = (): BarBoxChild => {
const isVis = Variable(false);
const items = Utils.merge([systemtray.bind('items'), ignore.bind('value')], (items, ignored) => {
const items = Utils.merge(
[systemtray.bind('items'), ignore.bind('value'), customIcons.bind('value')],
(items, ignored, custIcons) => {
const filteredTray = items.filter(({ id }) => !ignored.includes(id));
isVis.value = filteredTray.length > 0;
return filteredTray.map((item) => {
const matchedCustomIcon = Object.keys(custIcons).find((iconRegex) => item.id.match(iconRegex));
if (matchedCustomIcon !== undefined) {
const iconLabel = custIcons[matchedCustomIcon].icon || '󰠫';
const iconColor = custIcons[matchedCustomIcon].color;
return Widget.Button({
cursor: 'pointer',
child: Widget.Label({
class_name: 'systray-icon txt-icon',
label: iconLabel,
css: iconColor ? `color: ${iconColor}` : '',
}),
on_primary_click: (_: SelfButton, event: Gdk.Event) => item.activate(event),
on_secondary_click: (_, event) => item.openMenu(event),
onMiddleClick: () => Notify({ summary: 'App Name', body: item.id }),
tooltip_markup: item.bind('tooltip_markup'),
});
}
return Widget.Button({
cursor: 'pointer',
child: Widget.Icon({
@@ -27,7 +49,8 @@ const SysTray = (): BarBoxChild => {
tooltip_markup: item.bind('tooltip_markup'),
});
});
});
},
);
return {
component: Widget.Box({

View File

@@ -13,6 +13,7 @@ import {
WindowLayer,
} from 'lib/types/options';
import { MatugenScheme, MatugenTheme, MatugenVariations } from 'lib/types/options';
import { SystrayIconMap } from 'lib/types/systray';
import { UnitType } from 'lib/types/weather';
import { Transition } from 'lib/types/widget';
import { ApplicationIcons, WorkspaceIcons, WorkspaceIconsColored } from 'lib/types/workspace';
@@ -242,6 +243,7 @@ const options = mkOptions(OPTIONS, {
},
systray: {
enableBorder: opt(false),
customIcon: opt(colors.text),
border: opt(colors.lavender),
background: opt(colors.base2),
spacing: opt('0.5em'),
@@ -923,6 +925,7 @@ const options = mkOptions(OPTIONS, {
},
systray: {
ignore: opt<string[]>([]),
customIcons: opt<SystrayIconMap>({}),
},
clock: {
icon: opt('󰸗'),

View File

@@ -4,6 +4,10 @@
.systray-icon {
font-size: 1.3em;
&.txt-icon {
color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-systray-customIcon);
}
}
.style2.systray {

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#303446",
"theme.bar.menus.menu.network.switch.enabled": "#ca9ee6",
"theme.bar.menus.menu.network.switch.disabled": "#414559",
"theme.bar.menus.menu.network.switch.puck": "#51576d"
"theme.bar.menus.menu.network.switch.puck": "#51576d",
"theme.bar.buttons.systray.customIcon": "#c6d0f5"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#81c8be",
"theme.bar.menus.menu.network.switch.enabled": "#ca9ee6",
"theme.bar.menus.menu.network.switch.disabled": "#414559",
"theme.bar.menus.menu.network.switch.puck": "#51576d"
"theme.bar.menus.menu.network.switch.puck": "#51576d",
"theme.bar.buttons.systray.customIcon": "#c6d0f5"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#303446",
"theme.bar.menus.menu.network.switch.puck": "#51576d",
"theme.bar.menus.menu.network.switch.disabled": "#414559",
"theme.bar.menus.menu.network.switch.enabled": "#ca9ee6"
"theme.bar.menus.menu.network.switch.enabled": "#ca9ee6",
"theme.bar.buttons.systray.customIcon": "#c6d0f5"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#dcdfe8",
"theme.bar.menus.menu.network.switch.enabled": "#8839ef",
"theme.bar.menus.menu.network.switch.disabled": "#ccd0da",
"theme.bar.menus.menu.network.switch.puck": "#bcc0cc"
"theme.bar.menus.menu.network.switch.puck": "#bcc0cc",
"theme.bar.buttons.systray.customIcon": "#4c4f69"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#179299",
"theme.bar.menus.menu.network.switch.enabled": "#8839ef",
"theme.bar.menus.menu.network.switch.disabled": "#ccd0da",
"theme.bar.menus.menu.network.switch.puck": "#bcc0cc"
"theme.bar.menus.menu.network.switch.puck": "#bcc0cc",
"theme.bar.buttons.systray.customIcon": "#4c4f69"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#dcdfe8",
"theme.bar.menus.menu.network.switch.puck": "#bcc0cc",
"theme.bar.menus.menu.network.switch.disabled": "#ccd0da",
"theme.bar.menus.menu.network.switch.enabled": "#8839ef"
"theme.bar.menus.menu.network.switch.enabled": "#8839ef",
"theme.bar.buttons.systray.customIcon": "#4c4f69"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#24273a",
"theme.bar.menus.menu.network.switch.enabled": "#c6a0f6",
"theme.bar.menus.menu.network.switch.disabled": "#363a4f",
"theme.bar.menus.menu.network.switch.puck": "#494d64"
"theme.bar.menus.menu.network.switch.puck": "#494d64",
"theme.bar.buttons.systray.customIcon": "#cad3f5"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#8bd5ca",
"theme.bar.menus.menu.network.switch.enabled": "#c6a0f6",
"theme.bar.menus.menu.network.switch.disabled": "#363a4f",
"theme.bar.menus.menu.network.switch.puck": "#494d64"
"theme.bar.menus.menu.network.switch.puck": "#494d64",
"theme.bar.buttons.systray.customIcon": "#cad3f5"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#24273a",
"theme.bar.menus.menu.network.switch.puck": "#494d64",
"theme.bar.menus.menu.network.switch.disabled": "#363a4f",
"theme.bar.menus.menu.network.switch.enabled": "#c6a0f6"
"theme.bar.menus.menu.network.switch.enabled": "#c6a0f6",
"theme.bar.buttons.systray.customIcon": "#cad3f5"
}

View File

@@ -273,6 +273,7 @@
"theme.bar.buttons.battery.border": "#f9e2af",
"theme.bar.buttons.systray.background": "#242438",
"theme.bar.buttons.systray.border": "#b4befe",
"theme.bar.buttons.systray.customIcon": "#cdd6f4",
"theme.bar.buttons.bluetooth.icon_background": "#89dbeb",
"theme.bar.buttons.bluetooth.icon": "#89dceb",
"theme.bar.buttons.bluetooth.text": "#89dceb",

View File

@@ -327,6 +327,7 @@
"theme.bar.buttons.clock.border": "#f5c2e7",
"theme.bar.buttons.battery.border": "#f9e2af",
"theme.bar.buttons.systray.border": "#b4befe",
"theme.bar.buttons.systray.customIcon": "#cdd6f4",
"theme.bar.buttons.bluetooth.border": "#89dceb",
"theme.bar.buttons.network.border": "#cba6f7",
"theme.bar.buttons.volume.border": "#eba0ac",

View File

@@ -281,6 +281,7 @@
"theme.bar.buttons.battery.border": "#f9e2af",
"theme.bar.buttons.systray.background": "#242438",
"theme.bar.buttons.systray.border": "#b4befe",
"theme.bar.buttons.systray.customIcon": "#cdd6f4",
"theme.bar.buttons.bluetooth.icon_background": "#89dbeb",
"theme.bar.buttons.bluetooth.icon": "#242438",
"theme.bar.buttons.bluetooth.text": "#242438",
@@ -342,3 +343,4 @@
"theme.notification.actions.background": "#b4befd",
"theme.notification.background": "#181826"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#121212",
"theme.bar.menus.menu.network.switch.enabled": "#FF69B4",
"theme.bar.menus.menu.network.switch.disabled": "#2A2A2A",
"theme.bar.menus.menu.network.switch.puck": "#333333"
"theme.bar.menus.menu.network.switch.puck": "#333333",
"theme.bar.buttons.systray.customIcon": "#d1d1d1"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#FF69B4",
"theme.bar.menus.menu.network.switch.enabled": "#FF69B4",
"theme.bar.menus.menu.network.switch.disabled": "#2A2A2A",
"theme.bar.menus.menu.network.switch.puck": "#333333"
"theme.bar.menus.menu.network.switch.puck": "#333333",
"theme.bar.buttons.systray.customIcon": "#d1d1d1"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#121212",
"theme.bar.menus.menu.network.switch.puck": "#333333",
"theme.bar.menus.menu.network.switch.disabled": "#2A2A2A",
"theme.bar.menus.menu.network.switch.enabled": "#FF69B4"
"theme.bar.menus.menu.network.switch.enabled": "#FF69B4",
"theme.bar.buttons.systray.customIcon": "#d1d1d1"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#44475a",
"theme.bar.menus.menu.network.switch.enabled": "#bd93f9",
"theme.bar.menus.menu.network.switch.disabled": "#44475a",
"theme.bar.menus.menu.network.switch.puck": "#44475a"
"theme.bar.menus.menu.network.switch.puck": "#44475a",
"theme.bar.buttons.systray.customIcon": "#f8f8f2"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#8be9fd",
"theme.bar.menus.menu.network.switch.enabled": "#bd93f9",
"theme.bar.menus.menu.network.switch.disabled": "#44475a",
"theme.bar.menus.menu.network.switch.puck": "#44475a"
"theme.bar.menus.menu.network.switch.puck": "#44475a",
"theme.bar.buttons.systray.customIcon": "#f8f8f2"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#44475a",
"theme.bar.menus.menu.network.switch.puck": "#44475a",
"theme.bar.menus.menu.network.switch.disabled": "#44475a",
"theme.bar.menus.menu.network.switch.enabled": "#bd93f9"
"theme.bar.menus.menu.network.switch.enabled": "#bd93f9",
"theme.bar.buttons.systray.customIcon": "#f8f8f2"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#323d43",
"theme.bar.menus.menu.network.switch.enabled": "#e69875",
"theme.bar.menus.menu.network.switch.disabled": "#2f383e",
"theme.bar.menus.menu.network.switch.puck": "#454b53"
"theme.bar.menus.menu.network.switch.puck": "#454b53",
"theme.bar.buttons.systray.customIcon": "#d8caac"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#83c092",
"theme.bar.menus.menu.network.switch.enabled": "#e69875",
"theme.bar.menus.menu.network.switch.disabled": "#2f383e",
"theme.bar.menus.menu.network.switch.puck": "#454b53"
"theme.bar.menus.menu.network.switch.puck": "#454b53",
"theme.bar.buttons.systray.customIcon": "#d8caac"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#323d43",
"theme.bar.menus.menu.network.switch.puck": "#454b53",
"theme.bar.menus.menu.network.switch.disabled": "#2f383e",
"theme.bar.menus.menu.network.switch.enabled": "#e69875"
"theme.bar.menus.menu.network.switch.enabled": "#e69875",
"theme.bar.buttons.systray.customIcon": "#d8caac"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#282828",
"theme.bar.menus.menu.network.switch.enabled": "#b16286",
"theme.bar.menus.menu.network.switch.disabled": "#3c3836",
"theme.bar.menus.menu.network.switch.puck": "#504945"
"theme.bar.menus.menu.network.switch.puck": "#504945",
"theme.bar.buttons.systray.customIcon": "#ebdbb2"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#8ec07c",
"theme.bar.menus.menu.network.switch.enabled": "#b16286",
"theme.bar.menus.menu.network.switch.disabled": "#3c3836",
"theme.bar.menus.menu.network.switch.puck": "#504945"
"theme.bar.menus.menu.network.switch.puck": "#504945",
"theme.bar.buttons.systray.customIcon": "#ebdbb2"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#282828",
"theme.bar.menus.menu.network.switch.puck": "#504945",
"theme.bar.menus.menu.network.switch.disabled": "#3c3836",
"theme.bar.menus.menu.network.switch.enabled": "#b16286"
"theme.bar.menus.menu.network.switch.enabled": "#b16286",
"theme.bar.buttons.systray.customIcon": "#ebdbb2"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#090909",
"theme.bar.menus.menu.network.switch.enabled": "#FFFFFF",
"theme.bar.menus.menu.network.switch.disabled": "#444444",
"theme.bar.menus.menu.network.switch.puck": "#333333"
"theme.bar.menus.menu.network.switch.puck": "#333333",
"theme.bar.buttons.systray.customIcon": "#FFFFFF"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#FFFFFF",
"theme.bar.menus.menu.network.switch.enabled": "#FFFFFF",
"theme.bar.menus.menu.network.switch.disabled": "#444444",
"theme.bar.menus.menu.network.switch.puck": "#333333"
"theme.bar.menus.menu.network.switch.puck": "#333333",
"theme.bar.buttons.systray.customIcon": "#FFFFFF"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#090909",
"theme.bar.menus.menu.network.switch.puck": "#333333",
"theme.bar.menus.menu.network.switch.disabled": "#444444",
"theme.bar.menus.menu.network.switch.enabled": "#FFFFFF"
"theme.bar.menus.menu.network.switch.enabled": "#FFFFFF",
"theme.bar.buttons.systray.customIcon": "#FFFFFF"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#3b4252",
"theme.bar.menus.menu.network.switch.enabled": "#88c0d0",
"theme.bar.menus.menu.network.switch.disabled": "#434c53",
"theme.bar.menus.menu.network.switch.puck": "#434c53"
"theme.bar.menus.menu.network.switch.puck": "#434c53",
"theme.bar.buttons.systray.customIcon": "#d8dee9"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#8fbcbb",
"theme.bar.menus.menu.network.switch.enabled": "#88c0d0",
"theme.bar.menus.menu.network.switch.disabled": "#434c53",
"theme.bar.menus.menu.network.switch.puck": "#434c53"
"theme.bar.menus.menu.network.switch.puck": "#434c53",
"theme.bar.buttons.systray.customIcon": "#d8dee9"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#3b4252",
"theme.bar.menus.menu.network.switch.puck": "#434c53",
"theme.bar.menus.menu.network.switch.disabled": "#434c53",
"theme.bar.menus.menu.network.switch.enabled": "#88c0d0"
"theme.bar.menus.menu.network.switch.enabled": "#88c0d0",
"theme.bar.buttons.systray.customIcon": "#d8dee9"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#21252b",
"theme.bar.menus.menu.network.switch.enabled": "#c678dd",
"theme.bar.menus.menu.network.switch.disabled": "#3e4451",
"theme.bar.menus.menu.network.switch.puck": "#4b5263"
"theme.bar.menus.menu.network.switch.puck": "#4b5263",
"theme.bar.buttons.systray.customIcon": "#abb2bf"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#56b6c2",
"theme.bar.menus.menu.network.switch.enabled": "#c678dd",
"theme.bar.menus.menu.network.switch.disabled": "#3e4451",
"theme.bar.menus.menu.network.switch.puck": "#4b5263"
"theme.bar.menus.menu.network.switch.puck": "#4b5263",
"theme.bar.buttons.systray.customIcon": "#abb2bf"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#21252b",
"theme.bar.menus.menu.network.switch.puck": "#4b5263",
"theme.bar.menus.menu.network.switch.disabled": "#3e4451",
"theme.bar.menus.menu.network.switch.enabled": "#c678dd"
"theme.bar.menus.menu.network.switch.enabled": "#c678dd",
"theme.bar.buttons.systray.customIcon": "#abb2bf"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#21202e",
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7",
"theme.bar.menus.menu.network.switch.disabled": "#1f1d2e",
"theme.bar.menus.menu.network.switch.puck": "#26233a"
"theme.bar.menus.menu.network.switch.puck": "#26233a",
"theme.bar.buttons.systray.customIcon": "#e0def4"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#2a283e",
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7",
"theme.bar.menus.menu.network.switch.disabled": "#2a273f",
"theme.bar.menus.menu.network.switch.puck": "#393552"
"theme.bar.menus.menu.network.switch.puck": "#393552",
"theme.bar.buttons.systray.customIcon": "#e0def4"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#9ccfd8",
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7",
"theme.bar.menus.menu.network.switch.disabled": "#2a273f",
"theme.bar.menus.menu.network.switch.puck": "#393552"
"theme.bar.menus.menu.network.switch.puck": "#393552",
"theme.bar.buttons.systray.customIcon": "#e0def4"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#2a283e",
"theme.bar.menus.menu.network.switch.puck": "#393552",
"theme.bar.menus.menu.network.switch.disabled": "#2a273f",
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7"
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7",
"theme.bar.buttons.systray.customIcon": "#e0def4"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#9ccfd8",
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7",
"theme.bar.menus.menu.network.switch.disabled": "#1f1d2e",
"theme.bar.menus.menu.network.switch.puck": "#26233a"
"theme.bar.menus.menu.network.switch.puck": "#26233a",
"theme.bar.buttons.systray.customIcon": "#e0def4"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#21202e",
"theme.bar.menus.menu.network.switch.puck": "#26233a",
"theme.bar.menus.menu.network.switch.disabled": "#1f1d2e",
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7"
"theme.bar.menus.menu.network.switch.enabled": "#c4a7e7",
"theme.bar.buttons.systray.customIcon": "#e0def4"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#272a3d",
"theme.bar.menus.menu.network.switch.enabled": "#bb9af7",
"theme.bar.menus.menu.network.switch.disabled": "#565f89",
"theme.bar.menus.menu.network.switch.puck": "#565f89"
"theme.bar.menus.menu.network.switch.puck": "#565f89",
"theme.bar.buttons.systray.customIcon": "#c0caf5"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#73daca",
"theme.bar.menus.menu.network.switch.enabled": "#bb9af7",
"theme.bar.menus.menu.network.switch.disabled": "#565f89",
"theme.bar.menus.menu.network.switch.puck": "#565f89"
"theme.bar.menus.menu.network.switch.puck": "#565f89",
"theme.bar.buttons.systray.customIcon": "#c0caf5"
}

View File

@@ -340,5 +340,6 @@
"theme.bar.buttons.modules.submap.icon_background": "#272a3d",
"theme.bar.menus.menu.network.switch.puck": "#565f89",
"theme.bar.menus.menu.network.switch.disabled": "#565f89",
"theme.bar.menus.menu.network.switch.enabled": "#bb9af7"
"theme.bar.menus.menu.network.switch.enabled": "#bb9af7",
"theme.bar.buttons.systray.customIcon": "#c0caf5"
}

View File

@@ -651,6 +651,15 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
subtitleLink: 'https://hyprpanel.com/configuration/panel.html#system-tray',
type: 'object',
}),
Option({
opt: options.bar.systray.customIcons,
title: 'Custom Systray Icons',
subtitle:
'An object defining custom icons for the system tray.\n' +
'Wiki: https://hyprpanel.com/configuration/panel.html#custom-systray-icons',
subtitleLink: 'https://hyprpanel.com/configuration/panel.html#custom-systray-icons',
type: 'object',
}),
/*
******************************

View File

@@ -13,6 +13,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
child: Widget.Box({
vertical: true,
children: [
/* ================================================== */
/* GENERAL */
/* ================================================== */
Header('General'),
Option({ opt: options.theme.bar.transparent, title: 'Transparent', type: 'boolean' }),
Option({ opt: options.theme.bar.background, title: 'Background Color', type: 'color' }),
@@ -72,11 +75,17 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
type: 'color',
}),
/* ================================================== */
/* DASHBOARD BUTTON */
/* ================================================== */
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' }),
/* ================================================== */
/* WORKSPACES */
/* ================================================== */
Header('Workspaces'),
Option({ opt: options.theme.bar.buttons.workspaces.background, title: 'Background', type: 'color' }),
Option({
@@ -111,6 +120,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.workspaces.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* WINDOW TITLE */
/* ================================================== */
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' }),
@@ -124,6 +136,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.windowtitle.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* MEDIA */
/* ================================================== */
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' }),
@@ -137,6 +152,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.media.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* VOLUME */
/* ================================================== */
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' }),
@@ -150,6 +168,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.volume.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* NETWORK */
/* ================================================== */
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' }),
@@ -163,6 +184,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.network.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* BLUETOOTH */
/* ================================================== */
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' }),
@@ -176,9 +200,17 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.bluetooth.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* SYSTEM TRAY */
/* ================================================== */
Header('System Tray'),
Option({ opt: options.theme.bar.buttons.systray.border, title: 'Border', type: 'color' }),
Option({ opt: options.theme.bar.buttons.systray.customIcon, title: 'Custom Icons', type: 'color' }),
Option({ opt: options.theme.bar.buttons.systray.background, title: 'Background', type: 'color' }),
/* ================================================== */
/* BATTERY */
/* ================================================== */
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' }),
@@ -192,6 +224,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.battery.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* CLOCK */
/* ================================================== */
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' }),
@@ -205,6 +240,9 @@ export const BarTheme = (): Scrollable<Child, Attribute> => {
}),
Option({ opt: options.theme.bar.buttons.clock.border, title: 'Border', type: 'color' }),
/* ================================================== */
/* NOTIFICATIONS */
/* ================================================== */
Header('Notifications'),
Option({ opt: options.theme.bar.buttons.notifications.background, title: 'Background', type: 'color' }),
Option({