From cd1281e7cf25938349b6badbf2885e5aacf3bdc4 Mon Sep 17 00:00:00 2001 From: Jan-Marlon Leibl Date: Mon, 24 Feb 2025 22:50:59 +0100 Subject: [PATCH] style: update theme-secondary color opacity values --- src/pages/index.tsx | 571 ++++++++++++++++++++------------------------ 1 file changed, 262 insertions(+), 309 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 3736ae1..577bd53 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -137,9 +137,9 @@ export default function Home() { .red .theme-primary { color: rgba(255, 0, 0, 0.9); } .gold .theme-primary { color: rgba(255, 204, 0, 0.9); } - .black .theme-secondary { color: rgba(255, 255, 255, 0.7); } - .red .theme-secondary { color: rgba(255, 0, 0, 0.7); } - .gold .theme-secondary { color: rgba(255, 204, 0, 0.7); } + .black .theme-secondary { color: rgba(255, 255, 255, 0.6); } + .red .theme-secondary { color: rgba(255, 0, 0, 0.6); } + .gold .theme-secondary { color: rgba(255, 204, 0, 0.6); } .black .theme-accent { background-color: rgba(255, 255, 255, 0.03); } .red .theme-accent { background-color: rgba(255, 0, 0, 0.03); } @@ -152,39 +152,6 @@ export default function Home() { .theme-transition { transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; } - - /* Focus styles for accessibility */ - a:focus-visible, button:focus-visible { - outline: 2px solid #4D90FE; - outline-offset: 2px; - } - - /* Improved touch targets for mobile */ - @media (max-width: 640px) { - a, button { - min-height: 44px; - min-width: 44px; - } - } - - /* Skip to content */ - .skip-to-content { - position: absolute; - left: -9999px; - top: 0; - z-index: 999; - padding: 1rem; - background-color: white; - color: black; - text-decoration: none; - transform: translateY(-100%); - transition: transform 0.3s; - } - - .skip-to-content:focus { - left: 0; - transform: translateY(0); - } `}
@@ -224,24 +191,21 @@ export default function Home() { - {/* Skip to content link for keyboard users */} - Skip to content -
-
-
-
-
- +
+
+
- -
-
- -
-

About

- +
+ Role + Fullstack Developer
- - -
-
- -
- Jan-Marlon Leibl - Fullstack Software Developer -
- - -
-

Jan-Marlon Leibl

-

Fullstack Developer

-
- +
+ Experience + 5+ Years
- - -
-
-

- Hello! I'm Jan-Marlon, but please call me Jan. I started my journey in programming at the age of 11 with C#, fascinated by a desktop application my friend created. -

-

- Today, I specialize in PHP and TypeScript development, constantly pushing the boundaries of what's possible on the web. My journey has led me from creating simple applications to developing complex systems used by thousands. -

-
+
+ +
+
-
-
-
-

Technologies

- -
-
    - {['PHP', 'JavaScript', 'MySQL', 'React'].map((tech) => ( -
  • - - {tech} -
    • - ))} -
-
- -
-
-

Interests

- -
-
    - {[ - 'Web Development', - 'System Architecture', - 'UI/UX Design', - 'Performance Optimization' - ].map((interest) => ( -
  • - - {interest} -
    • - ))} -
-
-
- - +
+
+ +
+

About

+
+
+ + +
+
+ +
+ Jan-Marlon Leibl - Fullstack Software Developer +
+ + +
+

Jan-Marlon Leibl

+

Fullstack Developer
-
-
+ + +
+
+

+ Hello! I'm Jan-Marlon, but please call me Jan. I started my journey in programming at the age of 11 with C#, fascinated by a desktop application my friend created. +

+

+ Today, I specialize in PHP and TypeScript development, constantly pushing the boundaries of what's possible on the web. My journey has led me from creating simple applications to developing complex systems used by thousands. +

+
-
- -
- -
- Portfolio -
-

Selected Work

- +
+
+
+

Technologies

+
+
+
    + {['PHP', 'JavaScript', 'MySQL', 'React'].map((tech) => ( +
  • + + {tech} +
    • + ))} +
+
+ +
+
+

Interests

+
+
+
    + {[ + 'Web Development', + 'System Architecture', + 'UI/UX Design', + 'Performance Optimization' + ].map((interest) => ( +
  • + + {interest} +
    • + ))} +
+
+
+ +
- -
- {[ - { - title: 'ventry.host v2', - year: '2025', - description: 'Free file hosting revamped with a modern design and improved user experience.', - tags: ['Next.js', 'Tailwind CSS', 'TypeScript'] - }, - { - title: 'ventry.host', - year: '2023', - description: 'A free file hosting solution with thousands of daily visitors.', - tags: ['PHP', 'JavaScript', 'MySQL'] - }, - { - title: 'ShareUpload', - year: '2022', - description: 'High-performance file sharing platform with unlimited storage.', - tags: ['PHP', 'MySQL', 'Performance'] - }, - { - title: 'RestoreM', - year: '2023', - description: 'Discord server backup and restoration service.', - tags: ['PHP', 'MySQL', 'Discord API'] - } - ].map((project, index) => ( - -
-
-
- {project.year} -
- +
+
+
+ +
+
+
+ +
+ Portfolio +
+

Selected Work

+
+
+
+ + +
+ {[ + { + title: 'ventry.host v2', + year: '2025', + description: 'Free file hosting revamped with a modern design and improved user experience.', + tags: ['Next.js', 'Tailwind CSS', 'TypeScript'] + }, + { + title: 'ventry.host', + year: '2023', + description: 'A free file hosting solution with thousands of daily visitors.', + tags: ['PHP', 'JavaScript', 'MySQL'] + }, + { + title: 'ShareUpload', + year: '2022', + description: 'High-performance file sharing platform with unlimited storage.', + tags: ['PHP', 'MySQL', 'Performance'] + }, + { + title: 'RestoreM', + year: '2023', + description: 'Discord server backup and restoration service.', + tags: ['PHP', 'MySQL', 'Discord API'] + } + ].map((project, index) => ( + +
+
+
+ {project.year} +
+
+
+ +
+
+

+ {project.title} +

+

+ {project.description} +

-
-
-

- {project.title} -

-

- {project.description} -

-
- -
-
-

Technologies

-
- {project.tags.map((tag, tagIndex) => ( - - {tag}{tagIndex !== project.tags.length - 1 && ( - - )} - - ))} -
+
+
+

Technologies

+
+ {project.tags.map((tag, tagIndex) => ( + + {tag}{tagIndex !== project.tags.length - 1 && ( + • + )} + + ))}
- - ))} -
+ +
+
+ + ))}
-
-
+
+