revamp
This commit is contained in:
+89
-27
@@ -2,34 +2,40 @@
|
|||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
/* Nord theme custom styles */
|
/* Import modern fonts */
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');
|
||||||
|
|
||||||
|
/* Modern theme custom styles */
|
||||||
:root {
|
:root {
|
||||||
--nord-bg: #2E3440;
|
--modern-bg: #0A0E27;
|
||||||
--nord-bg-light: #3B4252;
|
--modern-bg-light: #1A1F3A;
|
||||||
--nord-bg-lighter: #434C5E;
|
--modern-bg-card: #151932;
|
||||||
--nord-text: #D8DEE9;
|
--modern-bg-hover: #1F2544;
|
||||||
--nord-text-muted: rgba(216, 222, 233, 0.6);
|
--modern-text: #E4E9F7;
|
||||||
--nord-accent: #88C0D0;
|
--modern-text-muted: #9CA3C3;
|
||||||
--nord-blue: #81A1C1;
|
--modern-primary: #6C5CE7;
|
||||||
--nord-dark-blue: #5E81AC;
|
--modern-secondary: #00D4FF;
|
||||||
|
--modern-accent: #FF6B9D;
|
||||||
|
--modern-success: #00E676;
|
||||||
|
--modern-warning: #FFB800;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Custom scrollbar for Nord theme */
|
/* Custom scrollbar for modern theme */
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
width: 8px;
|
width: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
::-webkit-scrollbar-track {
|
||||||
background: var(--nord-bg);
|
background: var(--modern-bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
::-webkit-scrollbar-thumb {
|
||||||
background: var(--nord-bg-lighter);
|
background: linear-gradient(135deg, #6C5CE7 0%, #00D4FF 100%);
|
||||||
border-radius: 4px;
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background: var(--nord-dark-blue);
|
background: linear-gradient(135deg, #5B4BD6 0%, #00B8E6 100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Smooth scrolling */
|
/* Smooth scrolling */
|
||||||
@@ -45,12 +51,23 @@ html {
|
|||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background-color: var(--nord-bg);
|
background-color: var(--modern-bg);
|
||||||
color: var(--nord-text);
|
color: var(--modern-text);
|
||||||
font-family: system-ui, -apple-system, sans-serif;
|
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Typography */
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
}
|
||||||
|
|
||||||
|
code, pre {
|
||||||
|
font-family: 'JetBrains Mono', monospace;
|
||||||
|
}
|
||||||
|
|
||||||
/* Custom animations */
|
/* Custom animations */
|
||||||
@keyframes fadeInUp {
|
@keyframes fadeInUp {
|
||||||
from {
|
from {
|
||||||
@@ -63,25 +80,70 @@ body {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@keyframes gradientShift {
|
||||||
|
0% {
|
||||||
|
background-position: 0% 50%;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
background-position: 100% 50%;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
background-position: 0% 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes glow {
|
||||||
|
0%, 100% {
|
||||||
|
box-shadow: 0 0 20px rgba(108, 92, 231, 0.3);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
box-shadow: 0 0 40px rgba(108, 92, 231, 0.6);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.animate-fadeInUp {
|
.animate-fadeInUp {
|
||||||
animation: fadeInUp 0.6s ease-out;
|
animation: fadeInUp 0.6s ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Utility classes for Nord theme */
|
.animate-gradient {
|
||||||
.nord-bg {
|
background-size: 200% 200%;
|
||||||
background-color: var(--nord-bg);
|
animation: gradientShift 3s ease infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nord-bg-light {
|
.animate-glow {
|
||||||
background-color: var(--nord-bg-light);
|
animation: glow 2s ease-in-out infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nord-text {
|
/* Utility classes for modern theme */
|
||||||
color: var(--nord-text);
|
.modern-bg {
|
||||||
|
background-color: var(--modern-bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
.nord-accent {
|
.modern-bg-light {
|
||||||
color: var(--nord-accent);
|
background-color: var(--modern-bg-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modern-text {
|
||||||
|
color: var(--modern-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modern-accent {
|
||||||
|
color: var(--modern-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Gradient text effect */
|
||||||
|
.gradient-text {
|
||||||
|
background: linear-gradient(135deg, #6C5CE7 0%, #00D4FF 100%);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
background-clip: text;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Glassmorphism effect */
|
||||||
|
.glass {
|
||||||
|
background: rgba(26, 31, 58, 0.6);
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
border: 1px solid rgba(228, 233, 247, 0.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -27,6 +27,10 @@ export default function RootLayout({
|
|||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="anonymous" />
|
||||||
|
</head>
|
||||||
<body>{children}</body>
|
<body>{children}</body>
|
||||||
</html>
|
</html>
|
||||||
)
|
)
|
||||||
|
|||||||
+355
-253
File diff suppressed because it is too large
Load Diff
Binary file not shown.
Reference in New Issue
Block a user