feat: responsive card pages

2026-07-24 19:53:57 +02:00
parent e85616eacc
commit e79748aa90
19 changed files with 363 additions and 250 deletions
@@ -0,0 +1,69 @@
+.add-dsp-form__header {
+  margin-bottom: var(--space-5);
+}
+
+.add-dsp-form__title {
+  margin: 0;
+  font-size: var(--font-lg);
+  font-weight: var(--font-weight-semibold);
+  color: var(--text-primary);
+}
+
+.add-dsp-form__hint {
+  margin: var(--space-2) 0 0;
+  font-size: var(--font-sm);
+  color: var(--text-muted);
+}
+
+.add-dsp-form__field {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-2);
+  margin-bottom: var(--space-4);
+  flex: 1;
+  min-width: 0;
+}
+
+.add-dsp-form__row {
+  display: flex;
+  gap: var(--space-3);
+}
+
+.add-dsp-form__field label {
+  font-size: var(--font-sm);
+  color: var(--text-muted);
+}
+
+.add-dsp-form__field input,
+.add-dsp-form__field select {
+  height: var(--card-control-height);
+  padding: 0 var(--space-3);
+
+  background: var(--bg-panel);
+
+  border: var(--border-width) solid var(--border-hairline);
+  border-radius: var(--radius-sm);
+
+  color: var(--text-primary);
+  font-family: var(--font-ui);
+  font-size: var(--font-sm);
+
+  outline: none;
+  transition: border-color var(--dur-base) var(--ease-standard);
+}
+
+.add-dsp-form__field input.mono {
+  font-family: var(--font-mono);
+}
+
+.add-dsp-form__field input:focus,
+.add-dsp-form__field select:focus {
+  border-color: var(--accent-brand);
+}
+
+.add-dsp-form__actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: var(--space-3);
+  margin-top: var(--space-2);
+}