142 lines
5.9 KiB
HTML
142 lines
5.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="cs">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Firemní asistent | Colsys AI</title>
|
|
<!-- Caddy mounts this app at /apps/asistent/ on the portal. <base> makes
|
|
every relative URL (static assets, fetch calls) resolve correctly even
|
|
when the page is served from that sub-path. -->
|
|
<base href="/apps/asistent/">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&display=swap">
|
|
<link rel="stylesheet" href="static/styles.css">
|
|
<link rel="stylesheet" href="static/extra.css">
|
|
<script>
|
|
// Theme bootstrap — read source-of-truth in this order:
|
|
// ?theme= URL → portal_theme cookie → app_theme localStorage → OS
|
|
// The cookie is set by the portal landing on every resolvedTheme change,
|
|
// so it always reflects the portal's current state.
|
|
(function () {
|
|
var t = null;
|
|
try {
|
|
var p = new URL(window.location.href).searchParams.get("theme");
|
|
if (p === "dark" || p === "light") t = p;
|
|
} catch (e) {}
|
|
if (!t) {
|
|
var m = document.cookie.match(/(?:^|;\s*)portal_theme=([^;]+)/);
|
|
if (m) t = decodeURIComponent(m[1]);
|
|
}
|
|
if (!t) { try { t = localStorage.getItem("app_theme"); } catch (e) {} }
|
|
if (!t && typeof matchMedia !== "undefined") {
|
|
try {
|
|
t = matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
|
} catch (e) {}
|
|
}
|
|
if (t === "dark" || t === "light") {
|
|
document.documentElement.classList.add(t);
|
|
try { localStorage.setItem("app_theme", t); } catch (e) {}
|
|
}
|
|
})();
|
|
// bfcache rehydration — re-sync the class when the page is restored
|
|
// (e.g. user toggled theme on the portal, then hit Back).
|
|
// Same as pageshow, but fires when the user switches tabs.
|
|
// Covers: portal tab toggles theme → user comes back to app tab.
|
|
document.addEventListener("visibilitychange", function () {
|
|
if (document.visibilityState !== "visible") return;
|
|
var m = document.cookie.match(/(?:^|;\s*)portal_theme=([^;]+)/);
|
|
if (!m) return;
|
|
var t = decodeURIComponent(m[1]);
|
|
if (t !== "dark" && t !== "light") return;
|
|
var cls = document.documentElement.classList;
|
|
if (cls.contains(t)) return;
|
|
cls.remove(t === "dark" ? "light" : "dark");
|
|
cls.add(t);
|
|
try { localStorage.setItem("app_theme", t); } catch (e) {}
|
|
});
|
|
window.addEventListener("pageshow", function () {
|
|
var m = document.cookie.match(/(?:^|;\s*)portal_theme=([^;]+)/);
|
|
if (!m) return;
|
|
var t = decodeURIComponent(m[1]);
|
|
if (t !== "dark" && t !== "light") return;
|
|
var cls = document.documentElement.classList;
|
|
if (cls.contains(t)) return;
|
|
cls.remove(t === "dark" ? "light" : "dark");
|
|
cls.add(t);
|
|
try { localStorage.setItem("app_theme", t); } catch (e) {}
|
|
});
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<header class="header">
|
|
<div class="header-inner">
|
|
<a href="/" class="brand">
|
|
<span class="brand-icon">C</span>
|
|
<span class="brand-name">Colsys <span class="brand-ai">AI</span></span>
|
|
</a>
|
|
<span class="header-crumb">Firemní asistent</span>
|
|
<div class="header-right">
|
|
<button id="chat-clear" class="back-link" type="button" title="Začít novou konverzaci">
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
<path d="M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/>
|
|
<path d="M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z"/>
|
|
</svg>
|
|
<span>Nová konverzace</span>
|
|
</button>
|
|
<a href="/" class="back-link" title="Zpět na portál">
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
<path d="m15 18-6-6 6-6"/>
|
|
</svg>
|
|
<span>Zpět na portál</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="chat-main">
|
|
<div class="chat-frame">
|
|
|
|
<div id="chat-log" class="chat-log" aria-live="polite">
|
|
<section id="welcome" class="welcome">
|
|
<h2>Vítejte!</h2>
|
|
<p>Jsem firemní asistent. Odpovídám na otázky podle interních dokumentů z intranetu.</p>
|
|
<p class="welcome-sub">Zkuste se zeptat například:</p>
|
|
<ul class="starter-list">
|
|
<li><button class="starter">Jak si zažádám o dovolenou?</button></li>
|
|
<li><button class="starter">Jaké jsou benefity ke vzdělávání?</button></li>
|
|
<li><button class="starter">Jak vyúčtuji služební cestu?</button></li>
|
|
<li><button class="starter">Co dělat při pracovním úrazu?</button></li>
|
|
</ul>
|
|
</section>
|
|
</div>
|
|
|
|
<form id="chat-form" class="chat-form" autocomplete="off">
|
|
<textarea
|
|
id="chat-input"
|
|
class="chat-input"
|
|
rows="1"
|
|
placeholder="Zeptejte se asistenta…"
|
|
aria-label="Zpráva pro asistenta"
|
|
required></textarea>
|
|
<button type="submit" class="chat-send" id="chat-send" aria-label="Odeslat">
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2.2" stroke-linecap="round"
|
|
stroke-linejoin="round" aria-hidden="true">
|
|
<path d="m22 2-7 20-4-9-9-4Z"/>
|
|
<path d="M22 2 11 13"/>
|
|
</svg>
|
|
</button>
|
|
</form>
|
|
<p class="chat-hint">Enter odeslat · Shift+Enter nový řádek</p>
|
|
|
|
</div>
|
|
</main>
|
|
|
|
<script src="static/app.js"></script>
|
|
</body>
|
|
</html>
|