nfel/podzahr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

main: vibe coded app to feel like paper

Browse Source 
Signed-off-by: nfel <nfilsaraee@gmail.com>
This commit is contained in:
nfel
2025-12-30 00:00:16 +03:30
parent acbaebb947
commit 91c149e92e
27 changed files with 901 additions and 8696 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/globals.css
+46 -7
View File
@@ -4,20 +4,59 @@
@layer base {
body {
@apply bg-gradient-to-br from-primary-900 via-primary-800 to-primary-900 text-white min-h-screen;
@apply bg-paper-light text-paper-dark min-h-screen;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' /%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E");
}
}
@layer utilities {
.glass-effect {
@apply bg-white/10 backdrop-blur-md border border-white/20;
.paper-card {
@apply bg-paper-sand border-2 border-paper-brown shadow-paper;
}
.glow-orange {
box-shadow: 0 0 20px rgba(255, 107, 53, 0.5);
.paper-card-light {
@apply bg-paper-light border-2 border-paper-gray shadow-paper;
}
.glow-cyan {
box-shadow: 0 0 20px rgba(0, 217, 255, 0.5);
.paper-card-dark {
@apply bg-paper-brown text-paper-light border-2 border-paper-dark shadow-paper-lg;
}
.cardboard-texture {
background-image:
repeating-linear-gradient(
90deg,
transparent,
transparent 2px,
rgba(47, 41, 38, 0.03) 2px,
rgba(47, 41, 38, 0.03) 4px
),
repeating-linear-gradient(
0deg,
transparent,
transparent 2px,
rgba(47, 41, 38, 0.03) 2px,
rgba(47, 41, 38, 0.03) 4px
);
}
.torn-edge {
position: relative;
}
.torn-edge::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
right: 0;
height: 4px;
background-image:
linear-gradient(45deg, transparent 33.33%, currentColor 33.33%, currentColor 66.66%, transparent 66.66%),
linear-gradient(-45deg, transparent 33.33%, currentColor 33.33%, currentColor 66.66%, transparent 66.66%);
background-size: 8px 4px;
background-repeat: repeat-x;
opacity: 0.1;
}
}