diana.dolgolyova/blackheart-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: centralize gold tokens, extract sub-components, clean up unused code

Browse Source 
- Replace hardcoded hex colors with gold/gold-light/gold-dark Tailwind tokens
- Extract Schedule into DayCard, ScheduleFilters, MobileSchedule sub-components
- Extract Team into TeamCarousel, TeamMemberInfo sub-components
- Add UI_CONFIG for centralized magic numbers (timings, thresholds)
- Add reusable IconBadge component, simplify Contact section
- Convert Pricing clickable divs to semantic buttons for a11y
- Remove unused SocialLinks, btn-outline, btn-ghost, nav-link CSS classes
- Fix React setState-during-render error in TeamCarousel (deferred update pattern)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Diana Dolgolyova
2026-03-11 14:57:39 +03:00
parent 08e4af1d55
commit d5afaf92ba
31 changed files with 784 additions and 691 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/app/styles/components.css
View File

@@ -1,57 +1,11 @@
/* ===== Navigation ===== */
.nav-link {
@apply text-sm font-medium transition-all duration-300;
@apply text-neutral-500;
@apply hover:text-neutral-900;
@apply dark:text-neutral-400 dark:hover:text-white;
}
.nav-link-active {
@apply text-[#a08050];
@apply dark:text-[#d4b87a];
}
.social-icon {
@apply text-neutral-400 transition-all duration-300;
@apply hover:text-[#a08050];
@apply dark:text-neutral-500 dark:hover:text-[#d4b87a];
}
/* ===== Cards ===== */
.card {
@apply rounded-2xl border p-6 transition-all duration-500 cursor-pointer;
@apply border-neutral-200 bg-white;
@apply hover:border-[#c9a96e]/30 hover:shadow-lg;
@apply dark:border-white/[0.08] dark:bg-[#111];
@apply dark:hover:border-[#c9a96e]/25 dark:hover:bg-[#151515];
@apply dark:hover:shadow-[0_0_30px_rgba(201,169,110,0.06)];
}
/* ===== Buttons ===== */
.btn-primary {
@apply inline-flex items-center justify-center font-semibold rounded-full transition-all duration-300 cursor-pointer;
@apply bg-[#c9a96e] text-black;
@apply hover:bg-[#d4b87a] hover:shadow-[0_0_30px_rgba(201,169,110,0.35)];
@apply dark:bg-[#c9a96e] dark:text-black;
@apply dark:hover:bg-[#d4b87a] dark:hover:shadow-[0_0_30px_rgba(201,169,110,0.35)];
}
.btn-outline {
@apply inline-flex items-center justify-center font-semibold rounded-full transition-all duration-300 cursor-pointer;
@apply border border-[#c9a96e] text-[#a08050];
@apply hover:bg-[#c9a96e] hover:text-black;
@apply dark:border-[#c9a96e] dark:text-[#d4b87a];
@apply dark:hover:bg-[#c9a96e] dark:hover:text-black;
}
.btn-ghost {
@apply inline-flex items-center justify-center font-medium rounded-full transition-all duration-300 cursor-pointer;
@apply text-neutral-600;
@apply hover:text-[#a08050];
@apply dark:text-neutral-400 dark:hover:text-[#d4b87a];
@apply bg-gold text-black;
@apply hover:bg-gold-light hover:shadow-[0_0_30px_rgba(201,169,110,0.35)];
@apply dark:bg-gold dark:text-black;
@apply dark:hover:bg-gold-light dark:hover:shadow-[0_0_30px_rgba(201,169,110,0.35)];
}
/* ===== Scrollbar ===== */
@@ -73,14 +27,3 @@
scrollbar-color: rgb(64 64 64) transparent;
}
}
/* ===== Contact ===== */
.contact-item {
@apply flex items-center gap-4;
}
.contact-icon {
@apply shrink-0 text-[#a08050];
@apply dark:text-[#d4b87a];
}