index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="keywords" content="Hexo Theme Redefine">
    
    <meta name="author" content="MOXUAN">
    <!-- preconnect -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

    
    <!--- Seo Part-->
    
    <link rel="canonical" href="https://moxuan233.top/"/>
    <meta name="robots" content="index,follow">
    <meta name="googlebot" content="index,follow">
    <meta name="revisit-after" content="1 days">
    
        <meta property="og:type" content="website">
<meta property="og:title" content="Hexo">
<meta property="og:url" content="https://moxuan233.top/index.html">
<meta property="og:site_name" content="Hexo">
<meta property="og:locale" content="zh_CN">
<meta property="article:author" content="John Doe">
<meta name="twitter:card" content="summary">
    
    
    <!--- Icon Part-->
    <link rel="icon" type="image/png" href="https://img.picui.cn/free/2024/07/02/6683906ba8e04.png" sizes="192x192">
    <link rel="apple-touch-icon" sizes="180x180" href="https://img.picui.cn/free/2024/07/02/6683906ba8e04.png">
    <meta name="theme-color" content="#A31F34">
    <link rel="shortcut icon" href="https://img.picui.cn/free/2024/07/02/6683906ba8e04.png">
    <!--- Page Info-->
    
    <title>
        
        MOXUAN&#39;s Blog
    </title>

    
<link rel="stylesheet" href="/fonts/Chillax/chillax.css">


    <!--- Inject Part-->
    

<link rel="stylesheet" href="/css/style.css">


<link rel="stylesheet" href="/assets/build/styles.css">

    
<link rel="stylesheet" href="/fonts/GeistMono/geist-mono.css">

    
<link rel="stylesheet" href="/fonts/Geist/geist.css">

    <!--- Font Part-->
    
    
<script src="/js/libs/anime.min.js"></script>

    
    <script id="hexo-configurations">
    window.config = {"hostname":"moxuan233.top","root":"/","language":"zh-CN"};
    window.theme = {"articles":{"style":{"font_size":"16px","line_height":1.5,"image_border_radius":"14px","image_alignment":"center","image_caption":false,"link_icon":true,"title_alignment":"left","headings_top_spacing":{"h1":"3.2rem","h2":"2.4rem","h3":"1.9rem","h4":"1.6rem","h5":"1.4rem","h6":"1.3rem"}},"word_count":{"enable":true,"count":true,"min2read":true},"author_label":{"enable":true,"auto":false,"list":[]},"code_block":{"copy":true,"style":"mac","font":{"enable":false,"family":null,"url":null}},"toc":{"enable":true,"max_depth":3,"number":false,"expand":true,"init_open":true},"copyright":{"enable":true,"default":"cc_by_nc_sa"},"lazyload":true,"recommendation":{"enable":false,"title":"推荐阅读","limit":3,"mobile_limit":2,"placeholder":"/images/wallhaven-wqery6-light.webp","skip_dirs":[]}},"colors":{"primary":"#A31F34","secondary":null,"default_mode":"light"},"global":{"fonts":{"chinese":{"enable":false,"family":null,"url":null},"english":{"enable":false,"family":null,"url":null}},"content_max_width":"1000px","sidebar_width":"210px","hover":{"shadow":true,"scale":false},"scroll_progress":{"bar":true,"percentage":true},"website_counter":{"url":"https://cn.vercount.one/js","enable":true,"site_pv":true,"site_uv":true,"post_pv":true},"single_page":true,"preloader":true,"open_graph":true,"google_analytics":{"enable":false,"id":null}},"home_banner":{"enable":true,"style":"fixed","image":{"light":"https://img.picui.cn/free/2024/07/02/668387008c8c3.jpeg","dark":"https://img.picui.cn/free/2024/07/02/668387008c8c3.jpeg"},"title":"MOXUAN's Blog","subtitle":{"text":["This is the first message","This is the second message","etc"],"hitokoto":{"enable":false,"api":"https://v1.hitokoto.cn"},"typing_speed":100,"backing_speed":80,"starting_delay":500,"backing_delay":1500,"loop":true,"smart_backspace":true},"text_color":{"light":"#fff","dark":"#d1d1b6"},"text_style":{"title_size":"2.8rem","subtitle_size":"1.5rem","line_height":1.2},"custom_font":{"enable":false,"family":null,"url":null},"social_links":{"enable":true,"style":"default","links":{"github":"https://github.com/F-MO-XUAN","instagram":null,"zhihu":null,"twitter":null,"email":"moxuan0703@outlook.com","bilibili":"https://space.bilibili.com/445659425?spm_id_from=333.1007.0.0"},"qrs":{"weixin":"https://img.picui.cn/free/2024/07/02/66838a7e0f520.jpg","qq":"https://img.picui.cn/free/2024/07/02/66838a7e5723f.jpg"}}},"plugins":{"feed":{"enable":false},"aplayer":{"enable":false,"type":"fixed","audios":[{"name":null,"artist":null,"url":null,"cover":null,"lrc":null}]},"mermaid":{"enable":false,"version":"9.3.0"}},"version":"2.6.4","navbar":{"auto_hide":false,"color":{"left":"#f78736","right":"#367df7","transparency":35},"width":{"home":"1200px","pages":"1000px"},"links":{"Home":{"path":"/","icon":"fa-regular fa-house"},"Friends":{"icon":"fa-duotone fa-user-group","path":"/links/"}},"search":{"enable":false,"preload":true},"tags":{"tags":{"icon":"fa-solid fa-tags","path":"/tags/"}}},"page_templates":{"friends_column":2,"tags_style":"blur"},"home":{"sidebar":{"enable":true,"position":"left","first_item":"menu","announcement":null,"show_on_mobile":true,"links":null},"article_date_format":"auto","categories":{"enable":true,"limit":3},"tags":{"enable":true,"limit":3}},"footerStart":"2022/8/17 11:45:14"};
    window.lang_ago = {"second":"%s 秒前","minute":"%s 分钟前","hour":"%s 小时前","day":"%s 天前","week":"%s 周前","month":"%s 个月前","year":"%s 年前"};
    window.data = {"masonry":false};
  </script>
    
    <!--- Fontawesome Part-->
    
