31 lines
47 KiB
HTML
31 lines
47 KiB
HTML
<!DOCTYPE html><html lang="en" data-astro-cid-yu3cdcui> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>个人主页</title><!-- Used to add dark mode right away, adding here prevents any flicker --><script>
|
||
if (typeof Storage !== 'undefined') {
|
||
if (
|
||
localStorage.getItem('dark_mode') &&
|
||
localStorage.getItem('dark_mode') == 'true'
|
||
) {
|
||
document.documentElement.classList.add('dark')
|
||
}
|
||
}
|
||
</script><link rel="icon" type="image/x-icon" href="../assets/images/favicon.png"><script type="module">window.darkMode=!1;const d=["fixed","h-14"],s=["absolute","h-20"],o=["border-neutral-300/50","bg-white/80","dark:border-neutral-600/40","dark:bg-neutral-900/60","backdrop-blur-2xl"],l=["border-transparent"];let n=null;document.addEventListener("DOMContentLoaded",()=>{n=document.getElementById("header"),localStorage.getItem("dark_mode")&&localStorage.getItem("dark_mode")==="true"?(window.darkMode=!0,m()):i(),stickyHeaderFuncionality(),applyMenuItemClasses(),evaluateHeaderPosition(),a()});window.stickyHeaderFuncionality=()=>{window.addEventListener("scroll",()=>{evaluateHeaderPosition()})};window.evaluateHeaderPosition=()=>{window.scrollY>16?(n.firstElementChild.classList.add(...o),n.firstElementChild.classList.remove(...l),n.classList.add(...d),n.classList.remove(...s),document.getElementById("menu").classList.add("top-[56px]"),document.getElementById("menu").classList.remove("top-[75px]")):(n.firstElementChild.classList.remove(...o),n.firstElementChild.classList.add(...l),n.classList.add(...s),n.classList.remove(...d),document.getElementById("menu").classList.remove("top-[56px]"),document.getElementById("menu").classList.add("top-[75px]"))};document.getElementById("darkToggle").addEventListener("click",()=>{document.documentElement.classList.add("duration-300"),document.documentElement.classList.contains("dark")?(localStorage.removeItem("dark_mode"),i(!0)):(localStorage.setItem("dark_mode",!0),m(!0))});function i(t){document.getElementById("sun").classList.remove("setting"),document.getElementById("moon").classList.remove("rising");let e=0;t&&(e=500,document.getElementById("moon").classList.add("setting")),setTimeout(()=>{document.getElementById("dayText").classList.remove("hidden"),document.getElementById("nightText").classList.add("hidden"),document.getElementById("moon").classList.add("hidden"),document.getElementById("sun").classList.remove("hidden"),t&&(document.documentElement.classList.remove("dark"),document.getElementById("sun").classList.add("rising"))},e)}function m(t){document.getElementById("moon").classList.remove("setting"),document.getElementById("sun").classList.remove("rising");let e=0;t&&(e=500,document.getElementById("sun").classList.add("setting")),setTimeout(()=>{document.getElementById("nightText").classList.remove("hidden"),document.getElementById("dayText").classList.add("hidden"),document.getElementById("sun").classList.add("hidden"),document.getElementById("moon").classList.remove("hidden"),t&&(document.documentElement.classList.add("dark"),document.getElementById("moon").classList.add("rising"))},e)}window.applyMenuItemClasses=()=>{const t=document.querySelectorAll("#menu a");for(let e=0;e<t.length;e++)t[e].pathname===window.location.pathname&&t[e].classList.add("text-neutral-900","dark:text-white")};function a(){document.getElementById("openMenu").addEventListener("click",()=>{openMobileMenu()}),document.getElementById("closeMenu").addEventListener("click",()=>{closeMobileMenu()})}window.openMobileMenu=()=>{document.getElementById("openMenu").classList.add("hidden"),document.getElementById("closeMenu").classList.remove("hidden"),document.getElementById("menu").classList.remove("hidden"),document.getElementById("mobileMenuBackground").classList.add("opacity-0"),document.getElementById("mobileMenuBackground").classList.remove("hidden"),setTimeout(()=>{document.getElementById("mobileMenuBackground").classList.remove("opacity-0")},1)};window.closeMobileMenu=()=>{document.getElementById("closeMenu").classList.add("hidden"),document.getElementById("openMenu").classList.remove("hidden"),document.getElementById("menu").classList.add("hidden"),document.getElementById("mobileMenuBackground").classList.add("hidden")};</script><link rel="stylesheet" href="/_astro/main.BERzMjyF.css">
|
||
<link rel="stylesheet" href="/_astro/about.wtJm-COF.css"></head> <body class="antialiased bg-white dark:bg-neutral-950" data-astro-cid-yu3cdcui> <div class="absolute w-full h-auto" style="z-index:-1"> <div class="absolute top-0 left-0 w-1/2 h-auto bg-neutral-100 dark:bg-neutral-800"> <div class="absolute inset-0 z-30 w-full h-full pointer-events-none bg-gradient-to-tl from-white dark:from-neutral-950 from-50% via-90% to-100% via-transparent to-transparent"></div> <div class="flex flex-col w-full h-full border-t border-l divide-y divide-dashed divide-neutral-300 dark:divide-neutral-700 border-neutral-300 dark:border-neutral-900"> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> </div> </div> <div class="absolute top-0 right-0 w-1/2 h-auto bg-neutral-100 dark:bg-neutral-800"> <div class="absolute inset-0 z-30 w-full h-full pointer-events-none bg-gradient-to-tr from-white dark:from-neutral-950 from-50% via-90% to-100% via-transparent to-transparent"></div> <div class="flex flex-col w-full h-full border-t border-l divide-y divide-dashed divide-neutral-300 dark:divide-neutral-700 border-neutral-300 dark:border-neutral-900"> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> <div class="relative flex w-full divide-x h-[30px] sm:h-[45px] md:h-[60px] xl:h-[88px] divide-neutral-300 dark:divide-neutral-700 divide-dashed"> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> <div class="w-full h-auto bg-white dark:bg-neutral-950 aspect-square {classes}"></div> </div> </div> </div> </div> <!-- This is an invisible div with relative position so that it takes up the height of the menu (because menu is absolute/fixed) --><div class="relative w-full max-w-7xl h-20 mx-auto opacity-0 pointer-events-none"></div> <header id="header" class="absolute top-0 z-50 w-full h-20"> <div class="flex items-center justify-between h-full max-w-7xl pl-6 pr-4 mx-auto border-b border-l-0 border-r-0 border-transparent select-none lg:border-r lg:border-l lg:rounded-b-xl"> <a href="/" class="h-5 text-base group relative z-30 flex items-center space-x-1.5 text-black dark:text-white font-semibold"> <span class="text-xl -translate-y-0.5 group-hover:-rotate-12 group-hover:scale-[1.2] ease-in-out duration-300">✦</span> <!-- Logo Text --> <span class="-translate-y-0.5"> aria</span> </a> <div id="mobileMenuBackground" onclick="closeMobileMenu()" class="fixed inset-0 z-20 hidden w-screen h-screen duration-300 ease-out bg-white/90 dark:bg-neutral-950/90"></div> <nav class="relative z-30 flex flex-row-reverse justify-start w-full text-sm sm:justify-end text-neutral-500 dark:text-neutral-400 sm:flex-row"> <div id="openMenu" class="flex flex-col items-end justify-center w-6 h-6 ml-4 cursor-pointer sm:hidden"> <svg class="w-8 h-8 dark:text-neutral-200" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M4 8h16M4 16h16"></path></svg> </div> <div id="closeMenu" class="flex flex-col items-end justify-center hidden w-6 h-6 ml-4 -translate-x-1 cursor-pointer sm:hidden"> <svg class="w-6 h-6 text-neutral-600 dark:text-neutral-200" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M6 18L18 6M6 6l12 12"></path></svg> </div> <div id="menu" class="fixed top-[75px] ease-out duration-300 sm:top-0 w-full left-0 sm:py-0 pt-7 pb-4 dm:mx-0 left-0 z-40 flex-col items-end justify-start hidden w-full h-auto text-sm sm:text-base sm:h-auto sm:relative sm:flex-row sm:flex sm:text-sm sm:w-auto sm:pr-0 sm:pt-0"> <div class="absolute inset-0 top-0 right-0 block w-full h-full px-3 sm:hidden"> <div class="relative w-full h-full bg-white border border-dashed border-neutral-300 dark:border-neutral-700 backdrop-blur-sm rounded-xl dark:bg-neutral-950"></div> </div> <a href="/" class="relative flex items-center justify-center w-full px-3 py-2 font-medium tracking-wide text-center duration-200 ease-out sm:py-0 sm:mb-0 md:w-auto hover:text-neutral-900 dark:hover:text-white"> Home </a><a href="/posts" class="relative flex items-center justify-center w-full px-3 py-2 font-medium tracking-wide text-center duration-200 ease-out sm:py-0 sm:mb-0 md:w-auto hover:text-neutral-900 dark:hover:text-white"> Posts </a><a href="/projects" class="relative flex items-center justify-center w-full px-3 py-2 font-medium tracking-wide text-center duration-200 ease-out sm:py-0 sm:mb-0 md:w-auto hover:text-neutral-900 dark:hover:text-white"> Projects </a><a href="/about" class="relative flex items-center justify-center w-full px-3 py-2 font-medium tracking-wide text-center duration-200 ease-out sm:py-0 sm:mb-0 md:w-auto hover:text-neutral-900 dark:hover:text-white"> About </a> </div> <div id="darkToggle" class="relative flex items-center pl-6 ml-4 font-medium tracking-wide cursor-pointer text-neutral-800 group dark:text-white"> <div class="absolute left-0 flex items-center justify-center w-6 h-6 overflow-hidden border-b border-transparent horizon group-hover:border-neutral-600"> <svg class="absolute w-6 h-6 transition duration-700 transform ease" id="sun" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path></svg> <svg class="absolute hidden w-6 h-6 transition duration-700 transform ease" id="moon" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path></svg> </div> <span class="hidden sm:inline-block"> <span id="dayText" class="ml-2">Day mode</span> <span id="nightText" class="hidden ml-2">Night mode</span> </span> </div> </nav> </div> </header> <div class="relative z-20 w-full max-w-7xl mx-auto mt-16 px-7 md:mt-24 lg:mt-32 xl:px-10"> <div class="flex flex-col items-center md:flex-row"> <div class="relative w-full md:w-1/2"> <h1 class="mb-5 text-4xl font-bold leading-tight md:text-5xl lg:text-7xl dark:text-white">
|
||
Hello, I'm Bi.
|
||
</h1> <a href="https://github.com/bishshi" class="inline-flex w-auto px-4 py-2 mt-5 text-xs font-semibold duration-300 ease-out border rounded-full bg-neutral-900 dark:bg-white dark:text-neutral-900 text-neutral-100 hover:border-neutral-700 border-neutral-900 dark:hover:border-neutral-300 hover:bg-white dark:hover:bg-black dark:hover:text-white hover:text-neutral-900"> Follow me on Github </a> </div> <div class="relative justify-end hidden w-full mt-10 md:flex md:pl-10 md:w-1/2 md:mt-0 md:translate-y-4 xl:translate-y-0"> <div class="relative z-50 w-full"> <div class="absolute bottom-0 z-40 w-16 h-16 -translate-x-6 -translate-y-1/2 lg:top-auto top-0 lg:-translate-y-[350px] rounded-full"> <span class="relative z-20 flex items-center justify-center w-full h-full text-2xl border-8 border-white rounded-full dark:border-neutral-950 bg-neutral-100 dark:bg-neutral-900"> <span class="flex items-center justify-center w-full h-full bg-white border border-dashed rounded-full dark:bg-neutral-950 border-neutral-300 dark:border-neutral-700">
|
||
👋
|
||
</span> </span> </div> <div class="relative z-30 px-10"> <img src="/assets/images/photo.png" loading="eager" decoding="auto" class="relative z-30 w-full aspect-[790/1189] md:max-w-lg ml-auto dark:-translate-y-0.5"> </div> <div class="absolute bottom-0 right-0 z-20 w-full h-full lg:h-[450px] translate-x-0 -translate-y-px border border-dashed rounded-2xl bg-gradient-to-r dark:from-neutral-950 dark:via-black dark:to-neutral-950 from-white via-neutral-50 to-white border-neutral-300 dark:border-neutral-700"></div> </div> </div> </div> </div> <div class="relative my-32"> <div class="relative w-full pl-5 overflow-x-hidden md:pl-0"> <div class="absolute w-full h-px bg-gradient-to-r from-transparent to-white md:from-white dark:from-transparent dark:to-neutral-950 md:dark:from-neutral-950 md:via-transparent md:dark:via-transparent md:to-white md:dark:to-neutral-950"></div> <div class="w-full h-px border-t border-dashed border-neutral-300 dark:border-neutral-600"></div> </div> <div class="absolute flex items-center justify-center w-auto h-auto px-3 py-1.5 uppercase tracking-widest space-x-1 text-[0.6rem] md:-translate-x-1/2 -translate-y-1/2 border rounded-full bg-white dark:bg-neutral-900 text-neutral-400 left-0 md:ml-0 ml-5 md:left-1/2 border-neutral-100 dark:border-neutral-800 shadow-sm"> <p class="leading-none">我的项目</p> <div class="flex items-center justify-center w-5 h-5 translate-x-1 border rounded-full border-neutral-100 dark:border-neutral-800"> <svg class="w-3 h-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m0 0l6.75-6.75M12 19.5l-6.75-6.75"></path></svg> </div> </div> </div> <section class="max-w-4xl mx-auto px-7 lg:px-0"> <h2 class="text-2xl font-bold leading-10 tracking-tight text-neutral-900 dark:text-neutral-100">
|
||
My Projects
|
||
</h2> <p class="mb-6 text-base text-neutral-600 dark:text-neutral-400">
|
||
Here are some of my recent projects. I'm always working on something new, so
|
||
check back often!
|
||
</p> <div class="grid items-stretch w-full grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-7 mt-7"> <a href="https://tempmail.best" target="_blank" class="relative flex flex-col items-stretch duration-300 ease-out p-5 sm:p-4 group h-full rounded-3xl w-full"> <span class="absolute inset-0 z-20 block w-full h-full duration-300 ease-out bg-transparent border border-transparent border-dashed group-hover:-translate-x-1 group-hover:-translate-y-1 group-hover:border group-hover:border-neutral-300 dark:group-hover:border-neutral-600 group-hover:border-dashed rounded-3xl group-hover:bg-white dark:group-hover:bg-neutral-950"></span> <span class="absolute inset-0 z-10 block w-full h-full duration-300 ease-out border border-dashed rounded-3xl border-neutral-300 dark:border-neutral-600 group-hover:translate-x-1 group-hover:translate-y-1"></span> <span class="relative z-30 block duration-300 ease-out group-hover:-translate-x-1 group-hover:-translate-y-1"> <span class="block w-full overflow-hidden rounded-xl"> <img src="/assets/images/projects/tempmail.best.png" class="w-full h-auto rounded-xl aspect-[16/9] object-cover transition-transform duration-500 group-hover:scale-105" alt="TempMail.Best"> </span> <span class="block w-full px-1 mt-5 mb-1 sm:mt-4"> <span class="flex items-center mb-1 text-lg font-bold tracking-tight text-neutral-900 dark:text-neutral-100"> <span>TempMail.Best</span> <svg class="group-hover:translate-x-0 group-hover:translate-y-0 -rotate-45 translate-y-1 -translate-x-1 w-3 h-3 stroke-current ml-2 transition-all ease-in-out duration-200 transform" viewBox="0 0 13 15" fill="none" stroke-width="2.4"> <g stroke-linecap="round" stroke-linejoin="round"> <polyline class="transition-all duration-200 ease-out opacity-0 group-hover:opacity-100" points="5.33333333 0 10.8333333 5.5 5.33333333 11"></polyline> <line class="transition-all duration-200 ease-out transform -translate-x-1 opacity-0 group-hover:translate-x-0 group-hover:opacity-100" x1="10.8333333" y1="5.5" x2="0.833333333" y2="5.16666667"></line> </g> </svg> </span> <span class="text-sm text-neutral-600 dark:text-neutral-400 block line-clamp-2 leading-relaxed"> Best Temporary Email. </span> </span> </span> </a><a href="https://dns.surf" target="_blank" class="relative flex flex-col items-stretch duration-300 ease-out p-5 sm:p-4 group h-full rounded-3xl w-full"> <span class="absolute inset-0 z-20 block w-full h-full duration-300 ease-out bg-transparent border border-transparent border-dashed group-hover:-translate-x-1 group-hover:-translate-y-1 group-hover:border group-hover:border-neutral-300 dark:group-hover:border-neutral-600 group-hover:border-dashed rounded-3xl group-hover:bg-white dark:group-hover:bg-neutral-950"></span> <span class="absolute inset-0 z-10 block w-full h-full duration-300 ease-out border border-dashed rounded-3xl border-neutral-300 dark:border-neutral-600 group-hover:translate-x-1 group-hover:translate-y-1"></span> <span class="relative z-30 block duration-300 ease-out group-hover:-translate-x-1 group-hover:-translate-y-1"> <span class="block w-full overflow-hidden rounded-xl"> <img src="/assets/images/projects/dns.surf.png" class="w-full h-auto rounded-xl aspect-[16/9] object-cover transition-transform duration-500 group-hover:scale-105" alt="DNS.Surf"> </span> <span class="block w-full px-1 mt-5 mb-1 sm:mt-4"> <span class="flex items-center mb-1 text-lg font-bold tracking-tight text-neutral-900 dark:text-neutral-100"> <span>DNS.Surf</span> <svg class="group-hover:translate-x-0 group-hover:translate-y-0 -rotate-45 translate-y-1 -translate-x-1 w-3 h-3 stroke-current ml-2 transition-all ease-in-out duration-200 transform" viewBox="0 0 13 15" fill="none" stroke-width="2.4"> <g stroke-linecap="round" stroke-linejoin="round"> <polyline class="transition-all duration-200 ease-out opacity-0 group-hover:opacity-100" points="5.33333333 0 10.8333333 5.5 5.33333333 11"></polyline> <line class="transition-all duration-200 ease-out transform -translate-x-1 opacity-0 group-hover:translate-x-0 group-hover:opacity-100" x1="10.8333333" y1="5.5" x2="0.833333333" y2="5.16666667"></line> </g> </svg> </span> <span class="text-sm text-neutral-600 dark:text-neutral-400 block line-clamp-2 leading-relaxed"> Querying DNS Resolution Results in Different Regions Worldwide. </span> </span> </span> </a><a href="https://html.zone" target="_blank" class="relative flex flex-col items-stretch duration-300 ease-out p-5 sm:p-4 group h-full rounded-3xl w-full"> <span class="absolute inset-0 z-20 block w-full h-full duration-300 ease-out bg-transparent border border-transparent border-dashed group-hover:-translate-x-1 group-hover:-translate-y-1 group-hover:border group-hover:border-neutral-300 dark:group-hover:border-neutral-600 group-hover:border-dashed rounded-3xl group-hover:bg-white dark:group-hover:bg-neutral-950"></span> <span class="absolute inset-0 z-10 block w-full h-full duration-300 ease-out border border-dashed rounded-3xl border-neutral-300 dark:border-neutral-600 group-hover:translate-x-1 group-hover:translate-y-1"></span> <span class="relative z-30 block duration-300 ease-out group-hover:-translate-x-1 group-hover:-translate-y-1"> <span class="block w-full overflow-hidden rounded-xl"> <img src="/assets/images/projects/html.zone.png" class="w-full h-auto rounded-xl aspect-[16/9] object-cover transition-transform duration-500 group-hover:scale-105" alt="HTML.ZONE"> </span> <span class="block w-full px-1 mt-5 mb-1 sm:mt-4"> <span class="flex items-center mb-1 text-lg font-bold tracking-tight text-neutral-900 dark:text-neutral-100"> <span>HTML.ZONE</span> <svg class="group-hover:translate-x-0 group-hover:translate-y-0 -rotate-45 translate-y-1 -translate-x-1 w-3 h-3 stroke-current ml-2 transition-all ease-in-out duration-200 transform" viewBox="0 0 13 15" fill="none" stroke-width="2.4"> <g stroke-linecap="round" stroke-linejoin="round"> <polyline class="transition-all duration-200 ease-out opacity-0 group-hover:opacity-100" points="5.33333333 0 10.8333333 5.5 5.33333333 11"></polyline> <line class="transition-all duration-200 ease-out transform -translate-x-1 opacity-0 group-hover:translate-x-0 group-hover:opacity-100" x1="10.8333333" y1="5.5" x2="0.833333333" y2="5.16666667"></line> </g> </svg> </span> <span class="text-sm text-neutral-600 dark:text-neutral-400 block line-clamp-2 leading-relaxed"> Web Toolbox. </span> </span> </span> </a><a href="https://sink.cool" target="_blank" class="relative flex flex-col items-stretch duration-300 ease-out p-5 sm:p-4 group h-full rounded-3xl w-full"> <span class="absolute inset-0 z-20 block w-full h-full duration-300 ease-out bg-transparent border border-transparent border-dashed group-hover:-translate-x-1 group-hover:-translate-y-1 group-hover:border group-hover:border-neutral-300 dark:group-hover:border-neutral-600 group-hover:border-dashed rounded-3xl group-hover:bg-white dark:group-hover:bg-neutral-950"></span> <span class="absolute inset-0 z-10 block w-full h-full duration-300 ease-out border border-dashed rounded-3xl border-neutral-300 dark:border-neutral-600 group-hover:translate-x-1 group-hover:translate-y-1"></span> <span class="relative z-30 block duration-300 ease-out group-hover:-translate-x-1 group-hover:-translate-y-1"> <span class="block w-full overflow-hidden rounded-xl"> <img src="/assets/images/projects/sink.cool.png" class="w-full h-auto rounded-xl aspect-[16/9] object-cover transition-transform duration-500 group-hover:scale-105" alt="Sink"> </span> <span class="block w-full px-1 mt-5 mb-1 sm:mt-4"> <span class="flex items-center mb-1 text-lg font-bold tracking-tight text-neutral-900 dark:text-neutral-100"> <span>Sink</span> <svg class="group-hover:translate-x-0 group-hover:translate-y-0 -rotate-45 translate-y-1 -translate-x-1 w-3 h-3 stroke-current ml-2 transition-all ease-in-out duration-200 transform" viewBox="0 0 13 15" fill="none" stroke-width="2.4"> <g stroke-linecap="round" stroke-linejoin="round"> <polyline class="transition-all duration-200 ease-out opacity-0 group-hover:opacity-100" points="5.33333333 0 10.8333333 5.5 5.33333333 11"></polyline> <line class="transition-all duration-200 ease-out transform -translate-x-1 opacity-0 group-hover:translate-x-0 group-hover:opacity-100" x1="10.8333333" y1="5.5" x2="0.833333333" y2="5.16666667"></line> </g> </svg> </span> <span class="text-sm text-neutral-600 dark:text-neutral-400 block line-clamp-2 leading-relaxed"> A Simple / Speedy / Secure Link Shortener with Analytics. </span> </span> </span> </a><a href="https://github.com/ccbikai/BroadcastChannel" target="_blank" class="relative flex flex-col items-stretch duration-300 ease-out p-5 sm:p-4 group h-full rounded-3xl w-full"> <span class="absolute inset-0 z-20 block w-full h-full duration-300 ease-out bg-transparent border border-transparent border-dashed group-hover:-translate-x-1 group-hover:-translate-y-1 group-hover:border group-hover:border-neutral-300 dark:group-hover:border-neutral-600 group-hover:border-dashed rounded-3xl group-hover:bg-white dark:group-hover:bg-neutral-950"></span> <span class="absolute inset-0 z-10 block w-full h-full duration-300 ease-out border border-dashed rounded-3xl border-neutral-300 dark:border-neutral-600 group-hover:translate-x-1 group-hover:translate-y-1"></span> <span class="relative z-30 block duration-300 ease-out group-hover:-translate-x-1 group-hover:-translate-y-1"> <span class="block w-full overflow-hidden rounded-xl"> <img src="/assets/images/projects/broadcast-channel.png" class="w-full h-auto rounded-xl aspect-[16/9] object-cover transition-transform duration-500 group-hover:scale-105" alt="BroadcastChannel"> </span> <span class="block w-full px-1 mt-5 mb-1 sm:mt-4"> <span class="flex items-center mb-1 text-lg font-bold tracking-tight text-neutral-900 dark:text-neutral-100"> <span>BroadcastChannel</span> <svg class="group-hover:translate-x-0 group-hover:translate-y-0 -rotate-45 translate-y-1 -translate-x-1 w-3 h-3 stroke-current ml-2 transition-all ease-in-out duration-200 transform" viewBox="0 0 13 15" fill="none" stroke-width="2.4"> <g stroke-linecap="round" stroke-linejoin="round"> <polyline class="transition-all duration-200 ease-out opacity-0 group-hover:opacity-100" points="5.33333333 0 10.8333333 5.5 5.33333333 11"></polyline> <line class="transition-all duration-200 ease-out transform -translate-x-1 opacity-0 group-hover:translate-x-0 group-hover:opacity-100" x1="10.8333333" y1="5.5" x2="0.833333333" y2="5.16666667"></line> </g> </svg> </span> <span class="text-sm text-neutral-600 dark:text-neutral-400 block line-clamp-2 leading-relaxed"> Turn your Telegram Channel into a MicroBlog. </span> </span> </span> </a><a href="https://loooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo.ong" target="_blank" class="relative flex flex-col items-stretch duration-300 ease-out p-5 sm:p-4 group h-full rounded-3xl w-full"> <span class="absolute inset-0 z-20 block w-full h-full duration-300 ease-out bg-transparent border border-transparent border-dashed group-hover:-translate-x-1 group-hover:-translate-y-1 group-hover:border group-hover:border-neutral-300 dark:group-hover:border-neutral-600 group-hover:border-dashed rounded-3xl group-hover:bg-white dark:group-hover:bg-neutral-950"></span> <span class="absolute inset-0 z-10 block w-full h-full duration-300 ease-out border border-dashed rounded-3xl border-neutral-300 dark:border-neutral-600 group-hover:translate-x-1 group-hover:translate-y-1"></span> <span class="relative z-30 block duration-300 ease-out group-hover:-translate-x-1 group-hover:-translate-y-1"> <span class="block w-full overflow-hidden rounded-xl"> <img src="/assets/images/projects/long.png" class="w-full h-auto rounded-xl aspect-[16/9] object-cover transition-transform duration-500 group-hover:scale-105" alt="L(O*62).ONG"> </span> <span class="block w-full px-1 mt-5 mb-1 sm:mt-4"> <span class="flex items-center mb-1 text-lg font-bold tracking-tight text-neutral-900 dark:text-neutral-100"> <span>L(O*62).ONG</span> <svg class="group-hover:translate-x-0 group-hover:translate-y-0 -rotate-45 translate-y-1 -translate-x-1 w-3 h-3 stroke-current ml-2 transition-all ease-in-out duration-200 transform" viewBox="0 0 13 15" fill="none" stroke-width="2.4"> <g stroke-linecap="round" stroke-linejoin="round"> <polyline class="transition-all duration-200 ease-out opacity-0 group-hover:opacity-100" points="5.33333333 0 10.8333333 5.5 5.33333333 11"></polyline> <line class="transition-all duration-200 ease-out transform -translate-x-1 opacity-0 group-hover:translate-x-0 group-hover:opacity-100" x1="10.8333333" y1="5.5" x2="0.833333333" y2="5.16666667"></line> </g> </svg> </span> <span class="text-sm text-neutral-600 dark:text-neutral-400 block line-clamp-2 leading-relaxed"> Make your URL looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonger </span> </span> </span> </a> </div> <div class="flex items-center justify-center w-full py-5"> <a href="/projects" class="inline-flex w-auto px-4 py-2 mt-5 text-xs font-semibold duration-300 ease-out border rounded-full bg-neutral-900 dark:bg-white dark:text-neutral-900 text-neutral-100 hover:border-neutral-700 border-neutral-900 dark:hover:border-neutral-300 hover:bg-white dark:hover:bg-black dark:hover:text-white hover:text-neutral-900"> View All My Projects </a> </div> </section> <div class="relative my-32"> <div class="relative w-full pl-5 overflow-x-hidden md:pl-0"> <div class="absolute w-full h-px bg-gradient-to-r from-transparent to-white md:from-white dark:from-transparent dark:to-neutral-950 md:dark:from-neutral-950 md:via-transparent md:dark:via-transparent md:to-white md:dark:to-neutral-950"></div> <div class="w-full h-px border-t border-dashed border-neutral-300 dark:border-neutral-600"></div> </div> <div class="absolute flex items-center justify-center w-auto h-auto px-3 py-1.5 uppercase tracking-widest space-x-1 text-[0.6rem] md:-translate-x-1/2 -translate-y-1/2 border rounded-full bg-white dark:bg-neutral-900 text-neutral-400 left-0 md:ml-0 ml-5 md:left-1/2 border-neutral-100 dark:border-neutral-800 shadow-sm"> <p class="leading-none">我的博客</p> <div class="flex items-center justify-center w-5 h-5 translate-x-1 border rounded-full border-neutral-100 dark:border-neutral-800"> <svg class="w-3 h-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m0 0l6.75-6.75M12 19.5l-6.75-6.75"></path></svg> </div> </div> </div> <section class="max-w-4xl mx-auto px-7 lg:px-0"> <h2 class="text-2xl font-bold leading-10 tracking-tight text-neutral-900 dark:text-neutral-100">
|
||
My Writings
|
||
</h2> <p class="mb-6 text-base text-neutral-600 dark:text-neutral-400">
|
||
Along with coding I also like to write about life and technology. Here are
|
||
some of my recent posts.
|
||
</p> <div class="w-full max-w-4xl mx-auto my-7 xl:px-0"> <div class="flex flex-col items-start justify-start md:flex-row md:space-x-7"> <div class="w-full md:w-2/3 space-y-7"> <div class="flex items-center justify-center w-full py-5"> <a href="/posts" class="inline-flex w-auto px-4 py-2 mt-5 text-xs font-semibold duration-300 ease-out border rounded-full bg-neutral-900 dark:bg-white dark:text-neutral-900 text-neutral-100 hover:border-neutral-700 border-neutral-900 dark:hover:border-neutral-300 hover:bg-white dark:hover:bg-black dark:hover:text-white hover:text-neutral-900"> View All My Writing </a> </div> </div> <div class="w-full mt-10 md:w-1/3 md:mt-0"> <form method="get" action="https://feed.miantiao.me/" class="p-6 border border-dashed rounded-2xl border-neutral-300 dark:border-neutral-600"> <div class="relative flex items-center space-x-2"> <svg class="flex-none w-6 h-6 text-neutral-700 dark:text-neutral-200" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 7.5h1.5m-1.5 3h1.5m-7.5 3h7.5m-7.5 3h7.5m3-9h3.375c.621 0 1.125.504 1.125 1.125V18a2.25 2.25 0 01-2.25 2.25M16.5 7.5V18a2.25 2.25 0 002.25 2.25M16.5 7.5V4.875c0-.621-.504-1.125-1.125-1.125H4.125C3.504 3.75 3 4.254 3 4.875V18a2.25 2.25 0 002.25 2.25h13.5M6 7.5h3v3H6v-3z"></path></svg> <h2 class="flex text-sm font-semibold text-neutral-900 dark:text-neutral-100">
|
||
Subscribe my blog
|
||
</h2> </div> <p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400">
|
||
Get my blog updates via <a class="font-bold" href="https://feedly.com/i/subscription/feed%2Fhttps%3A%2F%2Ffeed.miantiao.me%2F">Feedly</a>, <a class="font-bold" href="https://www.inoreader.com/feed/https%3A%2F%2Ffeed.miantiao.me%2F">Inoreader</a> or <a class="font-bold" href="https://feed.miantiao.me/">RSS</a>.
|
||
</p> <div class="flex flex-col items-center w-full mt-4 space-y-3"> <input type="url" readonly placeholder="Email address" aria-label="Email address" required="" value="https://feed.miantiao.me/" class="w-full h-10 px-3 text-sm border border-dashed rounded-md focus:ring-0 focus:outline-black border-neutral-400 dark:border-neutral-600 dark:bg-neutral-800 dark:placeholder-neutral-400 dark:text-white"> <button type="submit" class="block w-full px-4 py-2 mt-5 text-xs font-semibold text-center duration-300 ease-out border rounded bg-neutral-900 dark:bg-neutral-100 dark:hover:border-neutral-300 dark:text-neutral-800 dark:hover:bg-neutral-950 dark:hover:text-neutral-100 text-neutral-100 border-neutral-900 hover:bg-white hover:text-neutral-900">Subscribe</button> </div> </form> </div> </div> </div> </section> <section class="text-gray-700 bg-white border-t sm:mt-20 dark:bg-neutral-950 border-neutral-200 dark:border-neutral-800"> <div class="container flex flex-col items-center py-8 mx-auto px-7 max-w-7xl sm:flex-row"> <a href="/" class="h-5 text-base group relative z-30 flex items-center space-x-1.5 text-black dark:text-white font-semibold"> <span class="text-xl -translate-y-0.5 group-hover:-rotate-12 group-hover:scale-[1.2] ease-in-out duration-300">✦</span> <!-- Logo Text --> <span class="-translate-y-0.5"> aria</span> </a> <p class="mt-4 text-sm text-neutral-700 dark:text-neutral-100 sm:ml-4 sm:pl-4 sm:border-l sm:border-neutral-300 dark:sm:border-neutral-700 sm:mt-0">
|
||
© 2026 Aria
|
||
</p> <span class="inline-flex justify-center mt-4 space-x-5 sm:ml-auto sm:mt-0 sm:justify-start"> <a href="https://instagram.com/ccbikai" target="_blank" class="text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white"> <span class="sr-only">Instagram</span> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path fill-rule="evenodd" d="M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z" clip-rule="evenodd"></path></svg> </a> <a href="https://x.com/0xKaiBi" target="_blank" class="text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white"> <span class="sr-only">𝕏</span> <svg class="w-6 h-6 dark:stroke-black stroke-white" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M95 50c0 24.853-20.147 45-45 45S5 74.853 5 50 25.147 5 50 5s45 20.147 45 45Zm-51.21 2.688-21.51-28.76h16.578l14.1 18.855 17.453-18.855h4.872L55.135 45.694l22.72 30.377H61.279L45.967 55.598l-18.95 20.473h-4.873L43.79 52.688Zm-6.73-25.172h-7.616l33.63 44.967h7.616L37.06 27.516Z" fill="currentColor"></path><path d="M22.28 23.928v-.5h-.998l.597.8.4-.3Zm21.51 28.76.366.34.283-.306-.25-.334-.4.3Zm-4.932-28.76.4-.3-.15-.2h-.25v.5Zm14.1 18.855-.4.3.36.48.408-.44-.367-.34Zm17.453-18.855v-.5h-.219l-.148.16.367.34Zm4.872 0 .367.34.777-.84h-1.144v.5ZM55.135 45.694l-.367-.34-.282.306.249.333.4-.3Zm22.72 30.377v.5h.999l-.598-.8-.4.3Zm-16.577 0-.4.3.15.2h.25v-.5ZM45.967 55.598l.4-.3-.36-.48-.407.44.367.34Zm-18.95 20.473v.5h.218l.148-.16-.367-.34Zm-4.873 0-.367-.34-.777.84h1.144v-.5Zm7.3-48.554v-.5h-.998l.598.799.4-.3Zm7.616 0 .4-.3-.15-.2h-.25v.5Zm26.015 44.966-.4.3.15.2h.25v-.5Zm7.615 0v.5h.999l-.598-.8-.4.3ZM50 95.5c25.129 0 45.5-20.371 45.5-45.5h-1c0 24.577-19.923 44.5-44.5 44.5v1ZM4.5 50c0 25.129 20.371 45.5 45.5 45.5v-1C25.423 94.5 5.5 74.577 5.5 50h-1ZM50 4.5C24.871 4.5 4.5 24.871 4.5 50h1C5.5 25.423 25.423 5.5 50 5.5v-1ZM95.5 50C95.5 24.871 75.129 4.5 50 4.5v1c24.577 0 44.5 19.923 44.5 44.5h1ZM21.88 24.228l21.509 28.76.8-.6-21.509-28.76-.8.6Zm16.978-.8H22.28v1h16.578v-1Zm14.501 19.055L39.258 23.63l-.8.599 14.1 18.854.801-.599ZM70.044 23.59 52.592 42.443l.734.68 17.452-18.855-.734-.68Zm5.239-.16H70.41v1h4.872v-1Zm-19.78 22.605L75.65 24.268l-.734-.68-20.148 21.766.734.68Zm22.753 29.738-22.72-30.378-.801.6 22.72 30.377.8-.6Zm-16.978.799h16.578v-1H61.278v1ZM45.566 55.898 60.877 76.37l.801-.599L46.368 55.3l-.802.599ZM27.383 76.41l18.95-20.473-.733-.68-18.95 20.473.733.68Zm-5.239.16h4.872v-1h-4.872v1Zm21.278-24.223L21.777 75.731l.734.68 21.645-23.383-.734-.68ZM29.444 28.017h7.616v-1h-7.616v1Zm34.031 44.166-33.63-44.966-.801.599 33.63 44.966.801-.599Zm7.215-.2h-7.615v1h7.615v-1ZM36.66 27.816l33.63 44.966.8-.599-33.63-44.966-.8.599Z" fill="currentStroke"></path></svg> </a> <a href="https://github.com/ccbikai" target="_blank" class="text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white"> <span class="sr-only">GitHub</span> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path></svg> </a> </span> </div> </section> </body></html> |