Skip to content

Commit bd31668

Browse files
HisAtriHisAtri
authored
Merge pull request #111 from katagomo/main
修改主页样式，增加赞助致谢
2 parents 79042df + 336c31b commit bd31668

File tree

4 files changed

+626
-189
lines changed

4 files changed

+626
-189
lines changed

‎src/acknowledgments.html

+64
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<!DOCTYPE html>
2+
<html lang="zh">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>LrcAPI - 致谢名单</title>
7+
<link rel="stylesheet" href="/src/css/v50.css">
8+
</head>
9+
<body>
10+
<header>
11+
<div class="logo-container">
12+
<img src="/src/img/LrcAPI-Text-Extra.png" alt="LrcAPI Logo" class="logo">
13+
<span class="project-name">LrcAPI</span>
14+
</div>
15+
<div class="github-link">
16+
<a href="https://github.com/hisatri/LrcAPI" class="github-button">
17+
<svg height="20" viewBox="0 0 16 16" width="20" class="github-icon">
18+
<path fill="currentColor" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path>
19+
</svg>
20+
在 GitHub 上查看
21+
</a>
22+
</div>
23+
</header>
24+
25+
<main>
26+
<h1>致谢名单</h1>
27+
<p class="subtitle">感谢所有支持 LrcAPI 项目发展的朋友们</p>
28+
29+
<div class="acknowledgment-content">
30+
<p>LrcAPI 是一个完全免费的开源项目，它的发展离不开社区成员的支持。在此特别感谢以下支持者的慷慨赞助：</p>
31+
32+
<div class="supporters-list">
33+
<div class="supporter-card">
34+
<h3>爱发电赞助者</h3>
35+
<ul class="supporters-grid">
36+
<li class="supporter-box">
37+
<div class="supporter-info">
38+
<span class="supporter-name">张三</span>
39+
<span class="support-amount">￥50</span>
40+
</div>
41+
</li>
42+
<li class="supporter-box">
43+
<div class="supporter-info">
44+
<span class="supporter-name">李四</span>
45+
<span class="support-amount">￥30</span>
46+
</div>
47+
</li>
48+
<li class="supporter-box">
49+
<div class="supporter-info">
50+
<span class="supporter-name">王五</span>
51+
<span class="support-amount">￥20</span>
52+
</div>
53+
</li>
54+
</ul>
55+
</div>
56+
</div>
57+
</div>
58+
</main>
59+
60+
<footer>
61+
<p class="license-text">本项目基于 <a href="https://github.com/HisAtri/LrcApi/blob/main/LICENSE" target="_blank" style="color: gray; text-decoration: none;">GNU General Public License v3.0</a> 开源协议发布 | <a href="/src">回到主页</a></p>
62+
</footer>
63+
</body>
64+
</html>

‎src/css/v50.css