<link rel="stylesheet" href="/fontawesome/fontawesome.min.css">

    
<link rel="stylesheet" href="/fontawesome/brands.min.css">

    
<link rel="stylesheet" href="/fontawesome/solid.min.css">

    
<link rel="stylesheet" href="/fontawesome/regular.min.css">

    
<meta name="generator" content="Hexo 6.3.0"></head>


<body>
<div class="progress-bar-container">
    
        <span class="scroll-progress-bar"></span>
    

        <span class="pjax-progress-bar"></span>
<!--        <span class="swup-progress-icon">-->
<!--            <i class="fa-solid fa-circle-notch fa-spin"></i>-->
<!--        </span>-->
    
</div>


    <style>
    :root {
        --preloader-background-color: #fff;
        --preloader-text-color: #000;
    }

    @media (prefers-color-scheme: dark) {
        :root {
            --preloader-background-color: #202124;
            --preloader-text-color: #fff;
        }
    }

    @media (prefers-color-scheme: light) {
        :root {
            --preloader-background-color: #fff;
            --preloader-text-color: #000;
        }
    }

    @media (max-width: 600px) {
        .ml13 {
            font-size: 2.6rem !important; /* Adjust this value as needed */
        }
    }

    .preloader {
        display: flex;
        flex-direction: column;
        gap: 1rem; /* Tailwind 'gap-4' is 1rem */
        align-items: center;
        justify-content: center;
        position: fixed;
        padding: 12px;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100vw;
        height: 100vh; /* 'h-screen' is 100% of the viewport height */
        background-color: var(--preloader-background-color);
        z-index: 1100; /* 'z-[1100]' sets the z-index */
        transition: opacity 0.2s ease-in-out;
    }

    .ml13 {
        font-size: 3.2rem;
        /* text-transform: uppercase; */
        color: var(--preloader-text-color);
        letter-spacing: -1px;
        font-weight: 500;
        font-family: 'Chillax-Variable', sans-serif;
        text-align: center;
    }

    .ml13 .word {
        display: inline-flex;
        flex-wrap: wrap;
        white-space: nowrap;
    }

    .ml13 .letter {
        display: inline-block;
        line-height: 1em;
    }
