Wcowin/Mkdocs-Wcowin
1
0
Fork 0
mirror of https://github.com/Wcowin/Mkdocs-Wcowin.git synced 2025-07-20 00:46:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

25/6/16

Browse Source
This commit is contained in:
Wcowin 2025-06-16 00:24:27 +08:00
parent 0b1f8e3349
commit a1279dff44
7 changed files with 650 additions and 769 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.ai_cache/service_config.json
View File

@ -6,5 +6,5 @@
"gemini"
],
"summary_language": "zh",
"check_time": "2025-06-15T19:33:08.224030"
"check_time": "2025-06-16T00:04:24.761359"
}

2
.cache/plugin/git-committers/page-authors.json
View File

@ -1 +1 @@
{"cache_date": "2025-06-15", "page_authors": {}}
{"cache_date": "2025-06-16", "page_authors": {}}

578
docs/about/assets/stylesheets/portfolio.css
View File

@ -1,578 +0,0 @@
:root {
--header-height: 3rem;
/*========== Colors ==========*/
--first-color: #608DBD;
--first-color-second: #608DBD;
--first-color-alt: #608DBD;
--first-color-lighter: #608DBD;
--title-color: #608DBD;
--text-color: #080505;
--text-color-light: #f5ab17;
--input-color: #F5EEE3;
--body-color: #FDFBF8;
--container-color: #FFFFFF;
/*========== Font and typography ==========*/
--big-font-size: 2rem;
--h1-font-size: 1.5rem;
--h2-font-size: 1.25rem;
--h3-font-size: 1.125rem;
--normal-font-size: .938rem;
--small-font-size: .813rem;
--smaller-font-size: .75rem;
/*========== Font weight ==========*/
--font-medium: 500;
--font-semi-bold: 600;
/*========== Margenes Bottom ==========*/
--mb-0-25: .25rem;
--mb-0-5: .5rem;
--mb-0-75: .75rem;
--mb-1: 1rem;
--mb-1-5: 1.5rem;
--mb-2: 2rem;
--mb-2-5: 2.5rem;
--mb-3: 3rem;
/*========== z index ==========*/
--z-tooltip: 10;
--z-fixed: 100;
--z-modal: 1000;
}
/* Font size for large devices */
@media screen and (min-width: 968px) {
:root {
--big-font-size: 3rem;
--h1-font-size: 2.25rem;
--h2-font-size: 1.5rem;
--h3-font-size: 1.25rem;
--normal-font-size: 1rem;
--small-font-size: .875rem;
--smaller-font-size: .813rem;
}
}
/*==================== BASE ====================*/
* {
box-sizing: border-box;
padding: 0;
margin: 0;
}
html {
scroll-behavior: smooth;
}
h1, h2, h3, h4 {
color: var(--title-color);
font-weight: var(--font-semi-bold);
}
/*==================== REUSABLE CSS CLASSES ====================*/
.section__title {
font-size: var(--h1-font-size);
color: var(--title-color);
}
.section__subtitle {
display: block;
font-size: var(--small-font-size);
margin-bottom: var(--mb-3);
}
.section__title,
.section__subtitle {
text-align: center;
}
/*==================== LAYOUT ====================*/
.container {
max-width: 768px;
margin-left: var(--mb-1-5);
margin-right: var(--mb-1-5);
}
.grid {
display: grid;
gap: 1.5rem;
}
.header {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
z-index: var(--z-fixed);
background-color: var(--body-color);
}
/*==================== HOME ====================*/
.home__container {
gap: 1rem;
}
.home__content{
grid-template-columns: .5fr 3fr;
padding-top: 3.5rem;
align-items: center;
}
.home__social{
grid-template-columns: max-content;
row-gap: 1rem;
}
.home__social-icon{
font-size: 1.25rem;
}
.home__social-icon:hover {
color: var(--first-color-alt);
}
.home__title{
font-size: var(--big-font-size);
}
.home__subtitle{
margin-bottom: var(--h3-font-size);
color: var(--text-color);
font-weight: var(--font-medium);
margin-bottom: var(--mb-0-75);
}
.home__description{
margin-bottom: var(--mb-2);
}
/*==================== BUTTONS ====================*/
.button{
display: inline-block;
background-color: var(--first-color-alt);
color: #fff;
padding: 1rem;
border-radius: .5rem;
font-weight: var(--font-medium);
}
.button:hover {
background-color: var(--first-color-alt);
}
.button__icon{
font-size: 1.25rem;
margin-right: var(--mb-0-5);
transition: .3s;
color: #FFF;
}
.button--flex{
display: inline-flex;
align-items: center;
}
.button--small{
padding: .75rem 1rem;
}
.button--link{
padding: 0;
background-color: transparent;
color: var(--first-color);
}
.button--link:hover {
background-color: transparent;
color: var(--first-color-alt);
}
/*==================== ABOUT ====================*/
.about__img{
width: 400px;
border-radius: .5rem;
justify-self: center;
align-self: center;
}
.about__description{
text-align: center;
margin-bottom: var(--mb-2-5);
}
.about__info{
display: flex;
justify-content: space-evenly;
margin-bottom: var(--mb-2-5);
}
.about__info-title{
font-size: var(--h2-font-size);
font-weight: var(--font-semi-bold);
color: var(--title-color);
}
.about__info-name{
font-size: var(--smaller-font-size);
}
.about__info-title,
.about__info-name{
display: block;
text-align: center;
}
.about__buttons{
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
}
/*==================== SKILLS ====================*/
.skills__container{
row-gap: 0;
}
.skills__header{
display: flex;
align-items: center;
margin-bottom: var(--mb-2-5);
cursor: pointer;
}
.skills__icon,
.skills__arrow{
font-size: 2rem;
color: var(--md-primary-fg-color);
}
.skills__icon{
margin-right: var(--mb-0-75);
}
.skills__title{
font-size: var(--h3-font-size);
}
.skills_subtitle{
font-size: var(--small-font-size);
color: var(--text-color-light);
}
.skills__arrow{
margin-left: auto;
transition: .4s;
}
.skills__list{
row-gap: 1.5rem;
padding-left: 2.7rem;
}
.skills__titles{
display: flex;
justify-content: space-between;
margin-bottom: var(--mb-0-5);
}
.skills__name{
font-size: var(--normal-font-size);
font-weight: var(--font-medium);
}
.skills__number{
margin-top: var(--mb-2-5);
}
.skills__bar,
.skills__percentage{
height: 5px;
border-radius: .25rem;
}
.skills__bar{
background-color: var(--first-color-lighter);
}
.skills__percentage{
display: block;
background-color: var(--first-color);
}
.skills__fastapi{
width: 90%;
}
.skills__django{
width: 85%;
}
.skills__flask{
width: 75%;
}
.skills__spring{
width: 75%;
}
.skills__androidjava{
width: 70%;
}
.skills__androidkotlin{
width: 60%;
}
.skills__flutter{
width: 60%;
}
.skills__aws{
width: 80%;
}
.skills__azure{
width: 75%;
}
.skills__oc{
width: 70%;
}
.skills__cicd{
width: 75%;
}
.skills__close .skills__list{
height: 0;
/* overflow: hidden; */
/* overflow: visible; */
}
.skills__open .skills__list{
height: max-content;
margin-bottom: var(--mb-2-5);
}
.skills__open .skills__arrow{
transform: rotate(-180deg);
}
/*==================== QUALIFICATION ====================*/
.qualification__tabs{
display: flex;
justify-content: space-evenly;
margin-bottom: var(--mb-2);
}
.qualification__button{
font-size: var(--h3-font-size);
font-weight: var(--font-medium);
cursor: pointer;
}
.qualification__button:hover {
color: var(--first-color);
}
.qualification__icon{
font-size: 1.8rem;
margin-right: var(--mb-0-25);
}
.qualification__data{
display: grid;
grid-template-columns: 1.5fr max-content 1.5fr;
column-gap: 1.5rem;
}
.qualification__title{
font-size: var(--normal-font-size);
font-weight: var(--font-medium);
}
.qualification__subtitle{
display: inline-block;
font-size: var(--smaller-font-size);
margin-bottom: var(--mb-1);
}
.qualification__calendar{
font-size: var(--smaller-font-size);
color: var(--md-primary-fg-color--dark);
}
.qualification__rounder{
display: inline-block;
width: 13px;
height: 13px;
background-color: var(--md-primary-fg-color);
border-radius: 50%;
}
.qualification__line{
display: block;
width: 1px;
height: 100%;
background-color: var(--md-primary-fg-color);
transform: translate(6px, -7px);
}
.qualification [data-content]{
display: none;
}
.qualification__active[data-content]{
display: block;
}
.qualification__button.qualification__active{
color: var(--first-color);
}
/*==================== MEDIA QUERIES ====================*/
/* For small devices */
@media screen and (max-width: 350px){
.container{
margin-left: var(--mb-1);
margin-right: var(--mb-1);
}
.home__content{
grid-template-columns: .25fr 3fr;
}
.home__blob{
width: 180px;
}
.skills__title{
font-size: var(--normal-font-size);
}
.qualification__data{
gap: .5rem;
}
}
/* For medium devices */
@media screen and (min-width: 568px){
.home__content{
grid-template-columns: max-content 1fr 1fr;
}
.home__data{
grid-column: initial;
}
.home__img{
order: 1;
justify-self: center;
}
.skills__container,
.about__container,
.portfolio__content,
.project__container{
grid-template-columns: repeat(2, 1fr);
}
.qualification__sections{
display: grid;
grid-template-columns: 6fr;
justify-content: center;
}
}
@media screen and (min-width: 768px){
.container{
margin-left: auto;
margin-right: auto;
}
body{
margin: 0;
}
.section{
padding: 6rem 0 2rem;
}
.section__subtitle{
margin-bottom: 4rem;
}
.header{
top: 0;
bottom: initial;
}
.header,
.main{
padding: 0 1rem;
}
.home__container{
row-gap: 5rem;
}
.home__content{
padding-top: 5.5rem;
column-gap: 2rem;
}
.home__blob{
width: 270px;
}
.home__scroll{
display: block;
}
.home__scroll-button{
margin-left: 3rem;
}
.about__container{
column-gap: 5rem;
}
.about__img{
width: 350px;
}
.about__description{
text-align: initial;
}
.about__info{
justify-content: space-between;
}
.about__buttons{
justify-content: initial;
}
.qualification__tabs{
justify-content: center;
}
.qualification__button{
margin: 0 var(--mb-1);
}
.qualification__sections{
grid-template-columns: .5fr;
}
}
/* For large devices */
@media screen and (min-width: 1024px){
.header,
.main{
padding: 0;
}
.home__blob{
width: 320px;
}
.home__social{
transform: translateX(-6rem);
}
.qualification__sections{
display: grid;
grid-template-columns: 6fr;
justify-content: center;
}
}

