This commit is contained in:
Zyronon
2025-11-06 01:40:04 +08:00
parent 1dcbf37919
commit 00b1c521cb

View File

@@ -76,35 +76,29 @@
toggleEl('#xhsDialog', true)
}
</script>
<!-- <link href="https://cdn.jsdelivr.net/npm/tailwindcss@3.4.0/dist/tailwind.min.css" rel="stylesheet">-->
<script src="https://cdn.tailwindcss.com"></script>
<style>
body {
background: rgb(231, 232, 235);
}
h1 {
font-size: 6rem !important;
font-size: 4.8rem !important;
background: linear-gradient(120deg, #bd34fe 30%, #41d1ff);
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
background-clip: text;
color: transparent;
margin: 0;
font-weight: bold !important;
}
h2 {
font-size: 1.6rem !important;
font-size: 1.4rem !important;
font-weight: bold !important;
color: rgb(91, 91, 91);
margin: 0;
}
.center {
display: flex;
justify-content: center;
align-items: center;
}
.card {
position: relative;
border-radius: 1rem;
@@ -113,7 +107,7 @@
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 1rem;
gap: 0.8rem;
margin-bottom: 0;
width: 25%;
background: rgb(247, 247, 247);
@@ -136,24 +130,10 @@
}
}
.bottom {
width: 100%;
padding-top: 2rem;
border-top: 1px solid #c4c4c4;
}
a {
color: dodgerblue !important;
}
.w-60vw {
width: 60%;
}
.gap-space {
gap: 1rem;
}
.base-button {
cursor: pointer;
box-sizing: border-box;
@@ -238,30 +218,101 @@
.dialog-body {
padding: 0 1.2rem 1.2rem 1.2rem;
}
.wrapper {
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
}
.content {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
gap: 2rem;
}
.text-center {
text-align: center;
}
.sky {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
gap: 1rem;
width: 100%;
margin-bottom: 1rem;
}
.w {
width: 60vw;
}
.sky-img {
width: 100%;
border-radius: 0.5rem;
}
.card-wrap {
display: flex;
margin-bottom: 1.2rem;
gap: 1rem;
}
.bottom {
display: flex;
gap: 1rem;
margin: 2rem 0;
width: 100%;
padding-top: 2rem;
border-top: 1px solid #c4c4c4;
justify-content: center;
align-items: center;
}
.gap-1 {
gap: 1rem;
}
.center {
display: flex;
justify-content: center;
align-items: center;
}
.img {
width: 16rem;
border-radius: 1rem;
margin-top: 1.2rem;
}
</style>
</head>
<body>
<div class="flex flex-col justify-between min-h-screen">
<div class="center flex-col gap-8 mt-8">
<div class="wrapper">
<div class="content">
<h1>Type Words</h1>
<div class="text-center">
<h2>学习英语,一次敲击,一点进步</h2>
<h2>记忆不再盲目,学习更高效,开源单词与文章练习工具</h2>
</div>
<div class="flex">
<div class="">
<div class="base-button" onclick="nav('/words')">单词练习</div>
<div class="base-button" onclick="nav('/articles')">文章练习</div>
</div>
<div class="center justify-center flex-col gap-2 w-full mb-4">
<a href="https://skywork.ai/p/GrXQb4" class="w-60vw" target="_blank">
<div class="sky">
<a href="https://skywork.ai/p/GrXQb4" class="w" target="_blank">
<img src="/skywork-ai.png"
alt="Skywork.AI"
class="w-full rounded-lg"></a>
class="sky-img"></a>
<span>Skywork.AI:<a href="https://skywork.ai/p/GrXQb4" class="color-blue!" target="_blank">10 tasks in 1 hour, not 10 hours →Limited free spots: 127 left</a></span>
</div>
<div class="w-60vw">
<div class="flex mb-5 gap-space">
<div class="w">
<div class="card-wrap">
<div class="card">
<div class="emoji">📚</div>
<div class="title">单词练习</div>
@@ -302,9 +353,8 @@
内置小学、初中、高中、四六级、考研、雅思、托福、GRE、GMAT、SAT、BEC、专四、专八等词库
</div>
</div>
</div>
<div class="flex gap-space">
<div class="card-wrap">
<div class="card">
<div class="emoji">🆓</div>
<div class="title">免费开源</div>
@@ -338,7 +388,6 @@
</ul>
</div>
</div>
<div class="card">
<div class="emoji">🎯</div>
<div class="title">个性学习</div>
@@ -353,8 +402,9 @@
</div>
</div>
</div>
<div class="center gap-space my-10 bottom">
<div class="center gap-2">
<div class="bottom">
<div class="center gap-1">
<a
href="https://github.com/zyronon/TypeWords"
target="_blank"
@@ -425,8 +475,8 @@
<span>
加入我们的用户社群后,您可以与我们的开发团队进行沟通,分享您的使用体验和建议,帮助我们改进产品,同时也能够及时了解我们的最新动态和更新内容。
</span>
<div class="center mt-4">
<img src="/wechat.png" alt="微信群二维码" class="w-60 rounded-lg">
<div class="center">
<img src="/wechat.png" alt="微信群二维码" class="img">
</div>
</div>
</div>
@@ -443,8 +493,8 @@
</header>
<div class="dialog-body">
<span>关注小红书后,您可以获得开发团队的最新动态和更新内容,反馈您的使用体验和建议,帮助我们改进产品,同时也能够及时了解我们的最新动态和更新内容。</span>
<div class="center mt-4">
<img src="/xhs.png" alt="小红书二维码" class="w-60 rounded-lg">
<div class="center">
<img src="/xhs.png" alt="小红书二维码" class="img">
</div>
</div>
</div>