Jens/VacatureRadar
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

demo mode
deploy / deploy (push) Canceled after 0s
Details

Browse Source
This commit is contained in:
Jens
2026-07-27 23:38:37 +02:00
parent d28fd05bf6
commit 7caea3a1ee
44 changed files with 1682 additions and 460 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/css/app.css
+7 -7
View File
@@ -1,9 +1,9 @@
/* Houd ook geïmporteerde stylesheets versieerbaar; alleen app.css voorzien van
een querystring ververst anders niet noodzakelijk de browsercache. */
@import url("tokens.css?v=0.3.11");
@import url("base.css?v=0.3.11");
@import url("layout.css?v=0.3.11");
@import url("components.css?v=0.3.11");
@import url("pages.css?v=0.3.11");
@import url("responsive.css?v=0.3.11");
@import url("premium.css?v=0.3.11");
@import url("tokens.css?v=0.3.12");
@import url("base.css?v=0.3.12");
@import url("layout.css?v=0.3.12");
@import url("components.css?v=0.3.12");
@import url("pages.css?v=0.3.12");
@import url("responsive.css?v=0.3.12");
@import url("premium.css?v=0.3.12");
static/css/components.css
+22
View File
@@ -65,3 +65,25 @@
.auth-card { width: min(460px, 100%); padding: 30px; border: 1px solid color-mix(in srgb, var(--cyan) 25%, var(--outline)); background: color-mix(in srgb, var(--surface-container) 94%, transparent); box-shadow: 0 30px 90px rgba(0,0,0,.3), var(--shadow-signal); }
.auth-brand { display: flex; align-items: flex-start; gap: 15px; margin-bottom: 26px; }
.auth-brand .brand-radar, .auth-brand .brand-mark { display: grid; width: 48px; height: 48px; flex: 0 0 auto; place-items: center; border: 1px solid var(--cyan); color: var(--cyan); }
/* Public demo state ------------------------------------------------------- */
.demo-mode-banner {
display: flex;
align-items: center;
gap: 12px;
margin: 12px clamp(16px, 2vw, 32px) 0;
padding: 11px 14px;
border: 1px solid color-mix(in srgb, var(--cyan) 42%, var(--outline));
border-radius: var(--radius-md);
background: color-mix(in srgb, var(--cyan) 9%, var(--surface-low));
color: var(--text);
}
.demo-mode-banner .icon { flex: 0 0 auto; color: var(--cyan); }
.demo-mode-banner span { display: grid; gap: 2px; }
.demo-mode-banner strong { font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; }
.demo-mode-banner small { color: var(--text-muted); }
[data-demo-read-only="true"] [data-demo-disabled="true"] {
cursor: not-allowed;
filter: saturate(.45);
opacity: .62;
}
static/js/app.js
+12
View File
@@ -55,6 +55,18 @@
});
});
if (document.body.dataset.demoReadOnly === "true") {
document.querySelectorAll('form[method="post" i]:not([data-demo-allow])').forEach((form) => {
form.querySelectorAll('button:not([type]), button[type="submit"], input[type="submit"]').forEach((control) => {
control.disabled = true;
control.dataset.demoDisabled = "true";
control.setAttribute("aria-describedby", "demo-read-only-note");
control.title = "Niet beschikbaar in de alleen-lezen demo";
});
});
}
const motionAllowed = !window.matchMedia("(prefers-reduced-motion: reduce)").matches;
if (motionAllowed) {
document.querySelectorAll("[data-radar-illustration]").forEach((illustration) => {