raresj/mypage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

💂‍♂️ fixed lint and prittier

Browse Source
This commit is contained in:
RJ
2025-11-14 15:33:00 +02:00
parent 5e9093cf9c
commit 820a2b88d5
43 changed files with 5717 additions and 423 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
app/globals.css
View File

@@ -1,4 +1,4 @@
@import "tailwindcss";
@import 'tailwindcss';
@theme {
--color-*: initial;
@@ -70,12 +70,7 @@
/* Scanline effect */
.scanline {
background: linear-gradient(
0deg,
transparent 0%,
rgba(6, 182, 212, 0.1) 50%,
transparent 100%
);
background: linear-gradient(0deg, transparent 0%, rgba(6, 182, 212, 0.1) 50%, transparent 100%);
background-size: 100% 3px;
pointer-events: none;
}
@@ -135,19 +130,43 @@
}
@keyframes glitch-1 {
0%, 100% { clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%); transform: translate(0); }
20% { clip-path: polygon(0 15%, 100% 15%, 100% 65%, 0 65%); }
40% { clip-path: polygon(0 30%, 100% 30%, 100% 70%, 0 70%); }
60% { clip-path: polygon(0 5%, 100% 5%, 100% 60%, 0 60%); }
80% { clip-path: polygon(0 25%, 100% 25%, 100% 40%, 0 40%); }
0%,
100% {
clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%);
transform: translate(0);
}
20% {
clip-path: polygon(0 15%, 100% 15%, 100% 65%, 0 65%);
}
40% {
clip-path: polygon(0 30%, 100% 30%, 100% 70%, 0 70%);
}
60% {
clip-path: polygon(0 5%, 100% 5%, 100% 60%, 0 60%);
}
80% {
clip-path: polygon(0 25%, 100% 25%, 100% 40%, 0 40%);
}
}
@keyframes glitch-2 {
0%, 100% { clip-path: polygon(0 55%, 100% 55%, 100% 100%, 0 100%); transform: translate(0); }
20% { clip-path: polygon(0 70%, 100% 70%, 100% 95%, 0 95%); }
40% { clip-path: polygon(0 40%, 100% 40%, 100% 85%, 0 85%); }
60% { clip-path: polygon(0 60%, 100% 60%, 100% 100%, 0 100%); }
80% { clip-path: polygon(0 50%, 100% 50%, 100% 90%, 0 90%); }
0%,
100% {
clip-path: polygon(0 55%, 100% 55%, 100% 100%, 0 100%);
transform: translate(0);
}
20% {
clip-path: polygon(0 70%, 100% 70%, 100% 95%, 0 95%);
}
40% {
clip-path: polygon(0 40%, 100% 40%, 100% 85%, 0 85%);
}
60% {
clip-path: polygon(0 60%, 100% 60%, 100% 100%, 0 100%);
}
80% {
clip-path: polygon(0 50%, 100% 50%, 100% 90%, 0 90%);
}
}
/* Grayscale filter with instant toggle */
@@ -162,7 +181,7 @@
/* Cyberpunk Glitch Effect for Button */
.glitch-btn {
position: relative;
animation: glitch 300ms cubic-bezier(.25, .46, .45, .94);
animation: glitch 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.glitch-layer {
@@ -179,21 +198,22 @@
}
.glitch-layer:first-of-type {
animation: glitch-1 300ms cubic-bezier(.25, .46, .45, .94);
animation: glitch-1 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
color: rgb(6 182 212); /* cyan-500 */
transform: translate(-2px, 0);
clip-path: polygon(0 0, 100% 0, 100% 35%, 0 35%);
}
.glitch-layer:last-of-type {
animation: glitch-2 300ms cubic-bezier(.25, .46, .45, .94);
animation: glitch-2 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
color: rgb(16 185 129); /* emerald-500 */
transform: translate(2px, 0);
clip-path: polygon(0 65%, 100% 65%, 100% 100%, 0 100%);
}
@keyframes glitch-1 {
0%, 100% {
0%,
100% {
transform: translate(0, 0);
clip-path: polygon(0 0, 100% 0, 100% 35%, 0 35%);
}
@@ -212,7 +232,8 @@
}
@keyframes glitch-2 {
0%, 100% {
0%,
100% {
transform: translate(0, 0);
clip-path: polygon(0 65%, 100% 65%, 100% 100%, 0 100%);
}
@@ -262,7 +283,8 @@
/* SCP-style subtle flicker hover */
@keyframes scp-flicker {
0%, 100% {
0%,
100% {
border-color: rgb(71 85 105);
box-shadow: 0 0 0 rgba(90, 139, 149, 0);
transform: translate(0, 0);
@@ -292,7 +314,9 @@
.cyber-glitch-hover:hover {
animation: scp-flicker 150ms ease-in-out 3;
border-color: var(--neon-cyan) !important;
box-shadow: 0 1px 4px rgba(90, 139, 149, 0.15), inset 0 0 8px rgba(90, 139, 149, 0.05);
box-shadow:
0 1px 4px rgba(90, 139, 149, 0.15),
inset 0 0 8px rgba(90, 139, 149, 0.05);
}
/* Navbar hide on scroll */
@@ -405,7 +429,9 @@
margin-top: 2rem;
margin-bottom: 2rem;
position: relative;
box-shadow: -4px 0 15px rgba(155,90,142,0.3), inset 0 0 20px rgba(155,90,142,0.05);
box-shadow:
-4px 0 15px rgba(155, 90, 142, 0.3),
inset 0 0 20px rgba(155, 90, 142, 0.05);
}
.cyberpunk-prose blockquote::before {
@@ -426,8 +452,8 @@
font-size: 0.875rem;
font-family: monospace;
border: 2px solid var(--neon-cyan);
box-shadow: 0 0 8px rgba(90,139,149,0.3);
text-shadow: 0 0 6px rgba(90,139,149,0.6);
box-shadow: 0 0 8px rgba(90, 139, 149, 0.3);
text-shadow: 0 0 6px rgba(90, 139, 149, 0.6);
}
.cyberpunk-prose pre {
@@ -437,7 +463,9 @@
margin-top: 2rem;
margin-bottom: 2rem;
overflow-x: auto;
box-shadow: 0 0 25px rgba(123,101,147,0.6), inset 0 0 25px rgba(123,101,147,0.1);
box-shadow:
0 0 25px rgba(123, 101, 147, 0.6),
inset 0 0 25px rgba(123, 101, 147, 0.1);
}
.cyberpunk-prose pre code {
@@ -450,7 +478,7 @@
margin-top: 2rem;
margin-bottom: 2rem;
border: 4px solid var(--neon-pink);
box-shadow: 0 0 20px rgba(155,90,110,0.5);
box-shadow: 0 0 20px rgba(155, 90, 110, 0.5);
}
.cyberpunk-prose hr {
@@ -460,4 +488,3 @@
margin-bottom: 3rem;
}
}