tknuth/website-monitor
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Your commit message

Browse Source
This commit is contained in:
Timo Knuth
2026-01-19 22:24:25 +01:00
parent 818779ab07
commit 9fa8045c26
15 changed files with 392 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
frontend/components/landing/PolicyDemoVisual.tsx
View File

@@ -37,23 +37,23 @@ export function PolicyDemoVisual() {
{/* Document Content */}
<motion.div
className="space-y-2 p-3 rounded-lg border-2 bg-white overflow-hidden"
className="space-y-2 p-3 rounded-lg border border-zinc-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 overflow-hidden"
animate={{
borderColor: phase === 1 ? 'hsl(var(--teal))' : 'hsl(var(--border))',
borderColor: phase === 1 ? '#ef4444' : '#27272a',
boxShadow: phase === 1
? '0 0 20px hsl(var(--teal) / 0.3)'
: '0 1px 3px rgba(0,0,0,0.1)'
? '0 0 20px rgba(239, 68, 68, 0.2)'
: '0 1px 3px rgba(0,0,0,0.2)'
}}
transition={{ duration: 0.5 }}
>
{/* Section 4.2 */}
<div className="space-y-1.5">
<div className="text-[10px] font-bold text-[hsl(var(--primary))]">
<div className="text-[10px] font-bold text-zinc-300">
Section 4.2 - Data Retention
</div>
{/* Text Lines */}
<div className="space-y-1 text-[9px] text-muted-foreground leading-relaxed">
<div className="space-y-1 text-[9px] text-zinc-500 leading-relaxed">
<p>We will retain your personal data for</p>
{/* Changing text */}
@@ -63,10 +63,10 @@ export function PolicyDemoVisual() {
>
<motion.p
animate={{
backgroundColor: phase === 1 ? 'hsl(var(--burgundy) / 0.15)' : 'transparent',
backgroundColor: phase === 1 ? 'rgba(239, 68, 68, 0.1)' : 'transparent',
paddingLeft: phase === 1 ? '4px' : '0px',
paddingRight: phase === 1 ? '4px' : '0px',
color: phase === 1 ? 'hsl(var(--burgundy))' : 'hsl(var(--muted-foreground))',
color: phase === 1 ? '#ef4444' : 'inherit',
fontWeight: phase === 1 ? 600 : 400
}}
transition={{ duration: 0.4 }}
@@ -91,7 +91,7 @@ export function PolicyDemoVisual() {
initial={{ scaleX: 0 }}
animate={{ scaleX: 1 }}
transition={{ duration: 0.4 }}
className="absolute -left-1 top-0 bottom-0 w-0.5 bg-[hsl(var(--burgundy))] rounded-full origin-left"
className="absolute -left-1 top-0 bottom-0 w-0.5 bg-red-500 rounded-full origin-left"
/>
)}
</motion.div>
@@ -106,9 +106,9 @@ export function PolicyDemoVisual() {
initial={{ opacity: 0, height: 0 }}
animate={{ opacity: 1, height: 'auto' }}
transition={{ delay: 0.3 }}
className="pt-2 border-t border-border flex items-center justify-between"
className="pt-2 border-t border-zinc-800 flex items-center justify-between"
>
<div className="flex items-center gap-3 text-[8px] text-muted-foreground">
<div className="flex items-center gap-3 text-[8px] text-zinc-500">
<span className="flex items-center gap-1">
<span className="w-2 h-2 rounded bg-green-500/20 border border-green-500" />
+18 words
@@ -128,16 +128,16 @@ export function PolicyDemoVisual() {
initial={{ opacity: 0, y: 5, scale: 0.9 }}
animate={{ opacity: 1, y: 0, scale: 1 }}
transition={{ delay: 0.5 }}
className="mt-3 flex items-center gap-2 p-2 rounded-lg bg-[hsl(var(--teal))]/10 border border-[hsl(var(--teal))]/30"
className="mt-3 flex items-center gap-2 p-2 rounded-lg bg-red-500/10 border border-red-500/30"
>
<div className="flex-shrink-0 flex items-center justify-center w-5 h-5 rounded-full bg-[hsl(var(--teal))] text-white">
<div className="flex-shrink-0 flex items-center justify-center w-5 h-5 rounded-full bg-red-500 text-white">
<Check className="h-3 w-3" strokeWidth={3} />
</div>
<div className="flex-1">
<div className="text-[9px] font-bold text-[hsl(var(--teal))]">
<div className="text-[9px] font-bold text-red-500">
Audit trail saved
</div>
<div className="text-[8px] text-muted-foreground">
<div className="text-[8px] text-red-500/80">
Snapshot archived for compliance
</div>
</div>