sonicgrid-synthface / style.css
RyderMusic's picture
Improve look and feel and responsiveness and make it have a even more unique novel feel
819d6db verified
/* New base styles */
body {
padding: 0;
margin: 0;
font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
line-height: 1.6;
}
h1, h2, h3, h4 {
font-weight: 700;
line-height: 1.2;
}
a {
transition: all 0.3s ease;
}
/* Custom animations */
@keyframes float {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}
@keyframes neonGlow {
0%, 100% { text-shadow: 0 0 5px var(--primary), 0 0 10px var(--primary); }
50% { text-shadow: 0 0 20px var(--primary), 0 0 30px var(--primary); }
}
/* Utility classes */
.text-primary {
color: var(--primary);
}
.text-secondary {
color: var(--secondary);
}
.text-accent {
color: var(--accent);
}
.bg-primary {
background-color: var(--primary);
}
.bg-secondary {
background-color: var(--secondary);
}
.bg-accent {
background-color: var(--accent);
}
.border-primary {
border-color: var(--primary);
}
.border-secondary {
border-color: var(--secondary);
}
.border-accent {
border-color: var(--accent);
}
.hover-scale {
transition: transform 0.3s ease;
}
.hover-scale:hover {
transform: scale(1.05);
}