refactor: update styles and animations across pages for improved consistency and aesthetics
- Changed background gradients and color schemes in `now.astro` and `projects.astro` to use primary colors. - Updated text styles and backgrounds to enhance readability and visual appeal. - Added new font imports for better typography. - Introduced custom animations and hover effects in `global.css` for enhanced user interaction. - Adjusted CSS variables for a more cohesive design across light and dark modes.
This commit is contained in:
@@ -21,7 +21,7 @@ const lang = Astro.currentLocale as Lang || defaultLang;
|
||||
<!-- Enhanced background with gradient overlay -->
|
||||
<div class="fixed inset-0 -z-10 h-full w-full bg-background">
|
||||
<!-- Additional subtle gradient for about page -->
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-purple-50/30 via-transparent to-blue-50/20 dark:from-purple-950/20 dark:via-transparent dark:to-blue-950/10">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-blue-50/30 via-transparent to-blue-50/20 dark:from-blue-950/20 dark:via-transparent dark:to-blue-950/10">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -62,7 +62,7 @@ const lang = Astro.currentLocale as Lang || defaultLang;
|
||||
<div id="nav-content" class="sticky xl:w-72 w-full top-14">
|
||||
<div class="flex flex-col gap-3 p-4">
|
||||
<h3 class="dark:text-zinc-200 text-blacktext font-bold tracking-wide text-sm sm:text-base uppercase flex items-center">
|
||||
<svg class="w-4 h-4 sm:w-5 sm:h-5 mr-2 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<svg class="w-4 h-4 sm:w-5 sm:h-5 mr-2 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 10h16M4 14h16M4 18h16" />
|
||||
</svg>
|
||||
{lang === 'zh' ? '目录' : 'Table of Contents'}
|
||||
@@ -161,7 +161,7 @@ const lang = Astro.currentLocale as Lang || defaultLang;
|
||||
// Remove active state from all links
|
||||
document.querySelectorAll("#toc-list a").forEach((el) => {
|
||||
el.classList.remove(
|
||||
"bg-purple-500/10", "text-purple-500", "border-l-purple-500", "font-medium"
|
||||
"bg-primary/10", "text-primary", "border-l-primary", "font-medium"
|
||||
);
|
||||
el.classList.add("text-muted-foreground", "border-transparent");
|
||||
});
|
||||
@@ -170,7 +170,7 @@ const lang = Astro.currentLocale as Lang || defaultLang;
|
||||
if (link) {
|
||||
link.classList.remove("text-muted-foreground", "border-transparent");
|
||||
link.classList.add(
|
||||
"bg-purple-500/10", "text-purple-500", "border-l-purple-500", "font-medium"
|
||||
"bg-primary/10", "text-primary", "border-l-primary", "font-medium"
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user