Admin mode. Data driven content sections. Bugfixes.

2026-06-19 17:36:35 +00:00
parent bd65455945
commit 266c2451f1
30 changed files with 1733 additions and 13 deletions
@@ -0,0 +1,129 @@
+@use '../../styles/variables' as *;
+@use '../../styles/mixins' as *;
+
+.form-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.5);
+  @include flex-center;
+  z-index: $z-modal;
+  @include fade-in;
+}
+
+.form-dialog {
+  background: $neutral-white;
+  border-radius: $radius-lg;
+  padding: $spacing-xl;
+  width: 90%;
+  max-width: 560px;
+  box-shadow: $shadow-xl;
+}
+
+.form-header {
+  @include flex-between;
+  margin-bottom: $spacing-lg;
+
+  h2 {
+    font-family: $font-heading;
+    color: $primary-blue;
+    margin: 0;
+    font-size: 1.4rem;
+  }
+}
+
+.btn-close {
+  background: none;
+  border: none;
+  font-size: 1.5rem;
+  cursor: pointer;
+  color: $neutral-medium;
+  line-height: 1;
+  padding: $spacing-xs;
+
+  &:hover {
+    color: $neutral-dark;
+  }
+}
+
+.form-error {
+  background: rgba($danger-red, 0.1);
+  color: $danger-red;
+  padding: $spacing-sm $spacing-md;
+  border-radius: $radius-md;
+  font-size: 0.875rem;
+  margin-bottom: $spacing-md;
+  text-align: center;
+}
+
+.admin-form {
+  .form-row {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: $spacing-md;
+  }
+
+  .form-group {
+    margin-bottom: $spacing-md;
+
+    label {
+      display: block;
+      font-size: 0.875rem;
+      font-weight: 600;
+      color: $neutral-dark;
+      margin-bottom: $spacing-xs;
+    }
+
+    input, select, textarea {
+      width: 100%;
+      padding: $spacing-sm $spacing-md;
+      border: 1px solid $neutral-light;
+      border-radius: $radius-md;
+      font-size: 0.95rem;
+      transition: border-color $transition-fast;
+      box-sizing: border-box;
+
+      &:focus {
+        outline: none;
+        border-color: $primary-blue;
+        box-shadow: 0 0 0 3px rgba($primary-blue, 0.15);
+      }
+
+      &.is-invalid {
+        border-color: $danger-red;
+        box-shadow: 0 0 0 3px rgba($danger-red, 0.15);
+      }
+    }
+  }
+}
+
+.form-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: $spacing-sm;
+  margin-top: $spacing-md;
+}
+
+.btn-save {
+  @include button-style($primary-blue, $neutral-white, $primary-blue-light);
+
+  &:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+}
+
+.btn-cancel {
+  background: $neutral-light;
+  color: $neutral-dark;
+  border: none;
+  border-radius: $radius-md;
+  padding: $spacing-sm $spacing-lg;
+  font-size: 0.95rem;
+  cursor: pointer;
+  transition: background $transition-fast;
+
+  &:hover {
+    background: $neutral-medium;
+    color: $neutral-white;
+  }
+}