diff --git a/wwwroot/poc-layout.html b/wwwroot/poc-layout.html
new file mode 100644
index 0000000..fa3d523
--- /dev/null
+++ b/wwwroot/poc-layout.html
@@ -0,0 +1,790 @@
+
+
+
+
+
+ Salon OS
+
+
+
+
+
+
+
+
+
+ Salon OS
+
+
+
+
+
+ Dashboard
+
+
+ Dashboard
+
+
+
+ Kalender
+
+
+
+ Kasse
+
+
+
+
+
+ Data
+
+
+ Produkter & Lager
+
+
+
+ Leverandører
+
+
+
+ Kunder
+
+
+
+ Medarbejdere
+
+
+
+
+
+ Analyse
+
+
+ Statistik & Rapporter
+
+
+
+
+
+ System
+
+
+ Indstillinger
+
+
+
+ Abonnement & Konto
+
+
+
+
+
+
+ MJ
+
+ Maria Jensen
+ Administrator
+
+
+
+
+ Log ud
+
+
+
+
+
+
+
+
+
+ ⌘K
+
+
+
+
+
+
+
+
+
+
+
+
+ 3
+
+
+
+
+
+
+ MJ
+
+ Maria Jensen
+ Administrator
+
+
+
+
+
+
+ Min profil
+
+
+
+ Indstillinger
+
+
+
+
+ Log ud
+
+
+
+
+
+
+
+
+
+
+ Dashboard
+
+ Vælg et menupunkt i venstre side for at navigere til den ønskede sektion.
+
+ Prøv f.eks. Produkter & Lager eller Leverandører.
+
+
+
+
+
+
+
+
diff --git a/wwwroot/poc-leverandoer.html b/wwwroot/poc-leverandoer.html
new file mode 100644
index 0000000..e451111
--- /dev/null
+++ b/wwwroot/poc-leverandoer.html
@@ -0,0 +1,1376 @@
+
+
+
+
+
+ Leverandør - Beauty Group Denmark
+
+
+
+
+
+
+
+
+
+ Leverandører
+
+ Beauty Group Denmark
+
+
+
+
+
+
+
+
+ Slet
+
+
+
+ Gem ændringer
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Nøgletal
+ 2024
+
+
+
+
+ 24
+ Produkter
+
+
+ 145.230 kr
+ Indkøb i år
+
+
+ 12
+ Ordrer i år
+
+
+
+
+
+
+
+
+ Indkøbshistorik
+ Sidste 6 måneder
+
+
+
+
+
+
+
+
+
+ Produkter fra leverandør
+ 24 produkter
+
+
+
+
+ Redken Acidic Bonding Concentrate Serum 100ml
+ 195 kr
+
+
+ Redken All Soft Shampoo 300ml
+ 145 kr
+
+
+ Redken Extreme Shampoo 300ml
+ 145 kr
+
+
+ Redken Color Extend Magnetics Shampoo 300ml
+ 155 kr
+
+
+ Redken One United 150ml
+ 175 kr
+
+
+
+
+
+
+
+
+ Noter
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 12
+ Leverandører i alt
+
+
+ 10
+ Aktive
+
+
+ 45.230 kr
+ Indkøb denne måned
+
+
+ 3
+ Afventende ordrer
+
+
+
+
+
+
+ Leverandør
+ Kontakt
+ Produkter
+ Sidste ordre
+ Status
+
+
+
+
+
+
+ Beauty Group Denmark
+ København
+
+
+ Lars Hansen
+ 24
+ 15. december 2024
+ Aktiv
+
+
+
+
+
+
+ Salon Supplies ApS
+ Aarhus
+
+
+ Mette Nielsen
+ 18
+ 22. december 2024
+ Aktiv
+
+
+
+
+
+
+ Pro Hair Distribution
+ Odense
+
+
+ Anders Sørensen
+ 32
+ 10. december 2024
+ Aktiv
+
+
+
+
+
+
+ Nordic Beauty Import
+ Aalborg
+
+
+ Pia Kristensen
+ 15
+ 28. november 2024
+ Aktiv
+
+
+
+
+
+
+ Color World A/S
+ Vejle
+
+
+ Thomas Berg
+ 8
+ 5. december 2024
+ Inaktiv
+
+
+
+
+
+
+ Tools & More
+ Roskilde
+
+
+ Karen Olsen
+ 12
+ 18. december 2024
+ Aktiv
+
+
+
+
+
+ Viser 6 af 12 leverandører
+ Side 1 af 2
+
+
+
+
+
+
+
+
diff --git a/wwwroot/poc-produkter.html b/wwwroot/poc-produkter.html
index 6469d2d..13d4d48 100644
--- a/wwwroot/poc-produkter.html
+++ b/wwwroot/poc-produkter.html
@@ -59,6 +59,42 @@
--font-mono: 'JetBrains Mono', monospace;
}
+ /* Dark mode - følger system preference ELLER manuel toggle */
+ @media (prefers-color-scheme: dark) {
+ :root:not(.light-mode) {
+ --color-surface: #1e1e1e;
+ --color-background: #121212;
+ --color-background-hover: #2a2a2a;
+ --color-background-alt: #1a1a1a;
+ --color-border: #333;
+ --color-text: #e0e0e0;
+ --color-text-secondary: #999;
+ --color-teal: #26a69a;
+ --color-blue: #42a5f5;
+ --color-red: #ef5350;
+ --color-amber: #ffb74d;
+ --color-purple: #a78bfa;
+ --color-green: #66bb6a;
+ }
+ }
+
+ /* Manuel dark mode override */
+ :root.dark-mode {
+ --color-surface: #1e1e1e;
+ --color-background: #121212;
+ --color-background-hover: #2a2a2a;
+ --color-background-alt: #1a1a1a;
+ --color-border: #333;
+ --color-text: #e0e0e0;
+ --color-text-secondary: #999;
+ --color-teal: #26a69a;
+ --color-blue: #42a5f5;
+ --color-red: #ef5350;
+ --color-amber: #ffb74d;
+ --color-purple: #a78bfa;
+ --color-green: #66bb6a;
+ }
+
/* ==========================================
RESET & BASE
========================================== */
@@ -169,6 +205,15 @@
background: var(--color-background-hover);
}
+ swp-btn.icon-only {
+ padding: 10px;
+ }
+
+ swp-btn.icon-only svg {
+ width: 18px;
+ height: 18px;
+ }
+
/* ==========================================
FILTER BAR
========================================== */
@@ -227,12 +272,24 @@
opacity: 0.5;
}
+ @media (prefers-color-scheme: dark) {
+ :root:not(.light-mode) swp-search-input img {
+ filter: invert(1);
+ }
+ }
+
+ :root.dark-mode swp-search-input img {
+ filter: invert(1);
+ }
+
swp-search-input input {
border: none;
outline: none;
font-size: 13px;
font-family: var(--font-family);
width: 400px;
+ background: transparent;
+ color: var(--color-text);
}
swp-filter-spacer {
@@ -488,6 +545,10 @@
Produkter
+
+
+
+
Importer
@@ -721,6 +782,37 @@
});
}
});
+
+ // Theme toggle
+ const themeToggle = document.getElementById('themeToggle');
+ const sunIcon = document.getElementById('sunIcon');
+ const moonIcon = document.getElementById('moonIcon');
+ const root = document.documentElement;
+
+ function updateIcons() {
+ const isDark = root.classList.contains('dark-mode') ||
+ (window.matchMedia('(prefers-color-scheme: dark)').matches && !root.classList.contains('light-mode'));
+ sunIcon.style.display = isDark ? 'none' : 'block';
+ moonIcon.style.display = isDark ? 'block' : 'none';
+ }
+
+ updateIcons();
+
+ themeToggle.addEventListener('click', () => {
+ const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+
+ if (prefersDark) {
+ // System is dark - toggle to light or back to system
+ root.classList.toggle('light-mode');
+ root.classList.remove('dark-mode');
+ } else {
+ // System is light - toggle to dark or back to system
+ root.classList.toggle('dark-mode');
+ root.classList.remove('light-mode');
+ }
+
+ updateIcons();
+ });