Updated the demo/mockup for the Artist Management / Timetable module
This commit is contained in:
@@ -188,8 +188,6 @@ function App() {
|
||||
|
||||
return (
|
||||
<div className="cw-app">
|
||||
<Sidebar />
|
||||
|
||||
<main className="cw-main">
|
||||
<Header
|
||||
dayCounts={stageCountByDay}
|
||||
@@ -365,49 +363,6 @@ function App() {
|
||||
);
|
||||
}
|
||||
|
||||
// ─── Sidebar (matching Crewli look) ─────────────────────────────────
|
||||
function Sidebar() {
|
||||
const items = [
|
||||
{ icon: "home", label: "Dashboard" },
|
||||
{ icon: "cal", label: "Evenementen", active: true },
|
||||
];
|
||||
const orgItems = [
|
||||
{ icon: "build", label: "Mijn Organisatie" },
|
||||
{ icon: "users", label: "Leden" },
|
||||
{ icon: "biz", label: "Bedrijven" },
|
||||
{ icon: "alert", label: "Form failures" },
|
||||
{ icon: "cog", label: "Instellingen" },
|
||||
];
|
||||
return (
|
||||
<aside className="cw-side">
|
||||
<div className="cw-side-brand">
|
||||
<span className="cw-side-logo">c</span>
|
||||
<span className="cw-side-brand-name">Crewli</span>
|
||||
<span className="cw-side-brand-dot"></span>
|
||||
</div>
|
||||
<div className="cw-side-org">
|
||||
<span className="cw-side-org-icon">▥</span>
|
||||
<span className="cw-side-org-name">Stichting Feestfab…</span>
|
||||
</div>
|
||||
<nav className="cw-side-nav">
|
||||
{items.map(it => (
|
||||
<a key={it.label} className={"cw-side-item" + (it.active ? " is-active" : "")}>
|
||||
<Icon name={it.icon} /> {it.label}
|
||||
</a>
|
||||
))}
|
||||
</nav>
|
||||
<div className="cw-side-section">Stichting Feestfabriek</div>
|
||||
<nav className="cw-side-nav">
|
||||
{orgItems.map(it => (
|
||||
<a key={it.label} className="cw-side-item">
|
||||
<Icon name={it.icon} /> {it.label}
|
||||
</a>
|
||||
))}
|
||||
</nav>
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
|
||||
// minimal inline icons
|
||||
function Icon({ name }) {
|
||||
const common = { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.4, strokeLinecap: "round", strokeLinejoin: "round" };
|
||||
@@ -437,30 +392,6 @@ function Header({ dayCounts, conflicts, activeDayId, onChangeDay, onOpenMatrix,
|
||||
const D = window.CrewliData;
|
||||
return (
|
||||
<div className="cw-hdr">
|
||||
<div className="cw-hdr-top">
|
||||
<button className="cw-hdr-back"><Icon name="arrow" /></button>
|
||||
<div>
|
||||
<div className="cw-hdr-title">
|
||||
{D.EVENT.name}
|
||||
<span className="cw-hdr-pill">Festival</span>
|
||||
</div>
|
||||
<div className="cw-hdr-sub">10-07-2026 – 11-07-2026 · Timetable</div>
|
||||
</div>
|
||||
<div style={{ flex: 1 }}></div>
|
||||
<button className="cw-btn"><Icon name="share" /> Delen</button>
|
||||
<button className="cw-btn"><Icon name="chev" /> Registratie open</button>
|
||||
</div>
|
||||
|
||||
<div className="cw-hdr-tabs">
|
||||
<button className="cw-tab">Overzicht</button>
|
||||
<button className="cw-tab">Programmaonderdelen</button>
|
||||
<button className="cw-tab">Tijdsloten</button>
|
||||
<button className="cw-tab">Secties & Shifts</button>
|
||||
<button className="cw-tab">Personen</button>
|
||||
<button className="cw-tab">Artiesten</button>
|
||||
<button className="cw-tab is-active">Timetable</button>
|
||||
</div>
|
||||
|
||||
<div className="cw-hdr-bar">
|
||||
<div className="cw-day-tabs" role="tablist">
|
||||
{D.EVENT.days.map(d => (
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
@@ -51,7 +51,7 @@ input, select, textarea { font-family: inherit; }
|
||||
/* ─── App shell ─────────────────────────────────────────────────── */
|
||||
.cw-app {
|
||||
display: grid;
|
||||
grid-template-columns: 232px 1fr;
|
||||
grid-template-columns: 1fr;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -176,7 +176,6 @@ input, select, textarea { font-family: inherit; }
|
||||
.cw-hdr-bar {
|
||||
display: flex; align-items: center; gap: 12px;
|
||||
padding: 12px 0;
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
|
||||
/* ─── Day tabs ──────────────────────────────────────────────────── */
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 499 KiB |
Reference in New Issue
Block a user