AWL Dark Theme + Tauri 2 Config-Fix
- app.css: Komplett neues Farbschema basierend auf AWL Dark / KDE Breeze Dark - tauri.conf.json: Shell-Plugin scope entfernt (Tauri 2 inkompatibel) - capabilities/default.json: Tauri 2 Berechtigungen für Shell-Plugin - StopButton + Layout: Hardcoded Farben durch CSS-Variablen ersetzt Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
ff423e9d80
commit
532c91c605
5 changed files with 91 additions and 63 deletions
14
src-tauri/capabilities/default.json
Normal file
14
src-tauri/capabilities/default.json
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
{
|
||||
"$schema": "https://schema.tauri.app/config/2/capability",
|
||||
"identifier": "default",
|
||||
"description": "Claude Desktop Standardberechtigungen",
|
||||
"windows": ["main"],
|
||||
"permissions": [
|
||||
"core:default",
|
||||
"shell:allow-open",
|
||||
"shell:allow-execute",
|
||||
"shell:allow-spawn",
|
||||
"shell:allow-stdin-write",
|
||||
"shell:allow-kill"
|
||||
]
|
||||
}
|
||||
|
|
@ -34,19 +34,7 @@
|
|||
},
|
||||
"plugins": {
|
||||
"shell": {
|
||||
"open": true,
|
||||
"scope": [
|
||||
{
|
||||
"name": "node",
|
||||
"cmd": "node",
|
||||
"args": true
|
||||
},
|
||||
{
|
||||
"name": "npm",
|
||||
"cmd": "npm",
|
||||
"args": true
|
||||
}
|
||||
]
|
||||
"open": true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
106
src/app.css
106
src/app.css
|
|
@ -1,17 +1,29 @@
|
|||
/* Claude Desktop — Basis-Styles */
|
||||
/* Claude Desktop — Basis-Styles (AWL Dark Theme) */
|
||||
|
||||
:root {
|
||||
/* Farbschema */
|
||||
--bg-primary: #1a1a2e;
|
||||
--bg-secondary: #16213e;
|
||||
--bg-tertiary: #0f3460;
|
||||
--text-primary: #eaeaea;
|
||||
--text-secondary: #a0a0a0;
|
||||
--accent: #e94560;
|
||||
--accent-hover: #ff6b6b;
|
||||
--success: #4ade80;
|
||||
--warning: #fbbf24;
|
||||
--error: #ef4444;
|
||||
/* AWL Dark Farbschema — basierend auf KDE Breeze Dark */
|
||||
--bg-primary: #202326; /* Body/Window BG */
|
||||
--bg-secondary: #272c31; /* Top-Menü / Header BG */
|
||||
--bg-tertiary: #292c30; /* Button/Tabellen-Header BG */
|
||||
--bg-input: #141618; /* Input-Felder / ungerade Zeilen */
|
||||
--bg-hover: #2a2e33; /* Hover-State */
|
||||
--bg-selected: #1e5774; /* Ausgewählte Elemente */
|
||||
|
||||
--text-primary: #cccccc; /* Haupttext (VSCode Dark+ Niveau) */
|
||||
--text-secondary: #a1a9b1; /* Sekundärtext (ForegroundInactive) */
|
||||
--text-heading: #d4d4d4; /* Titel/Überschriften */
|
||||
|
||||
--accent: #3daee9; /* DecorationFocus (Breeze Blau) */
|
||||
--accent-hover: #4dbdf9; /* Heller beim Hover */
|
||||
--link: #1d99f3; /* ForegroundLink */
|
||||
|
||||
--success: #27ae60; /* Grün (KDE Breeze) */
|
||||
--warning: #f67400; /* Orange (KDE Breeze) */
|
||||
--error: #da4453; /* Rot (KDE Breeze) */
|
||||
|
||||
/* Rahmen */
|
||||
--border: #3b3f44; /* Dezente Trennlinien */
|
||||
--border-active: #3daee9; /* Aktive Elemente */
|
||||
|
||||
/* Abstände */
|
||||
--spacing-xs: 0.25rem;
|
||||
|
|
@ -21,29 +33,18 @@
|
|||
--spacing-xl: 2rem;
|
||||
|
||||
/* Border-Radius */
|
||||
--radius-sm: 4px;
|
||||
--radius-md: 8px;
|
||||
--radius-lg: 12px;
|
||||
--radius-sm: 3px;
|
||||
--radius-md: 6px;
|
||||
--radius-lg: 10px;
|
||||
|
||||
/* Schatten */
|
||||
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
|
||||
--shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
|
||||
--shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.5);
|
||||
--shadow-md: 0 4px 8px rgba(0, 0, 0, 0.4);
|
||||
--shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.5);
|
||||
|
||||
/* Font */
|
||||
--font-mono: 'JetBrains Mono', 'Fira Code', monospace;
|
||||
--font-sans: 'Inter', system-ui, sans-serif;
|
||||
}
|
||||
|
||||
/* Light Mode */
|
||||
@media (prefers-color-scheme: light) {
|
||||
:root {
|
||||
--bg-primary: #f8f9fa;
|
||||
--bg-secondary: #e9ecef;
|
||||
--bg-tertiary: #dee2e6;
|
||||
--text-primary: #212529;
|
||||
--text-secondary: #6c757d;
|
||||
}
|
||||
--font-mono: 'Hack', 'JetBrains Mono', 'Fira Code', monospace;
|
||||
--font-sans: 'Noto Sans', 'Inter', system-ui, sans-serif;
|
||||
}
|
||||
|
||||
* {
|
||||
|
|
@ -58,20 +59,21 @@ html, body {
|
|||
background: var(--bg-primary);
|
||||
color: var(--text-primary);
|
||||
overflow: hidden;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* Scrollbar-Styling */
|
||||
/* Scrollbar — KDE-Style, dezent */
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: var(--bg-secondary);
|
||||
background: var(--bg-primary);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--bg-tertiary);
|
||||
background: var(--border);
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
|
|
@ -89,34 +91,52 @@ button {
|
|||
}
|
||||
|
||||
/* Input-Reset */
|
||||
input, textarea {
|
||||
input, textarea, select {
|
||||
font-family: inherit;
|
||||
border: none;
|
||||
background: var(--bg-secondary);
|
||||
border: 1px solid var(--border);
|
||||
background: var(--bg-input);
|
||||
color: var(--text-primary);
|
||||
padding: var(--spacing-sm) var(--spacing-md);
|
||||
border-radius: var(--radius-md);
|
||||
transition: border-color 0.2s ease;
|
||||
}
|
||||
|
||||
input:focus, textarea:focus {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 2px;
|
||||
input:focus, textarea:focus, select:focus {
|
||||
outline: none;
|
||||
border-color: var(--accent);
|
||||
}
|
||||
|
||||
/* Code-Blöcke */
|
||||
code, pre {
|
||||
font-family: var(--font-mono);
|
||||
background: var(--bg-secondary);
|
||||
background: var(--bg-input);
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 0.1em 0.3em;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: var(--spacing-md);
|
||||
overflow-x: auto;
|
||||
border: 1px solid var(--border);
|
||||
}
|
||||
|
||||
/* Überschriften */
|
||||
h1, h2, h3, h4 {
|
||||
color: var(--text-heading);
|
||||
}
|
||||
|
||||
/* Links */
|
||||
a {
|
||||
color: var(--link);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Animationen */
|
||||
|
|
@ -137,3 +157,9 @@ pre {
|
|||
.animate-spin {
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
/* Selection */
|
||||
::selection {
|
||||
background: var(--bg-selected);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,28 +32,28 @@
|
|||
justify-content: center;
|
||||
gap: var(--spacing-md);
|
||||
padding: var(--spacing-md) var(--spacing-lg);
|
||||
background: linear-gradient(135deg, #dc2626, #b91c1c);
|
||||
background: linear-gradient(135deg, var(--error), #c0392b);
|
||||
color: white;
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
border-radius: var(--radius-md);
|
||||
border: 2px solid #ef4444;
|
||||
border: 2px solid var(--error);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
box-shadow: 0 4px 15px rgba(220, 38, 38, 0.4);
|
||||
box-shadow: 0 4px 15px rgba(218, 68, 83, 0.3);
|
||||
}
|
||||
|
||||
.stop-button:not(.disabled):hover {
|
||||
background: linear-gradient(135deg, #ef4444, #dc2626);
|
||||
background: linear-gradient(135deg, #e74c3c, var(--error));
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 6px 20px rgba(220, 38, 38, 0.5);
|
||||
box-shadow: 0 6px 20px rgba(218, 68, 83, 0.4);
|
||||
}
|
||||
|
||||
.stop-button:not(.disabled):active {
|
||||
transform: translateY(0);
|
||||
box-shadow: 0 2px 10px rgba(220, 38, 38, 0.4);
|
||||
box-shadow: 0 2px 10px rgba(218, 68, 83, 0.3);
|
||||
}
|
||||
|
||||
.stop-button.disabled {
|
||||
|
|
@ -80,7 +80,7 @@
|
|||
}
|
||||
|
||||
@keyframes border-pulse {
|
||||
0%, 100% { border-color: #ef4444; }
|
||||
50% { border-color: #fca5a5; }
|
||||
0%, 100% { border-color: var(--error); }
|
||||
50% { border-color: #e88; }
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -161,8 +161,8 @@
|
|||
}
|
||||
|
||||
@keyframes glow {
|
||||
0%, 100% { box-shadow: 0 -2px 10px rgba(233, 69, 96, 0.3); }
|
||||
50% { box-shadow: 0 -2px 20px rgba(233, 69, 96, 0.6); }
|
||||
0%, 100% { box-shadow: 0 -2px 10px rgba(218, 68, 83, 0.2); }
|
||||
50% { box-shadow: 0 -2px 20px rgba(218, 68, 83, 0.4); }
|
||||
}
|
||||
|
||||
.footer-stats {
|
||||
|
|
|
|||
Loading…
Reference in a new issue