</style>

<div class="preloader">
    <h2 class="ml13">
        MOXUAN&#39;s Blog
    </h2>
    <script>
        var textWrapper = document.querySelector('.ml13');
        // Split text into words
        var words = textWrapper.textContent.trim().split(' ');

        // Clear the existing content
        textWrapper.innerHTML = '';

        // Wrap each word and its letters in spans
        words.forEach(function(word) {
            var wordSpan = document.createElement('span');
            wordSpan.classList.add('word');
            wordSpan.innerHTML = word.replace(/\S/g, "<span class='letter'>$&</span>");
            textWrapper.appendChild(wordSpan);
            textWrapper.appendChild(document.createTextNode(' ')); // Add space between words
        });

        var animation = anime.timeline({loop: true})
            .add({
                targets: '.ml13 .letter',
                translateY: [40,0],
                translateZ: 0,
                opacity: [0,1],
                filter: ['blur(5px)', 'blur(0px)'], // Starting from blurred to unblurred
                easing: "easeOutExpo",
                duration: 1400,
                delay: (el, i) => 300 + 30 * i,
            }).add({
                targets: '.ml13 .letter',
                translateY: [0,-40],
                opacity: [1,0],
                filter: ['blur(0px)', 'blur(5px)'], // Ending from unblurred to blurred
                easing: "easeInExpo",
                duration: 1200,
                delay: (el, i) => 100 + 30 * i,
                complete: function() {
                    hidePreloader(); // Call hidePreloader after the animation completes
                }
            });

        let themeStatus = JSON.parse(localStorage.getItem('REDEFINE-THEME-STATUS'))?.isDark;

        // If the theme status is not found in local storage, check the preferred color scheme
        if (themeStatus === undefined || themeStatus === null) {
            if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
                themeStatus = 'dark';
            } else {
                themeStatus = 'light';
            }
        }

        // Now you can use the themeStatus variable in your code
        if (themeStatus) {
            document.documentElement.style.setProperty('--preloader-background-color', '#202124');
            document.documentElement.style.setProperty('--preloader-text-color', '#fff');
        } else {
            document.documentElement.style.setProperty('--preloader-background-color', '#fff');
            document.documentElement.style.setProperty('--preloader-text-color', '#000');
        }

        window.addEventListener('load', function () {
            setTimeout(hidePreloader, 5000); // Call hidePreloader after 5000 milliseconds if not already called by animation
        });

        function hidePreloader() {
            var preloader = document.querySelector('.preloader');
            preloader.style.opacity = '0';
            setTimeout(function () {
                preloader.style.display = 'none';
            }, 200);
        }
    </script>
</div>

<main class="page-container" id="swup">

    
    <style>
        .home-banner-container {
            background: none !important;
        }
        .home-article-item,
        .sidebar-links,
        .sidebar-content,
        a.page-number,
        a.extend,
        .sidebar-links .links:hover,
        .right-bottom-tools,
        footer.footer {
            background-color: var(--background-color-transparent-80) !important;
        }
        .right-bottom-tools:hover,
        a.page-number:hover,
        a.extend:hover {
            background-color: var(--primary-color) !important;
        }
        .site-info,
        .home-article-sticky-label {
            background-color: var(--background-color-transparent-15) !important;
        }
        .home-article-sticky-label {
            backdrop-filter: none !important;
        }
    </style>
    <div class="home-banner-background transition-fade fixed top-0 left-0 w-screen h-screen scale-125 sm:scale-110 box-border will-change-transform bg-cover">
        <img src="https://img.picui.cn/free/2024/07/02/668387008c8c3.jpeg" alt="home-banner-background" class="w-full h-full object-cover dark:hidden">
        <img src="https://img.picui.cn/free/2024/07/02/668387008c8c3.jpeg" alt="home-banner-background" class="w-full h-full object-cover hidden dark:block">
    </div>


