mirror of
https://github.com/R0m1k3/Loki.git
synced 2026-10-11 17:26:57 +02:00
MichaelandClaude Opus 4.8
3ad37ae2c7
- Scaffold full-stack : backend FastAPI + frontend React/Vite/TS/Tailwind - Design system fidèle au thème (palette ambre/café, JetBrains Mono, tokens Tailwind) - Layout 3 panneaux : activity bar, historique/fichiers, chat, aperçu - Connexion Ollama : statut live, liste des modèles, pull avec progression SSE, sélecteur de modèle - Vue Configuration (Frame 2) : modèles, génération, outils, invite système - Dockerfile multi-stage + docker-compose (Ollama externe par défaut, profil ollama optionnel) Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01SVay7z3y7q2gEe54ByAE6N
105 lines
2.8 KiB
TypeScript
105 lines
2.8 KiB
TypeScript
/** Icônes SVG (style line, stroke) reprises du visuel. */
|
|
type Props = { size?: number; className?: string };
|
|
|
|
const base = (size: number, className?: string) => ({
|
|
width: size,
|
|
height: size,
|
|
viewBox: "0 0 24 24",
|
|
fill: "none",
|
|
stroke: "currentColor",
|
|
strokeWidth: 1.7,
|
|
strokeLinecap: "round" as const,
|
|
strokeLinejoin: "round" as const,
|
|
className,
|
|
});
|
|
|
|
export const ChatIcon = ({ size = 19, className }: Props) => (
|
|
<svg {...base(size, className)}>
|
|
<path d="M4 6h16v10H10l-4 3v-3H4z" />
|
|
</svg>
|
|
);
|
|
|
|
export const ClockIcon = ({ size = 19, className }: Props) => (
|
|
<svg {...base(size, className)}>
|
|
<circle cx="12" cy="12" r="8.5" />
|
|
<path d="M12 7.5V12l3 1.8" />
|
|
</svg>
|
|
);
|
|
|
|
export const FilesIcon = ({ size = 19, className }: Props) => (
|
|
<svg {...base(size, className)}>
|
|
<path d="M4 7h6l2 2h8v9H4z" />
|
|
</svg>
|
|
);
|
|
|
|
export const NodesIcon = ({ size = 19, className }: Props) => (
|
|
<svg {...base(size, className)}>
|
|
<circle cx="7" cy="7" r="2.4" />
|
|
<circle cx="17" cy="7" r="2.4" />
|
|
<circle cx="7" cy="17" r="2.4" />
|
|
<circle cx="17" cy="17" r="2.4" />
|
|
</svg>
|
|
);
|
|
|
|
export const SettingsIcon = ({ size = 18, className }: Props) => (
|
|
<svg {...base(size, className)}>
|
|
<line x1="4" y1="8" x2="20" y2="8" />
|
|
<line x1="4" y1="13" x2="20" y2="13" />
|
|
<line x1="4" y1="18" x2="20" y2="18" />
|
|
</svg>
|
|
);
|
|
|
|
export const ChevronDown = ({ size = 13, className }: Props) => (
|
|
<svg {...base(size, className)} strokeWidth={2}>
|
|
<path d="m6 9 6 6 6-6" />
|
|
</svg>
|
|
);
|
|
|
|
export const PlusIcon = ({ size = 13, className }: Props) => (
|
|
<svg {...base(size, className)} strokeWidth={2.2}>
|
|
<path d="M12 5v14M5 12h14" />
|
|
</svg>
|
|
);
|
|
|
|
export const RefreshIcon = ({ size = 15, className }: Props) => (
|
|
<svg {...base(size, className)}>
|
|
<path d="M21 12a9 9 0 1 1-3-6.7M21 4v4h-4" />
|
|
</svg>
|
|
);
|
|
|
|
export const SendIcon = ({ size = 15, className }: Props) => (
|
|
<svg {...base(size, className)} strokeWidth={2.2}>
|
|
<path d="M5 12h14M13 6l6 6-6 6" />
|
|
</svg>
|
|
);
|
|
|
|
export const ClipIcon = ({ size = 16, className }: Props) => (
|
|
<svg {...base(size, className)} strokeWidth={1.8}>
|
|
<path d="M21 11.5 12 20a5 5 0 0 1-7-7l8.5-8.5a3.5 3.5 0 0 1 5 5L10 16" />
|
|
</svg>
|
|
);
|
|
|
|
export const DownloadIcon = ({ size = 14, className }: Props) => (
|
|
<svg {...base(size, className)} strokeWidth={1.9}>
|
|
<path d="M12 4v11m0 0 4-4m-4 4-4-4M5 20h14" />
|
|
</svg>
|
|
);
|
|
|
|
/** Logo Loki : carré dégradé + losange interne. */
|
|
export const LokiMark = ({ size = 26 }: { size?: number }) => (
|
|
<div
|
|
className="flex items-center justify-center rounded-lg bg-accent-grad"
|
|
style={{ width: size, height: size }}
|
|
>
|
|
<div
|
|
className="bg-base"
|
|
style={{
|
|
width: size * 0.3,
|
|
height: size * 0.3,
|
|
borderRadius: 2,
|
|
transform: "rotate(45deg)",
|
|
}}
|
|
/>
|
|
</div>
|
|
);
|