mirror of
https://github.com/zap-proto/zerocopy.git
synced 2026-10-30 15:02:43 +00:00
Bold marketing landing for the ZApps brand. Three pillars (less memory, lower latency, future-proof), use-case grid, manifesto MDX, CTA to zap-proto.dev. Visual treatment intentionally distinct from zap-proto.io: dark hero, gradient typography, larger CTAs, no docs chrome. CNAME: zerocopy.app
147 lines
2.9 KiB
CSS
147 lines
2.9 KiB
CSS
@import 'tailwindcss';
|
|
@import '@hanzo/docs-ui/css/base.css';
|
|
@import '@hanzo/docs-ui/css/colors/neutral.css';
|
|
|
|
/* Radix UI animations (from docs-radix-ui/preset.css without the broken import) */
|
|
@source '../node_modules/@hanzo/docs-radix-ui/dist/*.js';
|
|
@source '../node_modules/@hanzo/docs-radix-ui/dist/{components,contexts,provider,utils}/**/*.js';
|
|
@source '../node_modules/@hanzo/docs-radix-ui/dist/layouts/shared/**/*.js';
|
|
@source '../node_modules/@hanzo/docs-radix-ui/dist/layouts/docs/**/*.js';
|
|
|
|
:root {
|
|
--fd-primary: 217 91% 60%;
|
|
--fd-primary-foreground: 0 0% 100%;
|
|
}
|
|
|
|
.dark {
|
|
--fd-primary: 217 91% 65%;
|
|
--fd-primary-foreground: 0 0% 100%;
|
|
}
|
|
|
|
@theme {
|
|
--color-fd-primary: hsl(217, 91%, 60%);
|
|
--color-fd-primary-foreground: white;
|
|
|
|
/* Radix collapsible animations */
|
|
--animate-fd-collapsible-down: fd-collapsible-down 150ms cubic-bezier(0.45, 0, 0.55, 1);
|
|
--animate-fd-collapsible-up: fd-collapsible-up 150ms cubic-bezier(0.45, 0, 0.55, 1);
|
|
|
|
--animate-fd-accordion-down: fd-accordion-down 200ms ease-out;
|
|
--animate-fd-accordion-up: fd-accordion-up 200ms ease-out;
|
|
|
|
--animate-fd-nav-menu-in: fd-nav-menu-in 200ms ease;
|
|
--animate-fd-nav-menu-out: fd-nav-menu-out 200ms ease;
|
|
|
|
@keyframes fd-collapsible-down {
|
|
from {
|
|
height: 0;
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
height: var(--radix-collapsible-content-height);
|
|
}
|
|
}
|
|
|
|
@keyframes fd-collapsible-up {
|
|
from {
|
|
height: var(--radix-collapsible-content-height);
|
|
}
|
|
to {
|
|
height: 0;
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes fd-accordion-down {
|
|
from {
|
|
height: 0;
|
|
opacity: 0.5;
|
|
}
|
|
to {
|
|
height: var(--radix-accordion-content-height);
|
|
}
|
|
}
|
|
|
|
@keyframes fd-accordion-up {
|
|
from {
|
|
height: var(--radix-accordion-content-height);
|
|
}
|
|
to {
|
|
height: 0;
|
|
opacity: 0.5;
|
|
}
|
|
}
|
|
|
|
@keyframes fd-nav-menu-in {
|
|
from {
|
|
opacity: 0;
|
|
height: 0px;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
height: var(--radix-navigation-menu-viewport-height);
|
|
}
|
|
}
|
|
|
|
@keyframes fd-nav-menu-out {
|
|
from {
|
|
opacity: 1;
|
|
height: var(--radix-navigation-menu-viewport-height);
|
|
}
|
|
to {
|
|
opacity: 0;
|
|
height: 0px;
|
|
}
|
|
}
|
|
}
|
|
|
|
@property --radix-collapsible-content-height {
|
|
syntax: '<length>';
|
|
inherits: false;
|
|
initial-value: 0px;
|
|
}
|
|
|
|
html {
|
|
scrollbar-gutter: stable;
|
|
}
|
|
|
|
body {
|
|
background-color: var(--color-fd-background);
|
|
}
|
|
|
|
/* Custom scrollbar - electric blue */
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background: hsl(var(--fd-primary) / 0.3);
|
|
border-radius: 4px;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: hsl(var(--fd-primary) / 0.5);
|
|
}
|
|
|
|
/* Code blocks */
|
|
pre {
|
|
border: 1px solid hsl(var(--color-fd-border));
|
|
}
|
|
|
|
/* Accent link styles - electric blue */
|
|
.fd-toc a:hover,
|
|
.fd-sidebar a:hover {
|
|
color: hsl(var(--fd-primary));
|
|
}
|
|
|
|
@layer base {
|
|
body {
|
|
@apply flex flex-col min-h-screen;
|
|
}
|
|
}
|