-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
230 lines (227 loc) · 11.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Design For DGLinux</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="icon" type="image/png" href="assets/logo.png">
</head>
<body>
<canvas class="background"></canvas>
<div class="top-stripe"></div>
<div class="container">
<div class="container-content">
<div class="header-img">
<img src="assets/logo.png">
</div>
<div class="header">
为 DGLinux 设计<a href="https://linux.dgut.edu.cn">新主页</a><br />
<span class="exclamation">领超级大奖！</span>
</div>
<div class="details-container">
<a href="mailto:linux@dgut.edu.cn" class="submit button">
现在提交
</a>
<div class="details">
提交日期: 2020/4/25 ~ 2020/5/5<br />
无需报名，<b>程序知识非必要</b>，支持提交任意格式：PSD, Git 仓库，Zip, Tarball, ...
</div>
</div>
<div class="accordion">
<div class="accordion-header">
奖品一览
<span class="transistable float-right acch">
▸
</span>
</div>
<div class="transistable accordion-body collapsed">
<div class="accordion-content">
<h4 class="vertical-middle">
<img src="assets/champion.svg" style="filter: invert(100%);"> 一等奖
</h4>
<div class="prizes">
<div class="prize-item">
<div class="vertical-middle">
<img src="assets/gift_card.svg">
<div>
价值 $50 的礼品卡，<strong>或</strong>
</div>
</div>
<div class="vertical-middle">
<img src="assets/headphone.svg">
<div>
Audio-Technica™ 耳机 × 1
</div>
</div>
</div>
<div class="prize-item vertical-middle">
<img src="assets/steam.svg">
<div>
Steam 钱包 ¥50
</div>
</div>
<div class="prize-item vertical-middle">
<img src="assets/tux.svg">
<div>
GNU/Linux 协会吉祥物，Tux 的公仔
</div>
</div>
<div class="prize-item vertical-middle">
<img src="assets/love.svg">
<div>
假如你许可，你的设计会被我们采用为协会主页
</div>
</div>
</div>
<h4>
二等奖
</h4>
<div class="prizes">
<div class="prize-item vertical-middle">
<img src="assets/steam.svg">
<div>
Steam 钱包 ¥50
</div>
</div>
<div class="prize-item vertical-middle">
<img src="assets/tux.svg">
<div>
GNU/Linux 协会吉祥物，Tux 的公仔
</div>
</div>
<div class="prize-item vertical-middle">
<img src="assets/love.svg">
<div>
我们感激你参加此次活动
</div>
</div>
</div>
<h4>
三等奖
</h4>
<div class="prizes">
<div class="prize-item vertical-middle">
<img src="assets/tux.svg">
<div>
GNU/Linux 协会吉祥物，Tux 的公仔
</div>
</div>
<div class="prize-item vertical-middle">
<img src="assets/love.svg">
<div>
我们感激你参加此次活动
</div>
</div>
</div>
</div>
</div>
<div class="accordion-header">
设计要求
<span class="transistable float-right acch">
▸
</span>
</div>
<div class="transistable accordion-body collapsed">
<div class="accordion-content">
你需要设计两个页面：<a href="https://linux.dgut.edu.cn">协会主页 (<code>index.html</code>)</a> 和 <a href="https://linux.dgut.edu.cn/web/2019/12/12/RetwoClass.html">协会博客页 (<code>blog.html</code>)</a>。再次强调<b>代码是非必要的，</b>你可以给我们提交 Photoshop 设计文件，或直接放图片，都可以。
<h4>协会首页</h4>
<p>协会首页可以非常简洁，也可以加适当说明协会的性质。作为协会的入口，我们鼓励你设计出轻快，明了的感觉。另一方面，首页也可以作为内容入口，展示我们以往的推文。</p>
<h4>协会博客页</h4>
<p>博客页中通常会有内容和干货。在里面，要记录文章作者、文章分类、发布日期、和永久链接。</p>
<h4>拒绝抄袭</h4>
<p>我们鼓励任意形式的创作，但是我们<b>拒绝抄袭</b>。抄袭是指跟其他网站设计几乎一模一样的设计。Material Design 等设计流派不在抄袭的范畴内。</p>
<h4>没有别的要求了</h4>
<p>以上就是所有的要求了。我们对设计本身的要求非常低，所以放开你的想象力来设计吧！我们同时也接受你使用任意框架/库，Bootstrap, AngularJS, Vue.js, React, Reason... </p>
<h4>示例</h4>
<p>在这里有一份不太可能得奖，但一样算合法参赛作品的示例作品：</p>
<p><a href="examples/index.html"><code>index.html</code></a></p>
<p><a href="examples/blog.html"><code>blog.html</code></a></p>
<h4>额外资源</h4>
<a href="assets/logo.png">协会 logo</a>
</div>
</div>
<div class="accordion-header">
作品提交方法
<span class="transistable float-right acch">
▸
</span>
</div>
<div class="transistable accordion-body collapsed">
<div class="accordion-content">
在活动期间把作品发往 <a href="mailto:linux@dgut.edu.cn">linux@dgut.edu.cn</a> 即可。你也可以点最上面那个按钮。
</div>
</div>
<div class="accordion-header">
评奖日程
<span class="transistable float-right acch">
▸
</span>
</div>
<div class="transistable accordion-body collapsed">
<div class="accordion-content">
<div class="timeline">
<div class="timestamp">
<div class="time-node">
</div>
<div class="time">
2020/4/25
</div>
</div>
<div class="line">
开始接受作品提交
</div>
<div class="timestamp">
<div class="time-node">
</div>
<div class="time">
2020/5/5
</div>
</div>
<div class="line">
作品提交截止，协会内部开始讨论最佳作品
</div>
<div class="timestamp">
<div class="time-node">
</div>
<div class="time">
2020/5/7
</div>
</div>
<div class="line">
协会公示获奖名单
</div>
<div class="timestamp">
<div class="time-node">
</div>
<div class="time">
未来
</div>
</div>
<div class="line">
发放奖品
</div>
</div>
</div>
</div>
<div class="accordion-header">
还有疑问？
<span class="transistable float-right acch">
▸
</span>
</div>
<div class="transistable accordion-body collapsed">
<div class="accordion-content">
发送邮件至 <a href="mailto:42yeah@gmx.fr">42yeah@gmx.fr</a> ，或直接添加微信 id: <code>EMPOWEREDBYCOLA</code> ，然后询问即可。
</div>
</div>
</div>
<div class="copy details">
Copyleft 2020 GNU/Linux 协会。<br />
活动最终解释权，当然是由 GNU/Linux 协会所有啦
</div>
</div>
</div>
<script src="js/main.js"></script>
</body>
</html>