213
docs/about/geren.md
View File

@ -21,7 +21,7 @@ status: new
<div class="flip-container">
<div class="flip-container">
<div class="image-container">
<img src="https://free.wmhua.cn/2025/05/09/681d7016db8dc.png" alt="Back Image">
<img src="https://free.wmhua.cn/2025/05/09/681d7015ed864.jpeg" alt="Front Image">
@ -30,8 +30,8 @@ status: new
<style>
.flip-container {
position: relative;
width: 290px;
height: 290px;
width: 280px;
height: 280px;
margin: 10px auto;
display: flex;
align-items: flex-start;
@ -78,6 +78,7 @@ status: new
</style>
<!-- <center>
![](https://picx.zhimg.com/v2-fb22186d2490043435a72876950492f5_1440w.jpg#only-light){style="width: 270px; border-radius: 50%;"}
@ -87,150 +88,18 @@ status: new
</center> -->
<!-- <p style="text-align: center; font-size: 35px; "><strong>A college student in Chongqing</strong></p> -->
<center><font size=6 color= #757575>
观史知今，当思进退，读书明志可识春秋
<br>
<center><font size=6rem color= #757575>
观史知今，当思进退，读书明志，可识春秋
<br>
——Wcowin </font></center>
---
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js"></script>
<link rel="stylesheet" href="../sty/portfolio.css">
</head>
<body>
<main class="main">
<section class="about section" id="about">
<div class="about__container container">
<div class="about__data">
<p style="text-align: center;"></p>
<div class="about__info">
<div>
<span class="about__info-title">1年+</span>
<span class="about__info-name">工作经验</span>
</div>
<div>
<a href="https://github.com/Wcowin" target="_blank">
<span class="about__info-title">3项+</span>
<span class="about__info-name">完成的项目</span>
</a>
</div>
<div>
<span class="about__info-title">2个+</span>
<span class="about__info-name">贡献的开源</span>
</div>
</div>
</div> <!-- 闭合 about__data -->
</div> <!-- 闭合 about__container -->
</section>
</main> <!-- 闭合 main -->
</body>
</html>
<!-- <center>
[下载简历 :fontawesome-solid-download:](个人简历2.pdf){.md-button target="_blank"}
</center> -->
<center>
<a href="../个人简历.pdf" target="_blank" class="md-button">下载简历</a>
</center>
<!-- <div class="card2 file-block" markdown="1">
<div class="file-icon"><img src="https://pic4.zhimg.com/80/v2-98f918276ecbc6d549fa6a5d1238e713_1440w.webp" style="height: 3em;"></div>
<div class="file-body">
<div class="file-title">个人简历</div>
<div class="file-meta">2025-02-14</div>
</div>
<a class="down-button" target="_blank" href="../个人简历.pdf" markdown="1">:fontawesome-solid-download: 下载</a>
</div> -->
---
## 我的履历
<section class="qualification section">
<div class="qualification__container container">
<div class="qualification__tabs">
<div class="qualification__button button--flex qualification__active" data-target='#education'>
<iconify-icon icon="fluent:hat-graduation-12-regular" class="qualification__icon"></iconify-icon>
来时路
</div>
</div>
<div class="qualification__sections">
<!-- 教育经历时间线 -->
<div class="qualification__content qualification__active" data-content id="education">
<!-- 时间线项目 -->
<div class="qualification__data">
<div>
<h3 class="qualification__title">漯河高中</h3>
<span class="qualification__subtitle">平凡的三年</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">2018 - 2021</span>
</div>
</div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
</div>
<div class="qualification__data">
<div></div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
<div>
<h3 class="qualification__title">CTBU</h3>
<span class="qualification__subtitle">电子信息工程专业学士</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">2021 - 2025</span>
</div>
</div>
</div>
<div class="qualification__data">
<div>
<h3 class="qualification__title">家里蹲大学</h3>
<span class="qualification__subtitle">密码学硕士研究生</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">2026 - 2029</span>
</div>
</div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
</div>
<div class="qualification__data">
<div></div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
<div>
<h3 class="qualification__title">未完待续</h3>
<span class="qualification__subtitle">于道各努力，千里自同风</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">Before - After</span>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<HR style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#608DBD,direction:145,strength:15)" width="100%" color=#608DBD SIZE=1>
</center>
## 个人简介
@ -241,9 +110,9 @@ status: new
!!! pied-piper1 "About me"
- [x] Hey, I'm [Wcowin](https://wcowin.work/VitePress/){target=“_blank”}~
- [x] 咖啡重度爱好者
- [x] 热爱(xiā)折腾技术/Math，目前的研究领域是[密码学](https://wcowin.work/blog/Cryptography/)
- [x] 读书明志可识春秋;诗词爱好者;喜欢村上春树;擅长羽毛球
- [x] 清醒，知趣，明得失，知进退
- [x] 热爱(xiā)折腾技术/数学，目前的研究领域是[密码学](https://wcowin.work/blog/Cryptography/)
- [x] 读书明志;诗词爱好者;喜欢村上春树;擅长羽毛球
- [x] 清醒知趣，明得失，知进退
## 人生态度
@ -342,38 +211,24 @@ status: new
## 联系我
=== "💬 微信"
<div style="text-align: center; padding: 0px;">
<div style="display: inline-block; padding: 20px; border-radius: 20px; background: linear-gradient(135deg,rgba(68,138,255,.1));transition: transform 0.3s;"
onmouseover="this.style.transform='scale(1.03)'" onmouseout="this.style.transform='scale(1)'">
<img src="https://picx.zhimg.com/80/v2-540df18f16032fbe114dd960da21b467_1440w.webp"
style="width: 280px; height: auto; border-radius: 12px; border: 3px solid white;">
</div>
<br><br>
<p style="font-size: 16px; color: var(--md-default-fg-color--light); margin-top: 15px;">
📱 扫一扫上面的二维码，加我为好友
</p>
</div>
<center>
<img src="https://picx.zhimg.com/80/v2-540df18f16032fbe114dd960da21b467_1440w.webp" style="width: 280px; height: auto; border-radius: 12px; border: 3px solid white;">
<br>
扫一扫上面的二维码图案<br>
加我为朋友
</center>
=== "📧 邮箱"
<div style="text-align: center; padding: 0px 0px;">
<div style="margin-bottom: 15px;">
<h3 style="color: var(--md-primary-fg-color); margin-bottom: 10px;">
✉️ 邮件联系
</h3>
</div>
<a href="mailto:wangkewen821@gmail.com" class="md-button md-button--primary"
style="font-size: 16px; padding: 12px 30px; border-radius: 25px;">
:fontawesome-solid-paper-plane: &nbsp; 发送电子邮件
</a>
<div style="margin-top: 20px;">
<p style="font-size: 14px; color: var(--md-default-fg-color--lighter);">
📬 邮箱地址：<code>wangkewen821@gmail.com</code>
</p>
<p style="font-size: 16px; color: var(--md-default-fg-color--light); margin-bottom: 20px;">
有项目合作或技术问题？随时发邮件给我！
</p>
<p style="font-size: 13px; color: var(--md-default-fg-color--lighter); margin-top: 5px;">
💡 一般在 24 小时内 回复，请耐心等待
<p style="font-size: 20px; color: #757575; margin-top: 5px;">
💡24小时内回复，请耐心等待
</p>
</div>
</div>
@ -381,21 +236,15 @@ status: new
=== "🌐 社交"
<div style="text-align: center; padding: 0px 0px;">
<div style="margin-bottom: 30px;">
<h3 style="color: var(--md-primary-fg-color); margin-bottom: 20px;">
🤝🏻社交媒体
</h3>
<p style="font-size: 16px; color: var(--md-default-fg-color--light); margin-bottom: 20px;">
关注我的社交媒体，获取最新动态
</p>
</div>
<div style="display: flex; justify-content: center; gap: 20px; flex-wrap: wrap;">
<a href="https://t.me/Wcowin" class="md-button md-button--primary"
style="display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 25px; background: linear-gradient(135deg, #0088cc, #0066aa); color: white; transition: all 0.3s;"
style="display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 25px; background: linear-gradient(#5E92C6); color: white; transition: all 0.3s;"
onmouseover="this.style.transform='scale(1.05)'" onmouseout="this.style.transform='scale(1)'" target="_blank">
:fontawesome-brands-telegram: Telegram
</a>
<a href="https://twitter.com/wcowin_" class="md-button md-button--primary"
style="display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 25px; background: linear-gradient(135deg, #1da1f2, #0d8bd9); color: white; transition: all 0.3s;"
style="display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 25px; background: linear-gradient(#5E92C6); color: white; transition: all 0.3s;"
onmouseover="this.style.transform='scale(1.05)'" onmouseout="this.style.transform='scale(1)'" target="_blank">
:fontawesome-brands-twitter: Twitter
</a>
@ -407,11 +256,8 @@ status: new
=== "📍 其他"
<div style="text-align: center; padding: 0px 0px;">
<div style="margin-bottom: 30px;">
<h3 style="color: var(--md-primary-fg-color); margin-bottom: 10px; font-weight: 600;">
📍 其他平台联系
</h3>
<p style="font-size: 15px; color: var(--md-default-fg-color--light);">
欢迎通过下列平台了解我的更多工作和项目经历
通过下列平台了解我的更多工作和项目经历
</p>
</div>
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; max-width: 700px; margin: 0 auto;">
@ -439,7 +285,7 @@ status: new
<!-- 底部强调卡片 -->
<div style="margin-top: 40px; padding: 20px; border-radius: 12px; background: linear-gradient(135deg, var(--md-primary-fg-color--light), var(--md-primary-fg-color)); color: white; box-shadow: 0 6px 15px rgba(0,0,0,0.1);">
<p style="margin: 0; font-size: 16px; font-weight: 600;">
🚀 随时欢迎联系我，开启合作或交流！
随时欢迎联系我合作或交流！
</p>
<p style="margin: 10px 0 0 0; font-size: 14px; opacity: 0.9;">
无论是技术探讨、学习交流还是职业机会，我都乐意听见你的声音 😄
@ -461,14 +307,7 @@ status: new
如果给我发[邮件](mailto:<wangkewen821@gmail.com>)，或者通过右下角微信添加好友，请写上您的**真名实姓**。对于那些不知来路、上来就问问题的微信和邮件，我通常会**直接忽略**，谢谢。
---
<center>[发送电子邮件 :fontawesome-solid-paper-plane:](mailto:<wcowin@qq.com>){.md-button}</center>
<!-- 我的电话号码`SHA256`码：DEF633030D31F7ABE6213EE5B5EFDF0E4ADDFDA121695325660D82F15ED22946 -->
<!-- <chat-bot platform_id="d19a99ed-b684-4d64-8c70-7663d974af17" user_id="325b3ae2-0317-4c5f-9f9b-c4ce0e51e36b" chatbot_id="8eedef48-41ef-4f78-97d9-71e8197a452d"><a href="https://www.chatsimple.ai/?utm_source=widget&utm_medium=referral">[chatbot]</a></chat-bot><script src="https://cdn.chatsimple.ai/chat-bot-loader.js" defer></script> -->
<!-- <script src="//code.tidio.co/6jmawe9m5wy4ahvlhub2riyrnujz7xxi.js" async></script> -->
<center>
[发送电子邮件 :fontawesome-solid-paper-plane:](mailto:<wcowin@qq.com>){.md-button}
</center>

147
docs/about/sty/portfolio.css
View File

@ -0,0 +1,147 @@
:root {
/*========== Colors ==========*/
--first-color: #608DBD;
--title-color: #608DBD;
--text-color: #757575;
/*========== Font and typography ==========*/
--h2-font-size: 1.25rem;
--h3-font-size: 1.125rem;
--normal-font-size: .938rem;
--small-font-size: .813rem;
--smaller-font-size: .70rem;
/*========== Margins ==========*/
--mb-0-25: .25rem;
--mb-0-5: .5rem;
--mb-1: 1rem;
--mb-1-5: 1.5rem;
--mb-2: 2rem;
--mb-2-5: 2.5rem;
--mb-3: 3rem;
}
/* Font size for large devices */
@media screen and (min-width: 968px) {
:root {
--h2-font-size: 1.5rem;
--h3-font-size: 1.25rem;
--normal-font-size: 1rem;
--small-font-size: .875rem;
--smaller-font-size: .813rem;
}
}
/*==================== BASE ====================*/
h1, h2, h3, h4 {
color: var(--title-color);
font-weight: var(--font-semi-bold);
}
.about__info {
display: flex;
justify-content: space-evenly;
margin-bottom: var(--mb-2-5);
}
.about__info-title {
font-size: var(--h2-font-size);
font-weight: var(--font-semi-bold);
color: var(--title-color);
}
.about__info-name {
font-size: var(--smaller-font-size);
}
.about__info-title,
.about__info-name {
display: block;
text-align: center;
}
/*==================== QUALIFICATION ====================*/
.qualification__tabs {
display: flex;
justify-content: space-evenly;
margin-bottom: var(--mb-2);
}
.qualification__button {
font-size: var(--h3-font-size);
font-weight: var(--font-medium);
cursor: pointer;
}
.qualification__button:hover {
color: var(--first-color);
}
.qualification__icon {
font-size: 1.8rem;
margin-right: var(--mb-0-25);
}
.qualification__data {
display: grid;
grid-template-columns: 1fr max-content 1fr;
column-gap: 0.5rem;
}
.qualification__data > div:first-child {
text-align: center;
}
.qualification__data > div:last-child {
text-align: center;
}
.qualification__title {
font-size: var(--normal-font-size);
font-weight: var(--font-medium);
}
.qualification__subtitle {
display: inline-block;
font-size: var(--smaller-font-size);
margin-bottom: var(--mb-1);
}
.qualification__calendar {
font-size: var(--smaller-font-size);
color: var(--md-primary-fg-color--dark);
}
.qualification__rounder {
display: inline-block;
width: 13px;
height: 13px;
background-color: var(--md-primary-fg-color);
border-radius: 50%;
}
.qualification__line {
display: block;
width: 1px;
height: 100%;
background-color: var(--md-primary-fg-color);
transform: translate(6px, -7px);
}
.qualification [data-content] {
display: none;
}
.qualification__active[data-content] {
display: block;
}
.qualification__button.qualification__active {
color: var(--first-color);
}

3
docs/stylesheets/customize.css
View File

@ -84,5 +84,4 @@
box-shadow: 0 2px 12px 0 rgba(60,60,60,0.07);
transition: border-radius 0.4s cubic-bezier(.4,2,.6,1), box-shadow 0.3s;
overflow: hidden;
}
}

474
temp/geren.md Normal file
View File

@ -0,0 +1,474 @@
---
title: 关于我
hide:
# - navigation
# - toc
- feedback
# - footer
status: new
---
<script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>
# <span id="jinrishici-sentence">今日诗词</span>
## 关于我
<!-- <center>
<img src="https://picx.zhimg.com/v2-fb22186d2490043435a72876950492f5_1440w.jpg"
style="width: 270px; border-radius: 50%; display: block; margin: 0 auto;">
</center> -->
<div class="flip-container">
<div class="image-container">
<img src="https://free.wmhua.cn/2025/05/09/681d7016db8dc.png" alt="Back Image">
<img src="https://free.wmhua.cn/2025/05/09/681d7015ed864.jpeg" alt="Front Image">
</div>
</div>
<style>
.flip-container {
position: relative;
width: 290px;
height: 290px;
margin: 10px auto;
display: flex;
align-items: flex-start;
/* 对齐顶部 */
justify-content: flex-end;
/* 将文字放置右上角 */
}
.image-container {
position: relative;
position: relative;
width: 290px;
height: 290px;
}
.image-container img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover; /* 图片填满容器 */
border-radius: 50%;
border: 4px solid #ffffff; /* 白色边框 */
box-shadow: 0 8px 24px rgba(14, 30, 37, 0.15); /* 阴影 */
backface-visibility: hidden; /* 隐藏背面 */
transition: transform 0.6s ease-in-out; /* 仅对transform过渡 */
}
.image-container img:first-child {
z-index: 1;
backface-visibility: hidden;
}
.image-container img:last-child {
z-index: 0;
transform: rotateY(180deg);
backface-visibility: hidden;
}
.image-container:hover img:first-child {
transform: rotateY(180deg);
z-index: 2;
}
.image-container:hover img:last-child {
transform: rotateY(0deg);
z-index: 3;
}
</style>
<!-- <center>
![](https://picx.zhimg.com/v2-fb22186d2490043435a72876950492f5_1440w.jpg#only-light){style="width: 270px; border-radius: 50%;"}
![](https://pic4.zhimg.com/v2-a0456a5f527c1923f096759f2926012f_1440w.jpg#only-dark){style="width: 270px; border-radius: 50%;"}
</center> -->
<!-- <p style="text-align: center; font-size: 35px; "><strong>A college student in Chongqing</strong></p> -->
<center><font size=6 color= #757575>
观史知今，当思进退，读书明志可识春秋
<br>
——Wcowin </font></center>
---
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js"></script>
<link rel="stylesheet" href="../sty/portfolio.css">
</head>
<body>
<main class="main">
<section class="about section" id="about">
<div class="about__container container">
<div class="about__data">
<p style="text-align: center;"></p>
<div class="about__info">
<div>
<span class="about__info-title">1年+</span>
<span class="about__info-name">工作经验</span>
</div>
<div>
<a href="https://github.com/Wcowin" target="_blank">
<span class="about__info-title">3项+</span>
<span class="about__info-name">完成的项目</span>
</a>
</div>
<div>
<span class="about__info-title">2个+</span>
<span class="about__info-name">贡献的开源</span>
</div>
</div>
</div> <!-- 闭合 about__data -->
</div> <!-- 闭合 about__container -->
</section>
</main> <!-- 闭合 main -->
</body>
</html>
<!-- <center>
[下载简历 :fontawesome-solid-download:](个人简历2.pdf){.md-button target="_blank"}
</center> -->
<center>
<a href="../个人简历.pdf" target="_blank" class="md-button">下载简历</a>
</center>
<!-- <div class="card2 file-block" markdown="1">
<div class="file-icon"><img src="https://pic4.zhimg.com/80/v2-98f918276ecbc6d549fa6a5d1238e713_1440w.webp" style="height: 3em;"></div>
<div class="file-body">
<div class="file-title">个人简历</div>
<div class="file-meta">2025-02-14</div>
</div>
<a class="down-button" target="_blank" href="../个人简历.pdf" markdown="1">:fontawesome-solid-download: 下载</a>
</div> -->
---
## 我的履历
<section class="qualification section">
<div class="qualification__container container">
<div class="qualification__tabs">
<div class="qualification__button button--flex qualification__active" data-target='#education'>
<iconify-icon icon="fluent:hat-graduation-12-regular" class="qualification__icon"></iconify-icon>
来时路
</div>
</div>
<div class="qualification__sections">
<!-- 教育经历时间线 -->
<div class="qualification__content qualification__active" data-content id="education">
<!-- 时间线项目 -->
<div class="qualification__data">
<div>
<h3 class="qualification__title">漯河高中</h3>
<span class="qualification__subtitle">平凡的三年</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">2018 - 2021</span>
</div>
</div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
</div>
<div class="qualification__data">
<div></div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
<div>
<h3 class="qualification__title">CTBU</h3>
<span class="qualification__subtitle">电子信息工程专业学士</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">2021 - 2025</span>
</div>
</div>
</div>
<div class="qualification__data">
<div>
<h3 class="qualification__title">家里蹲大学</h3>
<span class="qualification__subtitle">密码学硕士研究生</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">2026 - 2029</span>
</div>
</div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
</div>
<div class="qualification__data">
<div></div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
<div>
<h3 class="qualification__title">未完待续</h3>
<span class="qualification__subtitle">于道各努力，千里自同风</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">Before - After</span>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<HR style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#608DBD,direction:145,strength:15)" width="100%" color=#608DBD SIZE=1>
## 个人简介
<!-- <p style="text-align: center; font-size: 25px; margin: 0px;"><strong>𝘿𝙤𝙣'𝙩 𝙘𝙖𝙧𝙚 𝙖𝙗𝙤𝙪𝙩 𝙬𝙤𝙧𝙡𝙙𝙡𝙮 𝙚𝙮𝙚𝙨 𝙩𝙤 𝙥𝙪𝙧𝙨𝙪𝙚 𝙮𝙤𝙪𝙧 𝙤𝙬𝙣 𝙡𝙞𝙜𝙝𝙩</strong></p> -->
<!-- https://s1.imagehub.cc/images/2024/02/02/79cb7379982d1c7bb0ae7163985609c4.jpeg -->
!!! pied-piper1 "About me"
- [x] Hey, I'm [Wcowin](https://wcowin.work/VitePress/){target=“_blank”}~
- [x] 咖啡重度爱好者
- [x] 热爱(xiā)折腾技术/Math，目前的研究领域是[密码学](https://wcowin.work/blog/Cryptography/)
- [x] 读书明志可识春秋;诗词爱好者;喜欢村上春树;擅长羽毛球
- [x] 清醒，知趣，明得失，知进退
## 人生态度
<p style="text-align: center; font-size: 25px; margin: 0px;"><strong>𝘿𝙤𝙣'𝙩 𝙘𝙖𝙧𝙚 𝙖𝙗𝙤𝙪𝙩 𝙬𝙤𝙧𝙡𝙙𝙡𝙮 𝙚𝙮𝙚𝙨 𝙩𝙤 𝙥𝙪𝙧𝙨𝙪𝙚 𝙮𝙤𝙪𝙧 𝙤𝙬𝙣 𝙡𝙞𝙜𝙝𝙩</strong></p>
<!-- <img class="img1" src="https://pic2.zhimg.com/80/v2-6cf497fc08da090bd53e4a5dc962d9d9_1440w.webp"> -->
<img class="img1" src="https://pic1.zhimg.com/80/v2-8030915c744322fb1e3a6ec0b8fed24c_1440w.webp">
<!-- <head>
<style>
@media (min-width: 768px) {
.mobile-only {
display: none;
}
}
</style>
</head>
<body>
<a href="https://pic3.zhimg.com/80/v2-5ef3dde831c9d0a41fe35fabb0cb8784_1440w.webp" target="_blank" class="mobile-only">
<center>
<img class="img1" src="https://pic3.zhimg.com/80/v2-5ef3dde831c9d0a41fe35fabb0cb8784_1440w.webp" style="width: 450px; height: auto;">
<div style="color:orange;
color: #999;
padding: 2px;">我的Wechat</div>
</center>
</a>
<a href="https://t.me/wecowin" target="_blank" class="mobile-only">
<center>
<img class="img1" src="https://pica.zhimg.com/80/v2-d5876bc0c8c756ecbba8ff410ed29c14_1440w.webp" style="width: 450px; height: auto;">
<div style="color:orange;
color: #999;
padding: 2px;">我的TG</div>
</center>
</a>
</body>
<style>
@media (max-width: 768px) { /* 移动端隐藏 */
.desktop-only {
display: none !important;
}
}
</style>
<div class="grid desktop-only" style="display: grid;grid-template-columns: 35% 65%" markdown>
<div class="grid cards" markdown>
- <center>![WeChat](https://picx.zhimg.com/80/v2-21045fd6f42e98fb136c6d7d0958f2f1_1440w.webp#only-light){ .lg .middle style="width: 50px; height: 50px;"} ![WeChat](https://img.icons8.com/?size=100&id=19977&format=png&color=000000#only-dark){ .lg .middle style="width: 50px; height: 50px;"}</center>
---
<center><font color= #757575 size=6>WeChat</font>
<img src="https://picx.zhimg.com/80/v2-540df18f16032fbe114dd960da21b467_1440w.webp" style="width: auto; height: auto;">
<font color= #999 >扫一扫上面的二维码图案<br>
加我为朋友</font></center>
</div>
<div class="grid cards" style="display: grid; grid-template-columns: 1fr;" markdown>
- <center>![](https://pic4.zhimg.com/v2-e996df5a7696237b6f924ace7044cd97_1440w.jpg#only-light){ .lg .middle style="width: 50px; height: 50px;"}![](https://img.icons8.com/?size=100&id=3AYCSzCO85Qw&format=png&color=000000#only-dark){ .lg .middle style="width: 50px; height: 50px;"} </center>
---
<center><font color= #757575 size=6>Email</font>
[发送电子邮件 :fontawesome-solid-paper-plane:](mailto:<wangkewen821@gmail.com>){.md-button}</center>
<div class="grid cards" style="display:grid; grid-template-columns: 49% 49% !important;" markdown>
- <center>![](https://pica.zhimg.com/v2-61b4731957dba61e9960436dbd06306a_1440w.jpg#only-light){ .lg .middle style="width: 50px; height: 50px;" } ![WeChat](https://img.icons8.com/?size=100&id=63306&format=png&color=000000#only-dark){ .lg .middle style="width: 50px; height: 50px;"}</center>
---
<center><font color= #757575 size=6>Telegram</font>
[Let's Chat :fontawesome-brands-telegram:](https://t.me/Wcowin){.md-button} </center>
- <center>![](https://pic3.zhimg.com/80/v2-aa11d437a377f1a0deac132eb800b306_1440w.webp#only-light){ .lg .middle style="width: 50px; height: 50px;"} ![WeChat](https://img.icons8.com/?size=100&id=13963&format=png&color=000000#only-dark){ .lg .middle style="width: 50px; height: 50px;"}</center>
---
<center><font color= #757575 size=6>Twitter</font>
[@Wcowin :material-twitter:](https://twitter.com/wcowin_){.md-button}</center>
</div>
</div>
</div> -->
## 联系我
=== "💬 微信"
<div style="text-align: center; padding: 0px;">
<div style="display: inline-block; padding: 20px; border-radius: 20px; background: linear-gradient(135deg,rgba(68,138,255,.1));transition: transform 0.3s;"
onmouseover="this.style.transform='scale(1.03)'" onmouseout="this.style.transform='scale(1)'">
<img src="https://picx.zhimg.com/80/v2-540df18f16032fbe114dd960da21b467_1440w.webp"
style="width: 280px; height: auto; border-radius: 12px; border: 3px solid white;">
</div>
<br><br>
<p style="font-size: 16px; color: var(--md-default-fg-color--light); margin-top: 15px;">
📱 扫一扫上面的二维码，加我为好友
</p>
</div>
=== "📧 邮箱"
<div style="text-align: center; padding: 0px 0px;">
<div style="margin-bottom: 15px;">
<h3 style="color: var(--md-primary-fg-color); margin-bottom: 10px;">
✉️ 邮件联系
</h3>
</div>
<a href="mailto:wangkewen821@gmail.com" class="md-button md-button--primary"
style="font-size: 16px; padding: 12px 30px; border-radius: 25px;">
:fontawesome-solid-paper-plane: &nbsp; 发送电子邮件
</a>
<div style="margin-top: 20px;">
<p style="font-size: 14px; color: var(--md-default-fg-color--lighter);">
📬 邮箱地址：<code>wangkewen821@gmail.com</code>
</p>
<p style="font-size: 16px; color: var(--md-default-fg-color--light); margin-bottom: 20px;">
有项目合作或技术问题？随时发邮件给我！
</p>
<p style="font-size: 13px; color: var(--md-default-fg-color--lighter); margin-top: 5px;">
💡 一般在 24 小时内 回复，请耐心等待
</p>
</div>
</div>
=== "🌐 社交"
<div style="text-align: center; padding: 0px 0px;">
<div style="margin-bottom: 30px;">
<h3 style="color: var(--md-primary-fg-color); margin-bottom: 20px;">
🤝🏻社交媒体
</h3>
<p style="font-size: 16px; color: var(--md-default-fg-color--light); margin-bottom: 20px;">
关注我的社交媒体，获取最新动态
</p>
</div>
<div style="display: flex; justify-content: center; gap: 20px; flex-wrap: wrap;">
<a href="https://t.me/Wcowin" class="md-button md-button--primary"
style="display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 25px; background: linear-gradient(135deg, #0088cc, #0066aa); color: white; transition: all 0.3s;"
onmouseover="this.style.transform='scale(1.05)'" onmouseout="this.style.transform='scale(1)'" target="_blank">
:fontawesome-brands-telegram: Telegram
</a>
<a href="https://twitter.com/wcowin_" class="md-button md-button--primary"
style="display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 25px; background: linear-gradient(135deg, #1da1f2, #0d8bd9); color: white; transition: all 0.3s;"
onmouseover="this.style.transform='scale(1.05)'" onmouseout="this.style.transform='scale(1)'" target="_blank">
:fontawesome-brands-twitter: Twitter
</a>
</div>
<figure markdown >
![Image title](https://s1.imagehub.cc/images/2025/01/04/ac7fda1814bb1e18714f9dd9f5d87636.png){.img1 }
</div>
=== "📍 其他"
<div style="text-align: center; padding: 0px 0px;">
<div style="margin-bottom: 30px;">
<h3 style="color: var(--md-primary-fg-color); margin-bottom: 10px; font-weight: 600;">
📍 其他平台联系
</h3>
<p style="font-size: 15px; color: var(--md-default-fg-color--light);">
欢迎通过下列平台了解我的更多工作和项目经历
</p>
</div>
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; max-width: 700px; margin: 0 auto;">
<!-- GitHub -->
<div style="padding: 20px; border-radius: 16px; background: var(--md-code-bg-color); border: 1px solid var(--md-default-fg-color--lightest); box-shadow: 0 4px 10px rgba(0,0,0,0.05); transition: transform 0.3s, box-shadow 0.3s;"
onmouseover="this.style.transform='translateY(-6px)'; this.style.boxShadow='0 10px 20px rgba(0,0,0,0.08)'"
onmouseout="this.style.transform='none'; this.style.boxShadow='0 4px 10px rgba(0,0,0,0.05)'">
<div style="font-size: 26px; margin-bottom: 12px;">🌟</div>
<h4 style="margin: 0 0 10px 0; color: var(--md-primary-fg-color); font-size: 17px;">GitHub</h4>
<a href="https://github.com/Wcowin" class="md-button" style="font-size: 14px;" target="_blank">
:fontawesome-brands-github: 查看 GitHub
</a>
</div>
<!-- LinkedIn -->
<div style="padding: 20px; border-radius: 16px; background: var(--md-code-bg-color); border: 1px solid var(--md-default-fg-color--lightest); box-shadow: 0 4px 10px rgba(0,0,0,0.05); transition: transform 0.3s, box-shadow 0.3s;"
onmouseover="this.style.transform='translateY(-6px)'; this.style.boxShadow='0 10px 20px rgba(0,0,0,0.08)'"
onmouseout="this.style.transform='none'; this.style.boxShadow='0 4px 10px rgba(0,0,0,0.05)'">
<div style="font-size: 26px; margin-bottom: 12px;">💼</div>
<h4 style="margin: 0 0 10px 0; color: var(--md-primary-fg-color); font-size: 17px;">LinkedIn</h4>
<a href="https://www.linkedin.com/in/wcowin/" class="md-button" style="font-size: 14px;" target="_blank">
:fontawesome-brands-linkedin: 查看档案
</a>
</div>
</div>
<!-- 底部强调卡片 -->
<div style="margin-top: 40px; padding: 20px; border-radius: 12px; background: linear-gradient(135deg, var(--md-primary-fg-color--light), var(--md-primary-fg-color)); color: white; box-shadow: 0 6px 15px rgba(0,0,0,0.1);">
<p style="margin: 0; font-size: 16px; font-weight: 600;">
🚀 随时欢迎联系我，开启合作或交流！
</p>
<p style="margin: 10px 0 0 0; font-size: 14px; opacity: 0.9;">
无论是技术探讨、学习交流还是职业机会，我都乐意听见你的声音 😄
</p>
</div>
</div>
---
> 💬我电话号码的`MD5`码：7037F514864088F907CC921687B670EE（破解有奖）
## 须知
如果你在浏览博客的过程中发现了任何问题，欢迎前往 GitHub 的[代码仓库](https://github.com/Wcowin/Wcowin.github.io)提交 [Issues](https://github.com/Wcowin/Wcowin.github.io/issues) 或直接修改相关文件后提交 Pull Requests。如果你有其他事情想要咨询，可以通过下方按钮使用邮件联系我,请不要滥用博客的评论功能发表与主题无关言论。
!!! note "与我联系"
如果给我发[邮件](mailto:<wangkewen821@gmail.com>)，或者通过右下角微信添加好友，请写上您的**真名实姓**。对于那些不知来路、上来就问问题的微信和邮件，我通常会**直接忽略**，谢谢。
---
<center>[发送电子邮件 :fontawesome-solid-paper-plane:](mailto:<wcowin@qq.com>){.md-button}</center>
<!-- 我的电话号码`SHA256`码：DEF633030D31F7ABE6213EE5B5EFDF0E4ADDFDA121695325660D82F15ED22946 -->
<!-- <chat-bot platform_id="d19a99ed-b684-4d64-8c70-7663d974af17" user_id="325b3ae2-0317-4c5f-9f9b-c4ce0e51e36b" chatbot_id="8eedef48-41ef-4f78-97d9-71e8197a452d"><a href="https://www.chatsimple.ai/?utm_source=widget&utm_medium=referral">[chatbot]</a></chat-bot><script src="https://cdn.chatsimple.ai/chat-bot-loader.js" defer></script> -->
<!-- <script src="//code.tidio.co/6jmawe9m5wy4ahvlhub2riyrnujz7xxi.js" async></script> -->