1<!doctype html> 2<html lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <link rel="icon" href="./favicon.png" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1" /> 7 8 <link href="./_app/immutable/assets/TopNavbar.DahN6ecP.css" rel="stylesheet"> 9 <link href="./_app/immutable/assets/3.6FTbEx5z.css" rel="stylesheet"><!--[--><meta name="description" content="Yao KISSI portfolio, FrontEnd Developer From Paris passionate about building awesome websites"> <meta name="keywords" content="yao kissi, kissi yao, développeur svelte junior,développeur vuejs junior, Vuejs, Svelte, Tailwind, JavaScript"> <meta name="author" content="Yao Kissi"> <meta name="google-site-verification" content="Mogy-yLE_qfYdCu5PScfOzhlG3fMQBMivCuN2hpOixY"><!--]--> 10 </head> 11 <title>Yao Kissi - The Big</title> 12 <body data-sveltekit-preload-data="hover"> 13 <div style="display: contents"><!--[--><!--[--><!----><nav class="fixed top-4 z-50 left-1/2 -translate-x-1/2 h-[10vh] bg-[var(--navbar-bg)]/90 text-[var(--text-primary)] backdrop-blur-lg border border-white/10 shadow-lg flex items-center justify-center text-[var(--text-primary)] py-4 transition-colors duration-300 rounded-full svelte-15s2z1o"><div class="container mx-auto px-4"><div class="flex justify-between items-center"><div class="flex-shrink-0"><a href="/"><img src="/_app/immutable/assets/avatar1.qg-WxJfl.png" class="h-15 w-20 md:w-20 md:h-15" alt="Avatar yao kissi"> <p class="text-[var(--text-secondary)] text-xs text-center">Ydev</p></a></div> <ul class="hidden md:!flex items-center space-x-8 relative"><div class="absolute bottom-0 h-0.5 bg-gradient-to-r from-cyan-500 via-cyan-400 to-transparent transition-all duration-300 ease-out" style=" left: 0px; width: 0px; opacity: 0; "></div> <!--[--><li class="relative py-2"><a href="/" class="hover:text-[var(--text-secondary)] transition-colors duration-200 ">Home</a></li><li class="relative py-2"><a href="/#about" class="hover:text-[var(--text-secondary)] transition-colors duration-200 ">About</a></li><li class="relative py-2"><a href="/projects" class="hover:text-[var(--text-secondary)] transition-colors duration-200 ">Projects</a></li><li class="relative py-2"><a href="/contact" class="hover:text-[var(--text-secondary)] transition-colors duration-200 text-[var(--text-secondary)] font-bold">Contact</a></li><!--]--></ul> <div class="flex items-center space-x-4 border-red-50"><button class="p-2 hover:bg-white/10 rounded-full transition-colors duration-200" title="Change Theme"><!--[!--><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide-icon lucide lucide-moon w-6 h-6 cursor-pointer"><!--[--><!----><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"><!----></path><!----><!--]--><!----><!----><!----><!----></svg><!--]--></button> <button class="md:hidden p-2 hover:bg-white/10 rounded-full transition-colors duration-200" aria-label="Toggle menu"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide-icon lucide lucide-layout-grid w-6 h-6"><!--[--><!----><rect width="7" height="7" x="3" y="3" rx="1"><!----></rect><!----><!----><rect width="7" height="7" x="14" y="3" rx="1"><!----></rect><!----><!----><rect width="7" height="7" x="14" y="14" rx="1"><!----></rect><!----><!----><rect width="7" height="7" x="3" y="14" rx="1"><!----></rect><!----><!--]--><!----><!----><!----><!----></svg><!----></button></div></div></div></nav> <!--[!--><!--]--><!----> <!----><!----><main class="min-h-screen bg-[var(--background)] text-white relative pt-20 pb-20"><model-viewer class="absolute inset-0 w-full h-full z-[0] opacity-60 pointer-events-none" src="../models/need_some_space.glb" alt="My setup 3d model" auto-rotate="" controls-camera="false" camera-orbit="0deg 65deg 105%" field-of-view="200deg" disable-zoom="" loading="lazy" style="width: 100%; height: 100%;"><div slot="poster" class="loading-poster"><div class="loading-spinner"></div> <p class="loading-text">Loading...</p></div></model-viewer> <div class="relative container mx-auto mt-20 px-4 py-12"><div class="text-[var(--text-primary)] max-w-md mx-auto backdrop-blur-sm p-8 rounded-xl border border-gray-700 shadow-xl"><h1 class="text-4xl font-bold text-center mb-2">Let's talk</h1> <p class="text-gray-300 text-[var(--text-primary)] text-center mb-8">I commit to responding to your message within a maximum delay of 2 hours.</p> <form method="POST" action="https://formspree.io/f/mqapqpna" class="space-y-6"><div class="space-y-2"><label class="block text-[var(--text-primary)] text-sm font-medium text-gray-300">Name <input name="senderName" type="text" class="mt-1 block w-full p-3 border border-gray-700 rounded-xl focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" placeholder="Your name" required></label></div> <div class="space-y-2"><label class="block text-[var(--text-primary)] text-sm font-medium text-gray-300">Email <input name="email" type="email" class="mt-1 block w-full p-3 border border-gray-700 rounded-xl focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" placeholder="[email protected]" required></label></div> <div class="space-y-2"><label class="block text-[var(--text-primary)] text-sm font-medium text-gray-300">Message <textarea name="message" rows="4" class="mt-1 block w-full p-3 border border-gray-700 rounded-xl focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all resize-none" placeholder="Your message here..." required></textarea></label></div> <button type="submit" class="w-full bg-blue-600 text-white px-6 py-3 rounded-xl font-medium hover:bg-blue-700 transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-[#1a1a1c]">Send Message</button></form></div></div></main> <hr class="text-gray-700"> <div class="pt-10 p-10 flex justify-around flex-wrap bg-[var(--background)] text-[var(--text-primary)]"><div><div class="block flex"><!--[--><a href="https://github.com/yaokissi" target="_blank" class="mr-5 text-[var(--text-primary)]"><img src="/_app/immutable/assets/github.Be7AiuZE.png" class="w-7 h-7" alt="logo "></a><a href="https://www.linkedin.com/in/yao-kissi/" target="_blank" class="mr-5 text-[var(--text-primary)]"><img src="/_app/immutable/assets/linkedin.CPo_qvaZ.png" class="w-7 h-7" alt="logo "></a><a href="https://www.threads.net/@bigyaos" target="_blank" class="mr-5 text-[var(--text-primary)]"><img src="/_app/immutable/assets/threads.Cio9-D1V.png" class="w-7 h-7" alt="logo "></a><a href="https://x.com/YaoKissi2" target="_blank" class="mr-5 text-[var(--text-primary)]"><img src="/_app/immutable/assets/twitter.CPWSm0NQ.png" class="w-7 h-7" alt="logo "></a>
13<!--]--></div> <ul class="flex justify-center mt-10 justify-evenly"><!--[--><li class="mr-10"><a href="/" class="text-white text-[var(--text-primary)] hover:text-gray-300 transition-colors">Home</a></li><li class="mr-10"><a href="/#about" class="text-white text-[var(--text-primary)] hover:text-gray-300 transition-colors">About</a></li><li class="mr-10"><a href="/projects" class="text-white text-[var(--text-primary)] hover:text-gray-300 transition-colors">Projects</a></li><li class="mr-10"><a href="/contact" class="text-white text-[var(--text-primary)] hover:text-gray-300 transition-colors">Contact</a></li><!--]--></ul></div> <div class="text-white text-[var(--text-primary)] flex justify-between items-center mt-10 md:mt-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide-icon lucide lucide-copyright w-5"><!--[--><!----><circle cx="12" cy="12" r="10"><!----></circle><!----><!----><path d="M14.83 14.83a4 4 0 1 1 0-5.66"><!----></path><!----><!--]--><!----><!----><!----><!----></svg><!----> <p class="ml-3">2026 Yao KISSI. All rights reserved.</p></div></div><!----><!----><!----><!----><!--]--> <!--[!--><!--]--><!--]--> 14 15
15<script> 16 { 17 __sveltekit_1itr4fo = { 18 base: new URL(".", location).pathname.slice(0, -1) 19 }; 20 21 const element = document.currentScript.parentElement; 22 23 Promise.all([ 24 import("./_app/immutable/entry/start.DqPohB1d.js"), 25 import("./_app/immutable/entry/app.DczShi98.js") 26 ]).then(([kit, app]) => { 27 kit.start(app, element, { 28 node_ids: [0, 3], 29 data: [null,null], 30 form: null, 31 error: null 32 }); 33 }); 34 } 35 </script>
35 36 </div> 37 </body> 38</html>
39<script type="module" src="https://cdn.skypack.dev/@google/model-viewer"></script>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.