Inicjalna wersja systemu zarządzania rezerwacjami (RMS)

SPA zbudowane w React 19 + Vite 8 z pełnym zestawem funkcjonalności: autentykacja z 2FA, kreator rezerwacji, panel admina, analityka, GraphQL (Apollo Client + SchemaLink), React Query, Storybook, testy jednostkowe (Vitest + RTL) i e2e (Playwright).
2026-06-21 06:08:47 +02:00
commit f436d87ca5
99 changed files with 18696 additions and 0 deletions
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -0,0 +1,118 @@
+@use 'variables' as *;
+
+// ─── CSS Custom Properties (runtime theming) ──────────────────────────────────
+
+:root {
+  --clr-bg:              #{$gray-50};
+  --clr-surface:         #ffffff;
+  --clr-surface-raised:  #{$gray-100};
+  --clr-border:          #{$gray-200};
+  --clr-text:            #{$gray-900};
+  --clr-text-secondary:  #{$gray-600};
+  --clr-text-muted:      #{$gray-400};
+  --clr-primary:         #{$primary-600};
+  --clr-primary-hover:   #{$primary-700};
+  --clr-accent:          #{$accent-500};
+}
+
+[data-theme="dark"] {
+  --clr-bg:              #{$gray-900};
+  --clr-surface:         #{$gray-800};
+  --clr-surface-raised:  #{$gray-700};
+  --clr-border:          #{$gray-700};
+  --clr-text:            #{$gray-100};
+  --clr-text-secondary:  #{$gray-400};
+  --clr-text-muted:      #{$gray-600};
+  --clr-primary:         #{$primary-400};
+  --clr-primary-hover:   #{$primary-300};
+  --clr-accent:          #{$accent-400};
+}
+
+// ─── Reset ────────────────────────────────────────────────────────────────────
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  font-size: 16px;
+  -webkit-text-size-adjust: 100%;
+}
+
+body {
+  font-family: $font-family-base;
+  font-size: $font-size-base;
+  font-weight: $font-weight-normal;
+  line-height: $line-height-normal;
+  color: var(--clr-text);
+  background-color: var(--clr-bg);
+  transition: background-color $transition-base, color $transition-base;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+  color: var(--clr-primary);
+  text-decoration: none;
+
+  &:hover {
+    color: var(--clr-primary-hover);
+    text-decoration: underline;
+  }
+}
+
+img,
+svg {
+  display: block;
+  max-width: 100%;
+}
+
+button {
+  cursor: pointer;
+  font-family: inherit;
+}
+
+input,
+textarea,
+select {
+  font-family: inherit;
+  font-size: inherit;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-weight: $font-weight-semibold;
+  line-height: $line-height-tight;
+  color: var(--clr-text);
+}
+
+h1 { font-size: $font-size-4xl; }
+h2 { font-size: $font-size-3xl; }
+h3 { font-size: $font-size-2xl; }
+h4 { font-size: $font-size-xl;  }
+h5 { font-size: $font-size-lg;  }
+h6 { font-size: $font-size-base;}
+
+// ─── Utilities ────────────────────────────────────────────────────────────────
+
+.container {
+  width: 100%;
+  max-width: $container-max-width;
+  margin-inline: auto;
+  padding-inline: $spacing-6;
+}
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}