<div class="home-banner-container flex justify-center items-center transition-fade relative">
    
    <div class="content mt-8 flex flex-col justify-center items-center">
        <div class="description flex flex-col justify-center items-center w-screen font-medium text-center"
        
        >
            MOXUAN's Blog
            
            
                <p><i id="subtitle"></i></p>
            
        </div>
        
            
            <div class="absolute bottom-0.5 flex flex-row justify-between max-w-[1340px] items-center w-full px-8 sm:px-12">
                <div class="flex p-3 bg-gray-300/50 dark:bg-gray-500/40 backdrop-blur-lg border border-white/20 dark:border-gray-500/30 group rounded-full cursor-pointer flex justify-center items-center aspect-square h-full shadow-redefine-flat hover:shadow-redefine-flat-hover transition-shadow" onclick="scrollToMain()" >
                    <i class="fa-solid fa-arrow-down fa-fw fa-lg group-hover:translate-y-1 transition-transform"></i>
                </div>
                <div class="social-contacts px-6 py-3 bg-gray-300/50 dark:bg-gray-500/40 backdrop-blur-lg border border-white/20 dark:border-gray-500/30 shadow-redefine-flat rounded-full flex flex-row gap-3 items-center">
                    
                        
                                <span class="social-contact-item github">
                                    <a target="_blank" href="https://github.com/F-MO-XUAN">
                                        <i class="fa-brands fa-fw fa-lg fa-github"></i>
                                    </a>
                                </span>
                            
                        
                                <span class="social-contact-item email ">
                                    <a href="mailto:moxuan0703@outlook.com">
                                        <i class="fa-solid fa-fw fa-at fa-lg"></i>
                                    </a>
                                </span>
                            
                        
                                <span class="social-contact-item bilibili">
                                    <a target="_blank" href="https://space.bilibili.com/445659425?spm_id_from=333.1007.0.0">
                                        <i class="fa-brands fa-fw fa-lg fa-bilibili"></i>
                                    </a>
                                </span>
                            
                        
                        <div class="social-links-divider vertical-separator w-[1px] h-4 bg-third-text-color mx-0.5"></div>

                        
                                    <span class="social-contact-item-qr weixin cursor-pointer group">
                                        <a target="_blank">
                                            <i class="fa-brands fa-fw fa-lg fa-weixin"></i>
                                            <div class="social-qr-container absolute h-auto bg-background-color-transparent-40 border border-white/20 dark:border-gray-500/30 overflow-hidden rounded-2xl bottom-0 mb-14 right-0 invisible group-hover:visible opacity-0 group-hover:opacity-100 translate-y-0.5 group-hover:translate-y-0 transition-all">
                                                <img class="social-contacts-qr w-64"
                                                     src="https://img.picui.cn/free/2024/07/02/66838a7e0f520.jpg"/>
                                            </div>
                                        </a>
                                    </span>
                                
                            
                                    <span class="social-contact-item-qr qq cursor-pointer group">
                                        <a target="_blank">
                                            <i class="fa-brands fa-fw fa-lg fa-qq"></i>
                                            <div class="social-qr-container absolute h-auto bg-background-color-transparent-40 border border-white/20 dark:border-gray-500/30 overflow-hidden rounded-2xl bottom-0 mb-14 right-0 invisible group-hover:visible opacity-0 group-hover:opacity-100 translate-y-0.5 group-hover:translate-y-0 transition-all">
                                                <img class="social-contacts-qr w-64"
                                                     src="https://img.picui.cn/free/2024/07/02/66838a7e5723f.jpg"/>
                                            </div>
                                        </a>
                                    </span>
                                
                            
                </div>
            </div>
        
    </div>
    <script>
        const scrollToMain = ()=> {
            console.log('scroll');
            const target = document.querySelector('.main-content-container');
            target.scrollIntoView({ behavior: 'smooth'});
        }
    </script>
