color manual fixing

This commit is contained in:
Naser Mansour
2026-01-04 01:15:42 +02:00
parent 82e803dc26
commit a33cbfb908
18 changed files with 79 additions and 72 deletions
+20 -20
View File
@@ -43,7 +43,7 @@
/* Neutrals (unchanged) */
--color-background: #E8E4DC; /* Off-White - light backgrounds */
--color-text: #1A1A1A; /* Deep Black - text color */
--color-body: #1A1A1A; /* Deep Black - body text color */
/* Semantic Aliases - used by components */
--color-accent-content: #A5C87A; /* Light Olive */
@@ -91,7 +91,7 @@
========================================================================== */
.logo-badge {
border: 2px solid var(--color-text);
border: 2px solid var(--color-body);
box-shadow: 4px 4px 6px rgba(26, 26, 26, 0.5);
}
@@ -106,7 +106,7 @@
/* Label styling - semibold weight per specs */
[data-flux-label] {
@apply !mb-0 !leading-tight font-semibold text-text;
@apply !mb-0 !leading-tight font-semibold text-body;
}
/* 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-text/30 rounded-md transition-colors;
@apply border-body/30 rounded-md transition-colors text-body;
}
/* Focus states - Warm Gray border with subtle ring */
@@ -135,13 +135,13 @@ textarea[data-flux-control] {
/* 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-text/30 text-accent focus:ring-accent focus:ring-offset-0;
@apply w-5 h-5 rounded border-body/30 text-accent focus:ring-accent focus:ring-offset-0;
}
/* 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-text/30 text-accent focus:ring-accent focus:ring-offset-0;
@apply w-5 h-5 border-body/30 text-accent focus:ring-accent focus:ring-offset-0;
}
/* Error state styling for Flux fields */
@@ -185,10 +185,10 @@ input[type="radio"][data-flux-control] {
/* Prose Brand styling for blog posts - Olive Green palette (Story 12.2) */
.prose-brand {
--tw-prose-headings: var(--color-text); /* Deep Black */
--tw-prose-headings: var(--color-body); /* Deep Black */
--tw-prose-links: var(--color-primary); /* Olive Green */
--tw-prose-bold: var(--color-text); /* Deep Black */
--tw-prose-body: var(--color-text); /* Deep Black */
--tw-prose-bold: var(--color-body); /* Deep Black */
--tw-prose-body: var(--color-body); /* Deep Black */
}
.prose-brand a {
@@ -201,10 +201,10 @@ input[type="radio"][data-flux-control] {
/* Backward compatibility alias for prose-navy */
.prose-navy {
--tw-prose-headings: var(--color-text);
--tw-prose-headings: var(--color-body);
--tw-prose-links: var(--color-primary);
--tw-prose-bold: var(--color-text);
--tw-prose-body: var(--color-text);
--tw-prose-bold: var(--color-body);
--tw-prose-body: var(--color-body);
}
.prose-navy a {
@@ -266,8 +266,8 @@ small, .text-sm {
/* Secondary button - Outlined with Light Olive border, Deep Black text */
.btn-secondary {
@apply bg-transparent border-2 border-accent text-text rounded-md px-6 py-3 font-semibold transition-colors;
@apply hover:bg-accent hover:text-text;
@apply bg-transparent border-2 border-accent text-body rounded-md px-6 py-3 font-semibold transition-colors;
@apply hover:bg-accent hover:text-body;
@apply focus:outline-none focus:ring-2 focus:ring-accent focus:ring-offset-2;
}
@@ -356,7 +356,7 @@ button.btn-danger:disabled {
/* Input field styling */
.input-field {
@apply w-full border border-text/30 rounded-md px-4 py-3
@apply w-full border border-body/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-text mb-2;
@apply block text-sm font-semibold text-body 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-text/30 rounded-md px-4 py-3
@apply w-full border border-body/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-text/30 rounded-md px-4 py-3
@apply w-full border border-body/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-text/30 text-accent
@apply w-5 h-5 rounded border-body/30 text-accent
focus:ring-accent focus:ring-offset-0;
}
/* Custom radio styling */
.radio-custom {
@apply w-5 h-5 border-text/30 text-accent
@apply w-5 h-5 border-body/30 text-accent
focus:ring-accent focus:ring-offset-0;
}