Skip to content

Commit c2dbf02

Browse files
mytharchermytharcher
committed
Adjust index style.
1 parent 044cbba commit c2dbf02

2 files changed

Lines changed: 59 additions & 56 deletions

File tree

‎assets/css/common.css‎

Lines changed: 29 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ html,body{
1515
height: 100%;
1616
}
1717
body{
18-
color: #555;
18+
color: #333;
1919
font-size: 14px;
2020
font-family: "Microsoft YaHei","微软雅黑",Arial,Helvetica,sans-serif;
2121
}
@@ -54,14 +54,32 @@ a:hover{
5454

5555

5656

57-
article>h1:first-child{margin:0;}
57+
nav{
58+
height: 60px;
59+
}
60+
nav ul{
61+
position: absolute;
62+
top: 0;
63+
right: 0;
64+
padding: 20px 0;
65+
}
66+
nav li{
67+
list-style: none;
68+
display: inline-block;
69+
height: 20px;
70+
line-height: 20px;
71+
vertical-align: middle;
72+
margin-left: 20px;
73+
}
74+
75+
5876
article h1,
5977
article h2,
6078
article h3,
6179
article h4,
6280
article h5,
6381
article h6,
64-
article p{margin:.8em 0;}
82+
article p{margin:1em 0;}
6583
article h1{font-size: 2.2em; line-height: 1.2em;}
6684
article h2{font-size: 2em; line-height: 1.2em;}
6785
article h3{font-size: 1.8em; line-height: 1.2em;}
@@ -70,7 +88,7 @@ article h5{font-size: 1.4em; line-height: 1.2em;}
7088
article h6{font-size: 1.2em; line-height: 1.2em;}
7189
article figure{margin: 1em 0;}
7290
article p img,
73-
article figure img{max-width: 100%;}
91+
article figure img{max-width: 100%; margin-bottom: .5em;}
7492
article figure.half img{max-width: 50%;}
7593
article figure.half img.margin{max-width: 46%; margin: 2%; box-shadow: 0 5px 15px rgba(0,0,0,.5);}
7694
article ul,
@@ -88,3 +106,10 @@ article th{background:#eee; text-align:left;}
88106
article td{background:#fff;}
89107
article table a{margin:0;}
90108
article blockquote{line-height:1.6em; margin:1em 0 1em 1.5em; border-left:2px solid #eee; padding-left:1em; font-size:90%;}
109+
110+
@media (max-width: 640px) {
111+
.container{
112+
width: 90%;
113+
max-width: 90%;
114+
}
115+
}

‎index.html‎

Lines changed: 30 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -58,9 +58,6 @@
5858
height: 60px;
5959
}
6060

61-
.row{
62-
position: relative;
63-
}
6461
.container{
6562
position: relative;
6663
width: 80%;
@@ -92,7 +89,6 @@
9289
}
9390

9491
header{
95-
margin-top: 50px;
9692
text-align: center;
9793
}
9894
header h1{
@@ -141,28 +137,19 @@
141137
font-size: 80%;
142138
}
143139

140+
@media (min-width: 1024px) {
141+
header.container{
142+
margin-top: 50px;
143+
}
144+
}
145+
144146
@media (max-width: 1024px) {
145147
.container{
146148
width: 90%;
147149
}
148-
header .container{
149-
padding-right: 0;
150-
padding-top: 50%;
151-
background-position: top 20% center;
152-
text-align: center;
153-
}
154-
header form dd{
155-
text-align: left;
156-
}
157150
}
158151

159152
@media (max-width: 640px) {
160-
header .container{
161-
padding-top: 80%;
162-
background-position: top 10% center;
163-
background-size: 50%;
164-
text-align: left;
165-
}
166153
header h1{
167154
font-size: 2em;
168155
}
@@ -181,48 +168,39 @@
181168

182169
<div class="holder">
183170

184-
<nav class="row">
185-
<div class="container">
186-
<ul>
187-
<li><a href="https://github.com/yncoder/yncoder.github.io/issues" target="_blank">社区讨论</a></li>
188-
<li><iframe src="https://ghbtns.com/github-btn.html?user=yncoder&amp;repo=yncoder.github.io&amp;type=watch&amp;count=true&amp;v=2" frameborder="0" scrolling="0" width="100" height="20"></iframe></li>
189-
</ul>
190-
</div>
171+
<nav class="container">
172+
<ul>
173+
<li><a href="https://github.com/yncoder/yncoder.github.io/issues" target="_blank">社区讨论</a></li>
174+
<li><iframe src="https://ghbtns.com/github-btn.html?user=yncoder&amp;repo=yncoder.github.io&amp;type=watch&amp;count=true&amp;v=2" frameborder="0" scrolling="0" width="100" height="20"></iframe></li>
175+
</ul>
191176
</nav>
192177

193-
<header class="row">
194-
<div class="container">
195-
<figure>
196-
<img src="assets/img/logo-160.png" width="160" height="160" alt="&lt;yn/&gt;" />
197-
<h1>Yncoder</h1>
198-
</figure>
199-
<hgroup>
200-
<h2>分享 · 交流 · 共创</h2>
201-
<blockquote>我们相信，每个开发者都是富有创造力的个体，即使在这块IT欠发达的土地上，我们也并不孤独。</blockquote>
202-
</hgroup>
203-
</div>
178+
<header class="container">
179+
<figure>
180+
<img src="assets/img/logo-160.png" width="160" height="160" alt="&lt;yn/&gt;" />
181+
<h1>Yncoder</h1>
182+
</figure>
183+
<hgroup>
184+
<h2>分享 · 交流 · 共创</h2>
185+
<blockquote>我们相信，每个开发者都是富有创造力的个体，即使在这块IT欠发达的土地上，我们也并不孤独。</blockquote>
186+
</hgroup>
204187
</header>
205188

206-
<main class="row">
207-
<div class="container">
208-
<h3>社区活动</h3>
209-
<ul>
210-
{% assign list = site.posts | sort:"date" %}
211-
{% for item in list %}
212-
<li class="status-{{ item.status }}"><a href="{{ item.url }}">{{ item.title }}</a></li>
213-
{% endfor %}
214-
</ul>
215-
</div>
189+
<main class="container">
190+
<h3>社区活动</h3>
191+
<ul>
192+
{% assign list = site.posts | sort:"date" %}
193+
{% for item in list %}
194+
<li class="status-{{ item.status }}"><a href="{{ item.url }}">{{ item.title }}</a></li>
195+
{% endfor %}
196+
</ul>
216197
</main>
217198

218199
</div>
219200

220-
<footer class="row">
221-
<div class="container">
222-
<p class="copyright">&copy; Since 2014</p>
223-
</div>
201+
<footer class="container">
202+
<p class="copyright">&copy; Since 2014</p>
224203
</footer>
225204

226-
227205
</body>
228206
</html>

0 commit comments

Comments
 (0)