blob: afe121b8827b3901bcc9823ec03c571b7933f4f9 [file] [log] [blame]
Tang Cheng60ba8032016-06-20 15:31:17 +08001/**
2 * Custom Bootstrap and Theme Overrides
3 *
4 * Bootstrap designers: Feel free to remove all of the styles in this
5 * file to start a fresh new design. Most of the critical/functional
6 * styles are found within the other CSS files, with this one included last.
7 *
8 * Bootstrap and Hexo markdown style overrides would typically happen here.
9 */
10
11/* Globals */
12
13body {
14 font-family: Georgia, "Times New Roman", Times, serif;
15 color: #555;
16}
17
18h1, .h1,
19h2, .h2,
20h3, .h3,
21h4, .h4,
22h5, .h5,
23h6, .h6 {
24 margin-top: 1em;
25 margin-bottom: 15px;
26 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
27 font-weight: normal;
28 color: #333;
29}
30
31p {
32 margin: 0 0 15px;
33}
34
35code {
36 background-color: #eeeeee;
37 font-size: 80%;
38}
39
40.fa { margin-right: 0.25em; }
41
42/* Buttons */
43.btn {
44 border-radius: 30px;
45}
46.btn-primary {
47 background-color: #428bca;
48 border-color: #337ab7;
49}
50.nav-pills>li>a {
51 border-radius: 30px;
52}
53
54/* Override Bootstrap's default container width */
55@media (min-width: 1200px) {
56 .container {
57 width: 970px;
58 }
59}
60
61/*
62 * Masthead for nav
63 */
64
65.navbar {
66 background-color: #428bca;
67 -webkit-box-shadow: inset 0 -2px 5px rgba(0,0,0,.1);
68 box-shadow: inset 0 -2px 5px rgba(0,0,0,.1);
69}
70
71.navbar-inverse { border: 0; }
72
73.navbar-inverse .navbar-toggle {
74 border-color: #cdddeb;
75}
76.navbar-inverse .navbar-toggle .icon-bar {
77 background-color: #cdddeb;
78}
79
80.navbar-inverse .navbar-toggle:focus,
81.navbar-inverse .navbar-toggle:hover {
82 background-color: #65A2D6;
83}
84
85.navbar-inverse .navbar-brand,
86.navbar-inverse .navbar-nav>li>a {
87 color: #cdddeb;
88 font-weight: 500;
89}
90
91.navbar-inverse .navbar-collapse,
92.navbar-inverse .navbar-form {
93 border-color: #cdddeb;
94}
95
96.navbar-inverse .navbar-nav>li>a.active {
97 color: #fff;
98}
99
100@media (min-width: 768px) {
101 .navbar {
102 border-radius: 0;
103 min-height: 40px;
104 }
105
106 /** The following may need modification depending on
107 the size of your `navbar-brand` (if enabled) */
108 #main-menu-navbar {
109 margin-left: -30px;
110 }
111 .navbar-nav>li>a {
112 padding-top: 10px;
113 padding-bottom: 10px;
114 }
115 /** ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */
116
117 .navbar-inverse .navbar-nav>li>a.active:after {
118 position: absolute;
119 bottom: 0;
120 left: 50%;
121 width: 0;
122 height: 0;
123 margin-left: -5px;
124 vertical-align: middle;
125 content: " ";
126 border-right: 5px solid transparent;
127 border-bottom: 5px solid;
128 border-left: 5px solid transparent;
129 }
130}
131
132/*
133 * Blog header and description
134 */
135
136.blog-header {
137 padding-bottom: 20px;
138}
139.blog-title {
140 margin-top: 30px;
141 margin-bottom: 0;
142 font-size: 60px;
143 font-weight: normal;
144}
145.blog-description {
146 font-size: 20px;
147 color: #999;
148}
149
150/*
151 * Main column and sidebar layout
152 */
153
154.blog-main {
155 font-size: 18px;
156 line-height: 1.5;
157}
158.blog-main > article:last-of-type {
159 margin-bottom: 30px;
160}
161
162/* Sidebar modules for boxing content */
163.sidebar-module {
164 padding: 15px;
165 margin: 0 -15px 15px;
166}
167.sidebar-module h4 {
168 margin-top: 0;
169 margin-bottom: 10px;
170}
171.sidebar-module-inset {
172 padding: 15px;
173 background-color: #f5f5f5;
174 border-radius: 4px;
175}
176.sidebar-module-inset p:last-child,
177.sidebar-module-inset ul:last-child,
178.sidebar-module-inset ol:last-child {
179 margin-bottom: 0;
180}
181
182.sidebar-module-list {
183 padding-left: 0;
184 list-style: none;
185}
186.sidebar-module-list-child {
187 padding-left: 25px;
188}
189
190
191/*
192 * Blog posts
193 */
194
195.article {
196 margin-bottom: 60px;
197}
198
199.article-header h1 {
200 margin-top: 0;
201 margin-bottom: 5px;
202}
203.article-header h1 a {
204 color: #333;
205}
206.article-header h1 a:hover {
207 color: #23527c;
208 text-decoration: none;
209}
210
211.article-meta {
212 margin-bottom: 20px;
213 color: #999;
214 font-size: 0.9em;
215}
216.article-meta > * {
217 display: inline-block;
218 margin-right: 15px;
219}
220.article-meta a {
221 color: inherit;
222}
223
224.article-entry .article-more-link {
225 margin: 15px 0;
226}
227.article-entry .thumbnail .caption {
228 padding: 0;
229}
230.article-entry>*:last-child {
231 margin-bottom: 15px;
232}
233
234/* article footer content */
235.article-footer {
236 font-size: 0.85em;
237 border-top: 1px solid #eee;
238 padding-top: 15px;
239}
240.article-footer:after { /* clearfix */
241 content: " ";
242 visibility: hidden;
243 display: block;
244 height: 0;
245 clear: both;
246}
247.article-footer a {
248 color: #999;
249 text-decoration: none;
250}
251.article-footer a:hover {
252 color: #666;
253 text-decoration: underline;
254}
255
256/*
257 * Archives
258 */
259
260.archives-wrap {
261 margin-bottom: 30px;
262}
263
264.archive-year-wrap a,
265.archive-article .article-datetime a {
266 color: #333;
267 text-decoration: none;
268}
269
270.archive-article .article-datetime a {
271 color: #999;
272 text-decoration: none;
273}
274
275/*
276 * Pagination
277 */
278#page-nav {
279 text-align: center;
280}
281#page-nav .pagination {
282 margin-top: 0;
283 margin-bottom: 30px;
284}
285#page-nav .pagination .active>* {
286 background-color: #428bca;
287 border-color: #428bca;
288}
289#page-nav .pagination>li:last-child>* {
290 border-top-right-radius: 30px;
291 border-bottom-right-radius: 30px;
292}
293#page-nav .pagination>li:first-child>* {
294 border-top-left-radius: 30px;
295 border-bottom-left-radius: 30px;
296}
297
298/*
299 * Footer
300 */
301
302.blog-footer {
303 padding: 40px 0;
304 color: #999;
305 text-align: center;
306 background-color: #f9f9f9;
307 border-top: 1px solid #e5e5e5;
308}
309.blog-footer p:last-child {
310 margin-bottom: 0;
311}