</div>
    

    <div class="main-content-container">


        <div class="main-content-header">
            <header class="navbar-container px-6 md:px-12">

    <div class="navbar-content has-home-banner">
        <div class="left">
            
                <a class="logo-image" href="/">
                    <img src="https://img.picui.cn/free/2024/07/02/6683906ba8e04.png">
                </a>
            
            <a class="logo-title" href="/">
                <h1>
                MOXUAN&#39;s Blog
                </h1>
            </a>
        </div>

        <div class="right">
            <!-- PC -->
            <div class="desktop">
                <ul class="navbar-list">
                    
                        
                            <li class="navbar-item">
                                <!-- Menu -->
                                <a class="active"
                                   href="/"
                                        >
                                    <i class="fa-regular fa-house fa-fw"></i>
                                    首页
                                    
                                </a>

                                <!-- Submenu -->
                                
                            </li>
                    
                        
                            <li class="navbar-item">
                                <!-- Menu -->
                                <a class=""
                                   href="/links/"
                                        >
                                    <i class="fa-duotone fa-user-group fa-fw"></i>
                                    友情链接
                                    
                                </a>

                                <!-- Submenu -->
                                
                            </li>
                    
                    
                </ul>
            </div>
            <!-- Mobile -->
            <div class="mobile">
                
                <div class="icon-item navbar-bar">
                    <div class="navbar-bar-middle"></div>
                </div>
            </div>
        </div>
    </div>

    <!-- Mobile sheet -->
    <div class="navbar-drawer h-screen w-full absolute top-0 left-0 bg-background-color flex flex-col justify-between">
        <ul class="drawer-navbar-list flex flex-col px-4 justify-center items-start">
            
                
                    <li class="drawer-navbar-item text-base my-1.5 flex flex-col w-full">
                        
                        <a class="py-1.5 px-2 flex flex-row items-center justify-between gap-1 hover:!text-primary active:!text-primary text-2xl font-semibold group border-b border-border-color hover:border-primary w-full active"
                           href="/"
                        >
                            <span>
                                首页
                            </span>
                            
                                <i class="fa-regular fa-house fa-sm fa-fw"></i>
                            
                        </a>
                        

                    </li>
            
                
                    <li class="drawer-navbar-item text-base my-1.5 flex flex-col w-full">
                        
                        <a class="py-1.5 px-2 flex flex-row items-center justify-between gap-1 hover:!text-primary active:!text-primary text-2xl font-semibold group border-b border-border-color hover:border-primary w-full "
                           href="/links/"
                        >
                            <span>
                                友情链接
                            </span>
                            
                                <i class="fa-duotone fa-user-group fa-sm fa-fw"></i>
                            
                        </a>
                        

                    </li>
            

        </ul>

        <div class="statistics flex justify-around my-2.5">
    <a class="item tag-count-item flex flex-col justify-center items-center w-20" href="/tags">
        <div class="number text-2xl sm:text-xl text-second-text-color font-semibold">1</div>
        <div class="label text-third-text-color text-sm">标签</div>
    </a>
    <a class="item tag-count-item flex flex-col justify-center items-center w-20" href="/categories">
        <div class="number text-2xl sm:text-xl text-second-text-color font-semibold">0</div>
        <div class="label text-third-text-color text-sm">分类</div>
    </a>
    <a class="item tag-count-item flex flex-col justify-center items-center w-20" href="/archives">
        <div class="number text-2xl sm:text-xl text-second-text-color font-semibold">1</div>
        <div class="label text-third-text-color text-sm">文章</div>
    </a>
</div>
    </div>

    <div class="window-mask"></div>

</header>


        </div>

        <div class="main-content-body">

            
                <div class="home-sidebar-container">
    <div class="sticky-container sticky">
        
        
            <div class="sidebar-content" >
                <div class="avatar flex justify-center">
    <img src="https://img.picui.cn/free/2024/07/02/6683848eac89d.jpg">
</div>
                <div class="author flex flex-col justify-center my-2.5 mx-0">
    <div class="name">MOXUAN</div>
    
        <div class="label">Lv1</div>
    
</div>
                <div class="statistics flex justify-around my-2.5">
    <a class="item tag-count-item flex flex-col justify-center items-center w-20" href="/tags">
        <div class="number text-2xl sm:text-xl text-second-text-color font-semibold">1</div>
        <div class="label text-third-text-color text-sm">标签</div>
    </a>
    <a class="item tag-count-item flex flex-col justify-center items-center w-20" href="/categories">
        <div class="number text-2xl sm:text-xl text-second-text-color font-semibold">0</div>
        <div class="label text-third-text-color text-sm">分类</div>
    </a>
    <a class="item tag-count-item flex flex-col justify-center items-center w-20" href="/archives">
        <div class="number text-2xl sm:text-xl text-second-text-color font-semibold">1</div>
        <div class="label text-third-text-color text-sm">文章</div>
    </a>
