andika/membership-fe
3
1
Fork 1
Code Issues 17 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: update color styles in AdminSidebar, Register, and CSS files for improved UI consistency

Browse Source
This commit is contained in:
kayela
2026-01-20 16:02:54 -06:00
parent 819062d697
commit 65c3e3b92d
4 changed files with 12 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/AdminSidebar.js
View File

@@ -224,7 +224,7 @@ const AdminSidebar = ({ isOpen, onToggle, isMobile }) => {
${item.disabled ${item.disabled
? 'opacity-50 cursor-not-allowed text-brand-purple ' ? 'opacity-50 cursor-not-allowed text-brand-purple '
: active : active
? 'bg-[var(--orange-light)]/10 text-[var(--orange-light)]' ? 'bg-[var(--orange-light)]/10 text-[var(--purple-ink)]'
: 'text-[var(--purple-ink)] hover:bg-[var(--neutral-800)]/20' : 'text-[var(--purple-ink)] hover:bg-[var(--neutral-800)]/20'
} }
`} `}
@@ -254,7 +254,7 @@ const AdminSidebar = ({ isOpen, onToggle, isMobile }) => {
{/* Badge when collapsed */} {/* Badge when collapsed */}
{!isOpen && item.badge > 0 && !item.disabled && ( {!isOpen && item.badge > 0 && !item.disabled && (
<div className="absolute -top-1 -right-1 bg-accent foreground text-xs rounded-full h-5 w-5 flex items-center justify-center font-medium"> <div className="absolute -top-1 -right-1 bg-accent text-white foreground text-xs rounded-full h-5 w-5 flex items-center justify-center font-medium">
{item.badge} {item.badge}
</div> </div>
)} )}

4
src/pages/Register.js
View File

@@ -258,7 +258,7 @@ const Register = () => {
<Button <Button
type="button" type="button"
onClick={handleNext} onClick={handleNext}
className="bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-background rounded-full px-6 py-6 text-lg font-medium shadow-lg hover:scale-105 transition-transform" className="bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-brand-purple hover:text-background rounded-full px-6 py-6 text-lg font-medium shadow-lg hover:scale-105 transition-transform"
> >
Next Next
<ArrowRight className="ml-2 h-5 w-5" /> <ArrowRight className="ml-2 h-5 w-5" />
@@ -267,7 +267,7 @@ const Register = () => {
<Button <Button
type="submit" type="submit"
disabled={loading} disabled={loading}
className="bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-background rounded-full px-6 py-6 text-lg font-medium shadow-lg hover:scale-105 transition-transform disabled:opacity-50 disabled:cursor-not-allowed" className="bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-brand-purple hover:text-backgroundrounded-full px-6 py-6 text-lg font-medium shadow-lg hover:scale-105 transition-transform disabled:opacity-50 disabled:cursor-not-allowed"
data-testid="submit-register-button" data-testid="submit-register-button"
> >
{loading ? 'Creating Account...' : 'Create Account'} {loading ? 'Creating Account...' : 'Create Account'}

4
src/styles/components.css
View File

@@ -17,7 +17,7 @@
} }
.btn-ghost { .btn-ghost {
@apply hover:bg-brand-purple bg-brand-purple/10 rounded-full disabled:opacity-50 px-6 transition-transform text-brand-purple hover:text-[var(--purple-muted)]; @apply hover:bg-brand-purple bg-brand-purple/10 rounded-full disabled:opacity-50 px-6 transition-transform text-brand-purple hover:text-background;
} }
.btn-outline { .btn-outline {
@@ -91,6 +91,4 @@
.bg-light-lavender { .bg-light-lavender {
@apply bg-gradient-to-br from-brand-purple to-[var(--purple-ink)] text-white bg-[var(--neutral-800)] transition-transform dark:bg-brand-lavender dark:text-brand-dark-lavender; @apply bg-gradient-to-br from-brand-purple to-[var(--purple-ink)] text-white bg-[var(--neutral-800)] transition-transform dark:bg-brand-lavender dark:text-brand-dark-lavender;
} }
} }

3
src/styles/theme.css
View File

@@ -78,7 +78,7 @@
--green-muted: #66927e; --green-muted: #66927e;
--green-soft: #6a9680; --green-soft: #6a9680;
--green-eucalyptus: #6a9a83; --green-eucalyptus: #6a9a83;
--green-forest: #5e8EsOkvcwL7472374; --green-forest: #5a7d68;
--green-fern: #6da085; --green-fern: #6da085;
--green-mint: #6fa087; --green-mint: #6fa087;
--green-pastel: #6fa188; --green-pastel: #6fa188;
@@ -243,4 +243,3 @@
--neutral-900: #f4f4ff; /* highest contrast text */ --neutral-900: #f4f4ff; /* highest contrast text */
} }
} }