+307
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,307 @@
1+
* {
2+
margin: 0;
3+
padding: 0;
4+
box-sizing: border-box;
5+
}
6+
7+
body {
8+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
9+
line-height: 1.6;
10+
color: #333;
11+
background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 50%, #eef0ff 100%);
12+
min-height: 100vh;
13+
display: flex;
14+
flex-direction: column;
15+
}
16+
17+
header {
18+
display: flex;
19+
justify-content: space-between;
20+
align-items: center;
21+
padding: 1rem 2rem;
22+
background-color: white;
23+
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
24+
}
25+
26+
.logo-container img {
27+
height: 40px;
28+
}
29+
30+
.github-button {
31+
display: inline-block;
32+
padding: 0.5rem 1rem;
33+
color: #24292e;
34+
text-decoration: none;
35+
border: 1px solid #e1e4e8;
36+
border-radius: 6px;
37+
background-color: #fafbfc;
38+
transition: 0.2s ease;
39+
}
40+
41+
.github-button:hover {
42+
background-color: #f3f4f6;
43+
}
44+
45+
main {
46+
max-width: 1200px;
47+
margin: 0 auto;
48+
padding: 3rem 2rem;
49+
text-align: center;
50+
flex: 1;
51+
}
52+
53+
h1 {
54+
font-size: 2.5rem;
55+
margin-bottom: 1rem;
56+
color: #24292e;
57+
}
58+
59+
.subtitle {
60+
color: #586069;
61+
margin-bottom: 3rem;
62+
}
63+
64+
.cards-container {
65+
display: grid;
66+
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
67+
gap: 2rem;
68+
margin-top: 2rem;
69+
}
70+
71+
.card {
72+
background: rgba(255, 255, 255, 0.9);
73+
border-radius: 8px;
74+
padding: 2rem;
75+
box-shadow: 0 4px 6px rgba(108, 99, 255, 0.1);
76+
transition: transform 0.2s ease;
77+
backdrop-filter: blur(10px);
78+
}
79+
80+
.card:hover {
81+
transform: translateY(-5px);
82+
}
83+
84+
.card-icon {
85+
margin-bottom: 1.5rem;
86+
}
87+
88+
.card-icon svg {
89+
width: 48px;
90+
height: 48px;
91+
fill: #6c63ff;
92+
}
93+
94+
.card h3 {
95+
margin-bottom: 1rem;
96+
color: #24292e;
97+
}
98+
99+
.input-group {
100+
display: flex;
101+
align-items: center;
102+
margin: 1.5rem 0;
103+
border: 1px solid #e1e4e8;
104+
border-radius: 6px;
105+
overflow: hidden;
106+
}
107+
108+
.prefix {
109+
padding: 0.5rem;
110+
background: #f6f8fa;
111+
color: #586069;
112+
border-right: 1px solid #e1e4e8;
113+
}
114+
115+
input {
116+
flex: 1;
117+
padding: 0.5rem;
118+
border: none;
119+
outline: none;
120+
}
121+
122+
.analyze-button {
123+
width: 100%;
124+
padding: 0.75rem;
125+
background: #6c63ff;
126+
color: white;
127+
border: none;
128+
border-radius: 6px;
129+
cursor: pointer;
130+
transition: 0.2s ease;
131+
}
132+
133+
.analyze-button:hover {
134+
background: #5b54d6;
135+
}
136+
137+
.upload-zone {
138+
margin-top: 1.5rem;
139+
padding: 2rem;
140+
border: 2px dashed #e1e4e8;
141+
border-radius: 6px;
142+
background: #f6f8fa;
143+
cursor: pointer;
144+
transition: 0.2s ease;
145+
}
146+
147+
.upload-zone:hover {
148+
border-color: #6c63ff;
149+
background: #f8f9ff;
150+
}
151+
152+
.support-button {
153+
display: block;
154+
width: 100%;
155+
padding: 0.75rem;
156+
background: #6c63ff;
157+
color: white;
158+
border: none;
159+
border-radius: 6px;
160+
cursor: pointer;
161+
transition: 0.2s ease;
162+
text-decoration: none;
163+
margin-top: 1.5rem;
164+
text-align: center;
165+
}
166+
167+
.support-button:hover {
168+
background: #5b54d6;
169+
}
170+
171+
.partner-links {
172+
display: flex;
173+
flex-direction: column;
174+
gap: 0.75rem;
175+
margin-top: 1.5rem;
176+
}
177+
178+
.partner-link {
179+
display: block;
180+
padding: 0.75rem;
181+
background: rgba(255, 255, 255, 0.8);
182+
color: #24292e;
183+
text-decoration: none;
184+
border-radius: 6px;
185+
transition: 0.2s ease;
186+
border: 1px solid #e1e4e8;
187+
backdrop-filter: blur(5px);
188+
}
189+
190+
.partner-link:hover {
191+
background: #f0f1f4;
192+
border-color: #6c63ff;
193+
color: #6c63ff;
194+
}
195+
196+
.logo-container {
197+
display: flex;
198+
align-items: center;
199+
gap: 12px;
200+
}
201+
202+
.project-name {
203+
font-size: 24px;
204+
font-weight: bold;
205+
color: #333;
206+
}
207+
208+
.github-button {
209+
display: flex;
210+
align-items: center;
211+
gap: 8px;
212+
padding: 8px 16px;
213+
font-size: 14px;
214+
border-radius: 6px;
215+
}
216+
217+
.github-icon {
218+
margin-right: 4px;
219+
}
220+
221+
footer {
222+
margin-top: auto;
223+
padding: 20px 0;
224+
text-align: center;
225+
border-top: 1px solid rgba(108, 99, 255, 0.1);
226+
background-color: rgba(255, 255, 255, 0.8);
227+
backdrop-filter: blur(10px);
228+
}
229+
230+
.license-text {
231+
color: #666;
232+
font-size: 14px;
233+
}
234+
235+
.license-text a {
236+
color: gray;
237+
text-decoration: none;
238+
}
239+
240+
.license-text a:visited {
241+
color: gray;
242+
}
243+
244+
.license-text a:hover {
245+
color: gray;
246+
text-decoration: underline;
247+
}
248+
249+
/* 赞助者列表样式 */
250+
.supporters-grid {
251+
display: grid;
252+
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
253+
gap: 1.5rem;
254+
list-style: none;
255+
padding: 0;
256+
margin: 2rem 0;
257+
}
258+
259+
.supporter-box {
260+
background: white;
261+
border-radius: 8px;
262+
padding: 1.5rem;
263+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
264+
transition: transform 0.2s ease, box-shadow 0.2s ease;
265+
}
266+
267+
.supporter-box:hover {
268+
transform: translateY(-3px);
269+
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
270+
}
271+
272+
.supporter-info {
273+
display: flex;
274+
justify-content: space-between;
275+
align-items: center;
276+
}
277+
278+
.supporter-name {
279+
font-size: 1.1rem;
280+
color: #333;
281+
}
282+
283+
.support-amount {
284+
font-weight: bold;
285+
color: #2ecc71;
286+
font-size: 1.2rem;
287+
}
288+
289+
.supporter-card h3 {
290+
text-align: left;
291+
margin-bottom: 1rem;
292+
color: #333;
293+
font-size: 1.5rem;
294+
}
295+
296+
/* 调整主要内容区域的样式 */
297+
.acknowledgment-content {
298+
max-width: 1000px;
299+
margin: 0 auto;
300+
text-align: left;
301+
}
302+
303+
.acknowledgment-content > p {
304+
margin-bottom: 2rem;
305+
font-size: 1.1rem;
306+
color: #666;
307+
}

0 commit comments

Comments
 (0)