refactor: Update quick actions description and enhance AppCustomizationPage layout

- Revised the quick actions description in multiple languages to clarify their purpose as "Quickpills in chat."
- Adjusted the layout of AppCustomizationPage by reintroducing the quick pills section for improved user interaction.
- Modified spacing between UI elements for better visual consistency and usability.
- Streamlined the component structure to enhance maintainability and readability.
This commit is contained in:
cogwheel0
2025-10-19 16:06:20 +05:30
parent 89f897e8ad
commit 42efbe8fc5
16 changed files with 392 additions and 81 deletions

View File

@@ -473,6 +473,302 @@ class TweakcnThemes {
],
);
// Catppuccin (from @catppuccin.css)
static final TweakcnThemeVariant _catppuccinLight = TweakcnThemeVariant(
background: const Color(0xFFEFF1F5),
foreground: const Color(0xFF4C4F69),
card: const Color(0xFFFFFFFF),
cardForeground: const Color(0xFF4C4F69),
popover: const Color(0xFFCCD0DA),
popoverForeground: const Color(0xFF4C4F69),
primary: const Color(0xFF8839EF),
primaryForeground: const Color(0xFFFFFFFF),
secondary: const Color(0xFFCCD0DA),
secondaryForeground: const Color(0xFF4C4F69),
muted: const Color(0xFFDCE0E8),
mutedForeground: const Color(0xFF6C6F85),
accent: const Color(0xFF04A5E5),
accentForeground: const Color(0xFFFFFFFF),
destructive: const Color(0xFFD20F39),
destructiveForeground: const Color(0xFFFFFFFF),
border: const Color(0xFFBCC0CC),
input: const Color(0xFFCCD0DA),
ring: const Color(0xFF8839EF),
sidebarBackground: const Color(0xFFE6E9EF),
sidebarForeground: const Color(0xFF4C4F69),
sidebarPrimary: const Color(0xFF8839EF),
sidebarPrimaryForeground: const Color(0xFFFFFFFF),
sidebarAccent: const Color(0xFFDCE0E8),
sidebarAccentForeground: const Color(0xFF4C4F69),
sidebarBorder: const Color(0xFFBCC0CC),
sidebarRing: const Color(0xFF8839EF),
success: const Color(0xFF40A02B), // chart-3
successForeground: const Color(0xFF4C4F69),
warning: const Color(0xFFFE640B), // chart-4
warningForeground: const Color(0xFF4C4F69),
info: const Color(0xFF04A5E5), // chart-2
infoForeground: const Color(0xFFFFFFFF),
radius: 6,
fontSans: const <String>[
'Montserrat',
'ui-sans-serif',
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'Segoe UI',
'Roboto',
'Helvetica Neue',
'Arial',
'Noto Sans',
'sans-serif',
'Apple Color Emoji',
'Segoe UI Emoji',
'Segoe UI Symbol',
'Noto Color Emoji',
],
fontSerif: const <String>[
'Georgia',
'ui-serif',
'Cambria',
'Times New Roman',
'Times',
'serif',
],
fontMono: const <String>[
'Fira Code',
'ui-monospace',
'SFMono-Regular',
'Menlo',
'Monaco',
'Consolas',
'Liberation Mono',
'Courier New',
'monospace',
],
);
static final TweakcnThemeVariant _catppuccinDark = TweakcnThemeVariant(
background: const Color(0xFF181825),
foreground: const Color(0xFFCDD6F4),
card: const Color(0xFF1E1E2E),
cardForeground: const Color(0xFFCDD6F4),
popover: const Color(0xFF45475A),
popoverForeground: const Color(0xFFCDD6F4),
primary: const Color(0xFFCBA6F7),
primaryForeground: const Color(0xFF1E1E2E),
secondary: const Color(0xFF585B70),
secondaryForeground: const Color(0xFFCDD6F4),
muted: const Color(0xFF292C3C),
mutedForeground: const Color(0xFFA6ADC8),
accent: const Color(0xFF89DCEB),
accentForeground: const Color(0xFF1E1E2E),
destructive: const Color(0xFFF38BA8),
destructiveForeground: const Color(0xFF1E1E2E),
border: const Color(0xFF313244),
input: const Color(0xFF313244),
ring: const Color(0xFFCBA6F7),
sidebarBackground: const Color(0xFF11111B),
sidebarForeground: const Color(0xFFCDD6F4),
sidebarPrimary: const Color(0xFFCBA6F7),
sidebarPrimaryForeground: const Color(0xFF1E1E2E),
sidebarAccent: const Color(0xFF292C3C),
sidebarAccentForeground: const Color(0xFFCDD6F4),
sidebarBorder: const Color(0xFF45475A),
sidebarRing: const Color(0xFFCBA6F7),
success: const Color(0xFFA6E3A1), // chart-3
successForeground: const Color(0xFF181825),
warning: const Color(0xFFFAB387), // chart-4
warningForeground: const Color(0xFF181825),
info: const Color(0xFF89DCEB), // chart-2
infoForeground: const Color(0xFF181825),
radius: 6,
fontSans: const <String>[
'Montserrat',
'ui-sans-serif',
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'Segoe UI',
'Roboto',
'Helvetica Neue',
'Arial',
'Noto Sans',
'sans-serif',
'Apple Color Emoji',
'Segoe UI Emoji',
'Segoe UI Symbol',
'Noto Color Emoji',
],
fontSerif: const <String>[
'Georgia',
'ui-serif',
'Cambria',
'Times New Roman',
'Times',
'serif',
],
fontMono: const <String>[
'Fira Code',
'ui-monospace',
'SFMono-Regular',
'Menlo',
'Monaco',
'Consolas',
'Liberation Mono',
'Courier New',
'monospace',
],
);
// Tangerine (from @tangerine.css)
static final TweakcnThemeVariant _tangerineLight = TweakcnThemeVariant(
background: const Color(0xFFE8EBED),
foreground: const Color(0xFF333333),
card: const Color(0xFFFFFFFF),
cardForeground: const Color(0xFF333333),
popover: const Color(0xFFFFFFFF),
popoverForeground: const Color(0xFF333333),
primary: const Color(0xFFE05D38),
primaryForeground: const Color(0xFFFFFFFF),
secondary: const Color(0xFFF3F4F6),
secondaryForeground: const Color(0xFF4B5563),
muted: const Color(0xFFF9FAFB),
mutedForeground: const Color(0xFF6B7280),
accent: const Color(0xFFD6E4F0),
accentForeground: const Color(0xFF1E3A8A),
destructive: const Color(0xFFEF4444),
destructiveForeground: const Color(0xFFFFFFFF),
border: const Color(0xFFDCDFE2),
input: const Color(0xFFF4F5F7),
ring: const Color(0xFFE05D38),
sidebarBackground: const Color(0xFFDDDFE2),
sidebarForeground: const Color(0xFF333333),
sidebarPrimary: const Color(0xFFE05D38),
sidebarPrimaryForeground: const Color(0xFFFFFFFF),
sidebarAccent: const Color(0xFFD6E4F0),
sidebarAccentForeground: const Color(0xFF1E3A8A),
sidebarBorder: const Color(0xFFE5E7EB),
sidebarRing: const Color(0xFFE05D38),
success: const Color(0xFF86A7C8),
successForeground: const Color(0xFF333333),
warning: const Color(0xFFEEA591),
warningForeground: const Color(0xFF333333),
info: const Color(0xFF334C82),
infoForeground: const Color(0xFFFFFFFF),
radius: 12,
fontSans: const <String>[
'Inter',
'ui-sans-serif',
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'Segoe UI',
'Roboto',
'Helvetica Neue',
'Arial',
'Noto Sans',
'sans-serif',
'Apple Color Emoji',
'Segoe UI Emoji',
'Segoe UI Symbol',
'Noto Color Emoji',
],
fontSerif: const <String>[
'Source Serif 4',
'ui-serif',
'Georgia',
'Cambria',
'Times New Roman',
'Times',
'serif',
],
fontMono: const <String>[
'JetBrains Mono',
'ui-monospace',
'SFMono-Regular',
'Menlo',
'Monaco',
'Consolas',
'Liberation Mono',
'Courier New',
'monospace',
],
);
static final TweakcnThemeVariant _tangerineDark = TweakcnThemeVariant(
background: const Color(0xFF1C2433),
foreground: const Color(0xFFE5E5E5),
card: const Color(0xFF2A3040),
cardForeground: const Color(0xFFE5E5E5),
popover: const Color(0xFF262B38),
popoverForeground: const Color(0xFFE5E5E5),
primary: const Color(0xFFE05D38),
primaryForeground: const Color(0xFFFFFFFF),
secondary: const Color(0xFF2A303E),
secondaryForeground: const Color(0xFFE5E5E5),
muted: const Color(0xFF2A303E),
mutedForeground: const Color(0xFFA3A3A3),
accent: const Color(0xFF2A3656),
accentForeground: const Color(0xFFBFDBFE),
destructive: const Color(0xFFEF4444),
destructiveForeground: const Color(0xFFFFFFFF),
border: const Color(0xFF3D4354),
input: const Color(0xFF3D4354),
ring: const Color(0xFFE05D38),
sidebarBackground: const Color(0xFF2A303F),
sidebarForeground: const Color(0xFFE5E5E5),
sidebarPrimary: const Color(0xFFE05D38),
sidebarPrimaryForeground: const Color(0xFFFFFFFF),
sidebarAccent: const Color(0xFF2A3656),
sidebarAccentForeground: const Color(0xFFBFDBFE),
sidebarBorder: const Color(0xFF3D4354),
sidebarRing: const Color(0xFFE05D38),
success: const Color(0xFF86A7C8),
successForeground: const Color(0xFF1C2433),
warning: const Color(0xFFE6A08F),
warningForeground: const Color(0xFF1C2433),
info: const Color(0xFF466494),
infoForeground: const Color(0xFF1C2433),
radius: 12,
fontSans: const <String>[
'Inter',
'ui-sans-serif',
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'Segoe UI',
'Roboto',
'Helvetica Neue',
'Arial',
'Noto Sans',
'sans-serif',
'Apple Color Emoji',
'Segoe UI Emoji',
'Segoe UI Symbol',
'Noto Color Emoji',
],
fontSerif: const <String>[
'Source Serif 4',
'ui-serif',
'Georgia',
'Cambria',
'Times New Roman',
'Times',
'serif',
],
fontMono: const <String>[
'JetBrains Mono',
'ui-monospace',
'SFMono-Regular',
'Menlo',
'Monaco',
'Consolas',
'Liberation Mono',
'Courier New',
'monospace',
],
);
static final TweakcnThemeDefinition claude = TweakcnThemeDefinition(
id: 'claude',
label: 'Claude',
@@ -512,7 +808,39 @@ class TweakcnThemes {
],
);
static List<TweakcnThemeDefinition> all = [conduit, claude, t3Chat];
static final TweakcnThemeDefinition catppuccin = TweakcnThemeDefinition(
id: 'catppuccin',
label: 'Catppuccin',
description: 'Soft pastel palette.',
light: _catppuccinLight,
dark: _catppuccinDark,
preview: const <Color>[
Color(0xFF8839EF), // primary
Color(0xFF04A5E5), // accent
Color(0xFFEFF1F5), // background
],
);
static final TweakcnThemeDefinition tangerine = TweakcnThemeDefinition(
id: 'tangerine',
label: 'Tangerine',
description: 'Warm orange-and-slate palette.',
light: _tangerineLight,
dark: _tangerineDark,
preview: const <Color>[
Color(0xFFE05D38), // primary
Color(0xFFD6E4F0), // accent
Color(0xFFE8EBED), // background
],
);
static List<TweakcnThemeDefinition> all = [
conduit,
claude,
t3Chat,
catppuccin,
tangerine,
];
static TweakcnThemeDefinition byId(String? id) {
return all.firstWhere((theme) => theme.id == id, orElse: () => conduit);