</div>
            </div>
        

    </div>
</div>

            
            <div class="main-content">

                
                    <div class="home-content-container">
    <ul class="home-article-list">
        
            <li class="home-article-item">

                
                <div class="flex flex-col gap-5 px-7 pb-7 pt-7">
                    <h3 class="home-article-title">
                        <a href="/2024/07/02/My-New-Post/">
                            生日前夕
                        </a>
                    </h3>

                    <div class="home-article-content markdown-body">
                        
                            <p>##时光飞逝，我很快也将迎来人生中唯一的18岁<br>此外 这也是一个测试文本</p>
                        
                    </div>

                    <div class="home-article-meta-info-container">
    <div class="home-article-meta-info">
        <span><i class="fa-solid fa-calendars"></i>&nbsp;
            <span class="home-article-date" data-date="Tue Jul 02 2024 14:13:10 GMT+0800">
                
                    2024-07-02
                
            </span>
        </span>
        
        
            <span class="home-article-tag">
                <i class="fa-solid fa-tags"></i>&nbsp;
                <ul>
                    
                        <li>
                            
                            <a href="/tags/TEXT/">TEXT</a>&nbsp;
                        </li>
                    
                </ul>
            </span>
        
    </div>

    <a href="/2024/07/02/My-New-Post/">阅读全文<span class="seo-reader-text">生日前夕</span>&nbsp;<i class="fa-solid fa-angle-right"></i></a>
</div>

                </div>
            </li>
        
    </ul>

    <div class="home-paginator px-7 py-5">
        <div class="paginator">
    <span class="page-number current">1</span>
</div>

    </div>
</div>

                    <div class="comment-container pjax"></div>
                

            </div>

            
        </div>

        <div class="main-content-footer">
            <footer class="footer mt-5 py-5 h-auto text-base text-third-text-color relative border-t-2 border-t-border-color">
    <div class="info-container py-3 text-center">
        
        <div class="text-center">
            &copy;
            
              <span>2022</span>
              -
            
            2024&nbsp;&nbsp;<i class="fa-solid fa-heart fa-beat" style="--fa-animation-duration: 0.5s; color: #f54545"></i>&nbsp;&nbsp;<a href="/">MOXUAN</a>
            
                
                <p class="post-count space-x-0.5">
                    <span>
                        共 1 篇文章
                    </span>
                    
                        <span>
                            共 30 字
                        </span>
                    
                </p>
            
        </div>
        
            <script data-swup-reload-script src="https://cn.vercount.one/js"></script>
            <div class="relative text-center lg:absolute lg:right-[20px] lg:top-1/2 lg:-translate-y-1/2 lg:text-right">
                
                    <span id="busuanzi_container_site_uv" class="lg:!block">
                        <span class="text-sm">访问人数</span>
                        <span id="busuanzi_value_site_uv"></span>
                    </span>
                
                
                    <span id="busuanzi_container_site_pv" class="lg:!block">
                        <span class="text-sm">总访问量</span>
                        <span id="busuanzi_value_site_pv"></span>
                    </span>
                
            </div>
        
        <div class="relative text-center lg:absolute lg:left-[20px] lg:top-1/2 lg:-translate-y-1/2 lg:text-left">
            <span class="lg:block text-sm">由 <?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="relative top-[2px] inline-block align-baseline" version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="1rem" height="1rem" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"><path fill="#0E83CD" d="M256.4,25.8l-200,115.5L56,371.5l199.6,114.7l200-115.5l0.4-230.2L256.4,25.8z M349,354.6l-18.4,10.7l-18.6-11V275H200v79.6l-18.4,10.7l-18.6-11v-197l18.5-10.6l18.5,10.8V237h112v-79.6l18.5-10.6l18.5,10.8V354.6z"/></svg><a target="_blank" class="text-base" href="https://hexo.io">Hexo</a> 驱动</span>
            <span class="text-sm lg:block">主题&nbsp;<a class="text-base" target="_blank" href="https://github.com/EvanNotFound/hexo-theme-redefine">Redefine v2.6.4</a></span>
        </div>
        
        
            <div>
                博客已运行 <span class="odometer" id="runtime_days" ></span> 天 <span class="odometer" id="runtime_hours"></span> 小时 <span class="odometer" id="runtime_minutes"></span> 分钟 <span class="odometer" id="runtime_seconds"></span> 秒
            </div>
        
        
            <script data-swup-reload-script>
                try {
                    function odometer_init() {
                    const elements = document.querySelectorAll('.odometer');
                    elements.forEach(el => {
                        new Odometer({
                            el,
                            format: '( ddd).dd',
                            duration: 200
                        });
                    });
                    }
                    odometer_init();
                } catch (error) {}
            </script>
        
        
    </div>  
