complete story 12.3

This commit is contained in:
Naser Mansour
2026-01-04 00:38:55 +02:00
parent c855b7b159
commit 74eacd53ae
16 changed files with 167 additions and 119 deletions
+12 -12
View File
@@ -106,7 +106,7 @@
/* Label styling - semibold weight per specs */
[data-flux-label] {
@apply !mb-0 !leading-tight font-semibold text-charcoal;
@apply !mb-0 !leading-tight font-semibold text-text;
}
/* Input, Textarea, Select base styling */
@@ -115,7 +115,7 @@ textarea[data-flux-control],
[data-flux-control] input,
select[data-flux-control],
[data-flux-select-button] {
@apply border-charcoal/30 rounded-md transition-colors;
@apply border-text/30 rounded-md transition-colors;
}
/* Focus states - Warm Gray border with subtle ring */
@@ -132,16 +132,16 @@ textarea[data-flux-control] {
@apply min-h-[120px] resize-y;
}
/* Checkbox styling - Warm Gray accent when checked */
/* Checkbox styling - Light Olive accent when checked */
[data-flux-checkbox] input[type="checkbox"],
input[type="checkbox"][data-flux-control] {
@apply w-5 h-5 rounded border-charcoal/30 text-accent focus:ring-accent focus:ring-offset-0;
@apply w-5 h-5 rounded border-text/30 text-accent focus:ring-accent focus:ring-offset-0;
}
/* Radio styling - Warm Gray accent when selected */
/* Radio styling - Light Olive accent when selected */
[data-flux-radio] input[type="radio"],
input[type="radio"][data-flux-control] {
@apply w-5 h-5 border-charcoal/30 text-accent focus:ring-accent focus:ring-offset-0;
@apply w-5 h-5 border-text/30 text-accent focus:ring-accent focus:ring-offset-0;
}
/* Error state styling for Flux fields */
@@ -356,7 +356,7 @@ button.btn-danger:disabled {
/* Input field styling */
.input-field {
@apply w-full border border-charcoal/30 rounded-md px-4 py-3
@apply w-full border border-text/30 rounded-md px-4 py-3
focus:border-accent focus:ring-2 focus:ring-accent/20
transition-colors outline-none bg-white;
}
@@ -368,7 +368,7 @@ button.btn-danger:disabled {
/* Form label styling */
.form-label {
@apply block text-sm font-semibold text-charcoal mb-2;
@apply block text-sm font-semibold text-text mb-2;
}
/* Required field indicator - for manual class usage */
@@ -390,7 +390,7 @@ button.btn-danger:disabled {
/* Textarea specific styling */
.textarea-field {
@apply w-full border border-charcoal/30 rounded-md px-4 py-3
@apply w-full border border-text/30 rounded-md px-4 py-3
focus:border-accent focus:ring-2 focus:ring-accent/20
transition-colors outline-none bg-white
min-h-[120px] resize-y;
@@ -398,20 +398,20 @@ button.btn-danger:disabled {
/* Select dropdown styling */
.select-field {
@apply w-full border border-charcoal/30 rounded-md px-4 py-3
@apply w-full border border-text/30 rounded-md px-4 py-3
focus:border-accent focus:ring-2 focus:ring-accent/20
transition-colors outline-none bg-white;
}
/* Custom checkbox styling */
.checkbox-custom {
@apply w-5 h-5 rounded border-charcoal/30 text-accent
@apply w-5 h-5 rounded border-text/30 text-accent
focus:ring-accent focus:ring-offset-0;
}
/* Custom radio styling */
.radio-custom {
@apply w-5 h-5 border-charcoal/30 text-accent
@apply w-5 h-5 border-text/30 text-accent
focus:ring-accent focus:ring-offset-0;
}