mirror of
https://github.com/Termix-SSH/Termix.git
synced 2026-07-15 21:03:47 +00:00
ZacharyZcR
ecb7f4f2c5
Adds a "3-Way (H)" layout option (2 top + 1 bottom) alongside the existing "3-Way (V)" (1 left + 2 right). Fixes file manager content overflowing its split pane by adding min-h-0 to nested flex containers that were missing it.
127 lines
3.2 KiB
TypeScript
127 lines
3.2 KiB
TypeScript
import type {
|
|
AccentColorId,
|
|
DashboardCardConfig,
|
|
FontSizeId,
|
|
SplitMode,
|
|
} from "./types";
|
|
|
|
export const DASHBOARD_CARDS: DashboardCardConfig[] = [
|
|
{
|
|
id: "stats_bar",
|
|
label: "Status Bar",
|
|
description: "Version, uptime, database health, hosts online",
|
|
defaultEnabled: true,
|
|
},
|
|
{
|
|
id: "counters_bar",
|
|
label: "Counters Bar",
|
|
description: "Total hosts, credentials, and tunnels count",
|
|
defaultEnabled: true,
|
|
},
|
|
{
|
|
id: "quick_actions",
|
|
label: "Quick Actions",
|
|
description: "Shortcuts to add hosts, credentials, settings",
|
|
defaultEnabled: true,
|
|
},
|
|
{
|
|
id: "host_status",
|
|
label: "Host Status",
|
|
description: "Live status list with CPU/RAM per host",
|
|
defaultEnabled: true,
|
|
},
|
|
{
|
|
id: "recent_activity",
|
|
label: "Recent Activity",
|
|
description: "Feed of recent connection events",
|
|
defaultEnabled: true,
|
|
},
|
|
{
|
|
id: "network_graph",
|
|
label: "Network Graph",
|
|
description: "Visual map of host network topology",
|
|
defaultEnabled: false,
|
|
},
|
|
];
|
|
|
|
export const ACCENT_PRESET_COLORS = [
|
|
{ label: "Orange", value: "#f59145" },
|
|
{ label: "Blue", value: "#3b82f6" },
|
|
{ label: "Green", value: "#22c55e" },
|
|
{ label: "Purple", value: "#a855f7" },
|
|
{ label: "Pink", value: "#ec4899" },
|
|
{ label: "Cyan", value: "#06b6d4" },
|
|
{ label: "Red", value: "#ef4444" },
|
|
{ label: "Yellow", value: "#eab308" },
|
|
{ label: "Teal", value: "#14b8a6" },
|
|
{ label: "Indigo", value: "#6366f1" },
|
|
{ label: "Rose", value: "#f43f5e" },
|
|
{ label: "Lime", value: "#84cc16" },
|
|
];
|
|
|
|
export const ACCENT_COLORS = ACCENT_PRESET_COLORS.map((c) => ({
|
|
id: c.label.toLowerCase() as AccentColorId,
|
|
label: c.label,
|
|
value: c.value,
|
|
}));
|
|
|
|
export function applyAccentColor(colorValue: string) {
|
|
document.documentElement.style.setProperty("--accent-brand", colorValue);
|
|
}
|
|
|
|
export const FONT_SIZES: { id: FontSizeId; label: string }[] = [
|
|
{ id: "xs", label: "XS" },
|
|
{ id: "sm", label: "Small" },
|
|
{ id: "md", label: "Normal" },
|
|
{ id: "lg", label: "Large" },
|
|
{ id: "xl", label: "XL" },
|
|
];
|
|
|
|
export function applyFontSize(id: FontSizeId) {
|
|
const root = document.documentElement;
|
|
root.classList.remove("fs-xs", "fs-sm", "fs-md", "fs-lg", "fs-xl");
|
|
root.classList.add(`fs-${id}`);
|
|
localStorage.setItem("termix-font-size", id);
|
|
}
|
|
|
|
export const FOLDER_COLORS = [
|
|
"#ef4444",
|
|
"#f97316",
|
|
"#eab308",
|
|
"#22c55e",
|
|
"#3b82f6",
|
|
"#a855f7",
|
|
"#ec4899",
|
|
"#6b7280",
|
|
];
|
|
|
|
export const SPLIT_MODES: { id: SplitMode; label: string }[] = [
|
|
{ id: "none", label: "None" },
|
|
{ id: "2-way", label: "2-Way" },
|
|
{ id: "3-way", label: "3-Way (V)" },
|
|
{ id: "3-way-horizontal", label: "3-Way (H)" },
|
|
{ id: "4-way", label: "4-Way" },
|
|
{ id: "5-way", label: "5-Way" },
|
|
{ id: "6-way", label: "6-Way" },
|
|
];
|
|
|
|
export const PANE_COUNTS: Record<SplitMode, number> = {
|
|
none: 0,
|
|
"2-way": 2,
|
|
"3-way": 3,
|
|
"3-way-horizontal": 3,
|
|
"4-way": 4,
|
|
"5-way": 5,
|
|
"6-way": 6,
|
|
};
|
|
|
|
export const PANE_LAYOUTS: Record<SplitMode, string> = {
|
|
none: "",
|
|
"2-way": "grid-cols-2 grid-rows-1",
|
|
"3-way": "grid-cols-2 grid-rows-2",
|
|
"3-way-horizontal": "grid-cols-2 grid-rows-2",
|
|
"4-way": "grid-cols-2 grid-rows-2",
|
|
"5-way": "grid-cols-3 grid-rows-2",
|
|
"6-way": "grid-cols-3 grid-rows-2",
|
|
};
|