</footer>
        </div>
    </div>

    
    <div class="right-side-tools-container">
        <div class="side-tools-container">
    <ul class="hidden-tools-list">
        <li class="right-bottom-tools tool-font-adjust-plus flex justify-center items-center">
            <i class="fa-regular fa-magnifying-glass-plus"></i>
        </li>

        <li class="right-bottom-tools tool-font-adjust-minus flex justify-center items-center">
            <i class="fa-regular fa-magnifying-glass-minus"></i>
        </li>

        <li class="right-bottom-tools tool-dark-light-toggle flex justify-center items-center">
            <i class="fa-regular fa-moon"></i>
        </li>

        <!-- rss -->
        

        <li class="right-bottom-tools tool-scroll-to-bottom flex justify-center items-center">
            <i class="fa-regular fa-arrow-down"></i>
        </li>
    </ul>

    <ul class="visible-tools-list">
        <li class="right-bottom-tools toggle-tools-list flex justify-center items-center">
            <i class="fa-regular fa-cog fa-spin"></i>
        </li>
        
            <li class="right-bottom-tools tool-scroll-to-top flex justify-center items-center">
                <i class="arrow-up fas fa-arrow-up"></i>
                <span class="percent"></span>
            </li>
        
        
    </ul>
</div>

    </div>

    <div class="image-viewer-container">
    <img src="">
</div>


</main>


<script src="/js/libs/Swup.min.js"></script>

<script src="/js/libs/SwupSlideTheme.min.js"></script>

<script src="/js/libs/SwupScriptsPlugin.min.js"></script>

<script src="/js/libs/SwupProgressPlugin.min.js"></script>

<script src="/js/libs/SwupScrollPlugin.min.js"></script>

<script src="/js/libs/SwupPreloadPlugin.min.js"></script>

<script>
    const swup = new Swup({
        plugins: [
            new SwupScriptsPlugin({
                optin: true,
            }),
            new SwupProgressPlugin(),
            new SwupScrollPlugin({
                offset: 80,
            }),
            new SwupSlideTheme({
                mainElement: ".main-content-body",
            }),
            new SwupPreloadPlugin(),
        ],
        containers: ["#swup"],
    });
</script>


<script src="/js/tools/imageViewer.js" type="module"></script>

<script src="/js/utils.js" type="module"></script>

<script src="/js/main.js" type="module"></script>

<script src="/js/layouts/navbarShrink.js" type="module"></script>

<script src="/js/tools/scrollTopBottom.js" type="module"></script>

<script src="/js/tools/lightDarkSwitch.js" type="module"></script>

<script src="/js/layouts/categoryList.js" type="module"></script>


<script src="/js/tools/codeBlock.js" type="module"></script>


<script src="/js/layouts/lazyload.js" type="module"></script>


<script src="/js/tools/runtime.js"></script>

    
<script src="/js/libs/odometer.min.js"></script>

    
<link rel="stylesheet" href="/assets/odometer-theme-minimal.css">


<script src="/js/libs/Typed.min.js"></script>

  
<script src="/js/plugins/typed.js" type="module"></script>


<div class="post-scripts" data-swup-reload-script>
    
        
<script src="/js/tools/tocToggle.js" type="module"></script>

<script src="/js/layouts/toc.js" type="module"></script>

<script src="/js/plugins/tabs.js" type="module"></script>

    
</div>


</body>
</html>