8000 generate the new GitHub readme style · suskycode/github-markdown-css@9cac033 · GitHub
[go: up one dir, main page]

Skip to content

Commit 9cac033

Browse files
committed
generate the new GitHub readme style
https://twitter.com/mdo/status/496475496457072640 I just ran `npm run generate`. Yay programming.
1 parent a77a701 commit 9cac033

File tree

2 files changed

+75
-64
lines changed

2 files changed

+75
-64
lines changed

github-markdown.css

Lines changed: 75 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,13 @@
22
font-family: sans-serif;
33
-ms-text-size-adjust: 100%;
44
-webkit-text-size-adjust: 100%;
5-
font: 13px Helvetica, arial, freesans, clean, sans-serif;
5+
font: 13px Helvetica, arial, freesans, clean, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
66
line-height: 1.4;
77
color: #333333;
8-
font-size: 15px;
9-
line-height: 1.7;
108
overflow: hidden;
9+
font-family: "Helvetica Neue", Helvetica, Arial, freesans, sans-serif;
10+
font-size: 16px;
11+
line-height: 1.6;
1112
word-wrap: break-word;
1213
}
1314

@@ -69,10 +70,7 @@
6970
text-decoration: none;
7071
}
7172

72-
.markdown-body a:hover {
73-
text-decoration: underline;
74-
}
75-
73+
.markdown-body a:hover,
7674
.markdown-body a:focus,
7775
.markdown-body a:active {
7876
text-decoration: underline;
@@ -89,18 +87,14 @@
8987

9088
.markdown-body hr:before,
9189
.markdown-body hr:after {
92-
content: " ";
9390
display: table;
91+
content: " ";
9492
}
9593

9694
.markdown-body hr:after {
9795
clear: both;
9896
}
9997

100-
.markdown-body ol ol {
101-
list-style-type: lower-roman;
102-
}
103-
10498
.markdown-body h1,
10599
.markdown-body h2,
106100
.markdown-body h3,
@@ -147,6 +141,10 @@
147141
margin-bottom: 0;
148142
}
149143

144+
.markdown-body ol ol {
145+
list-style-type: lower-roman;
146+
}
147+
150148
.markdown-body dd {
151149
margin-left: 0;
152150
}
@@ -170,19 +168,18 @@
170168
margin-bottom: 0 !important;
171169
}
172170

173-
.markdown-body a.anchor {
171+
.markdown-body .anchor {
172+
position: absolute;
173+
top: 0;
174+
bottom: 0;
175+
left: 0;
174176
display: block;
175177
padding-right: 6px;
176178
padding-left: 30px;
177179
margin-left: -30px;
178-
cursor: pointer;
179-
position: absolute;
180-
top: 0;
181-
left: 0;
182-
bottom: 0;
183180
}
184181

185-
.markdown-body a.anchor:focus {
182+
.markdown-body .anchor:focus {
186183
outline: none;
187184
}
188185

@@ -192,39 +189,50 @@
192189
.markdown-body h4,
193190
.markdown-body h5,
194191
.markdown-body h6 {
195-
margin: 1em 0 15px;
196-
padding: 0;
197-
font-weight: bold;
198-
line-height: 1.7;
199-
cursor: text;
200192
position: relative;
193+
margin-top: 1em;
194+
font-weight: bold;
195+
line-height: 1.4;
201196
}
202197

203198
.markdown-body h1 {
204-
font-size: 2.5em;
205-
border-bottom: 1px solid #ddd;
199+
padding-bottom: 0.3em;
200+
margin-bottom: 16px;
201+
font-size: 2.25em;
202+
font-weight: normal;
203+
line-height: 1.2;
204+
border-bottom: 1px solid #eee;
206205
}
207206

208207
.markdown-body h2 {
209-
font-size: 2em;
208+
padding-bottom: 0.3em;
209+
margin-bottom: 16px;
210+
font-size: 1.75em;
211+
font-weight: normal;
212+
line-height: 1.225;
210213
border-bottom: 1px solid #eee;
211214
}
212215

213216
.markdown-body h3 {
217+
margin-bottom: 0;
214218
font-size: 1.5em;
219+
line-height: 1.43;
215220
}
216221

217222
.markdown-body h4 {
218-
font-size: 1.2em;
223+
margin-bottom: 0.1em;
224+
font-size: 1.25em;
219225
}
220226

221227
.markdown-body h5 {
228+
margin-bottom: 0.2em;
222229
font-size: 1em;
223230
}
224231

225232
.markdown-body h6 {
226-
color: #777;
233+
margin-bottom: 0.2em;
227234
font-size: 1em;
235+
color: #777;
228236
}
229237

230238
.markdown-body p,
@@ -234,21 +242,21 @@
234242
.markdown-body dl,
235243
.markdown-body table,
236244
.markdown-body pre {
237-
margin: 15px 0;
245+
margin-top: 0;
246+
margin-bottom: 16px;
238247
}
239248

240249
.markdown-body hr {
241-
background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAECAYAAACtBE5DAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OENDRjNBN0E2NTZBMTFFMEI3QjRBODM4NzJDMjlGNDgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OENDRjNBN0I2NTZBMTFFMEI3QjRBODM4NzJDMjlGNDgiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4Q0NGM0E3ODY1NkExMUUwQjdCNEE4Mzg3MkMyOUY0OCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4Q0NGM0E3OTY1NkExMUUwQjdCNEE4Mzg3MkMyOUY0OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PqqezsUAAAAfSURBVHjaYmRABcYwBiM2QSA4y4hNEKYDQxAEAAIMAHNGAzhkPOlYAAAAAElFTkSuQmCC) repeat-x 0 0;
242-
border: 0 none;
243-
color: #ccc;
244250
height: 4px;
245251
padding: 0;
246-
margin: 15px 0;
252+
margin: 16px 0;
253+
background-color: #e7e7e7;
254+
border: 0 none;
247255
}
248256

249257
.markdown-body ul,
250258
.markdown-body ol {
251-
padding-left: 30px;
259+
padding-left: 2em;
252260
}
253261

254262
.markdown-body ol ol,
@@ -262,36 +270,36 @@
262270
}
263271

264272
.markdown-body dl dt {
265-
font-size: 14px;
266-
font-weight: bold;
267-
font-style: italic;
268273
padding: 0;
269-
margin-top: 15px;
274+
margin-top: 16px;
275+
font-size: 1em;
276+
font-style: italic;
277+
font-weight: bold;
270278
}
271279

272280
.markdown-body dl dd {
273-
margin-bottom: 15px;
274-
padding: 0 15px;
281+
padding: 0 16px;
282+
margin-bottom: 16px;
275283
}
276284

277285
.markdown-body blockquote {
278-
border-left: 4px solid #DDD;
279286
padding: 0 15px;
280287
color: #777;
288+
border-left: 4px solid #ddd;
281289
}
282290

283291
.markdown-body blockquote>:first-child {
284-
margin-top: 0px;
292+
margin-top: 0;
285293
}
286294

287295
.markdown-body blockquote>:last-child {
288-
margin-bottom: 0px;
296+
margin-bottom: 0;
289297
}
290298

291299
.markdown-body table {
300+
display: block;
292301
width: 100%;
293302
overflow: auto;
294-
display: block;
295303
}
296304

297305
.markdown-body table th {
@@ -300,13 +308,13 @@
300308

301309
.markdown-body table th,
302310
.markdown-body table td {
303-
border: 1px solid #ddd;
304311
padding: 6px 13px;
312+
border: 1px solid #ddd;
305313
}
306314

307315
.markdown-body table tr {
308-
border-top: 1px solid #ccc;
309316
background-color: #fff;
317+
border-top: 1px solid #ccc;
310318
}
311319

312320
.markdown-body table tr:nth-child(2n) {
@@ -320,35 +328,38 @@
320328
}
321329

322330
.markdown-body code {
331+
padding: 0;
332+
padding-top: 0.2em;
333+
padding-bottom: 0.2em;
323334
margin: 0;
324-
border: 1px solid #ddd;
325-
background-color: #f8f8f8;
335+
font-size: 85%;
336+
color: #555;
337+
background-color: #f7f7f7;
326338
border-radius: 3px;
327-
padding: 0;
328339
}
329340

330341
.markdown-body code:before,
331342
.markdown-body code:after {
332-
content: "\00a0";
333343
letter-spacing: -0.2em;
344+
content: "\00a0";
334345
}
335346

336347
.markdown-body pre>code {
337-
margin: 0;
338348
padding: 0;
349+
margin: 0;
350+
font-size: 100%;
339351
white-space: pre;
340-
border: none;
341352
background: transparent;
353+
border: 0;
342354
}
343355

344356
.markdown-body .highlight pre,
345357
.markdown-body pre {
346-
background-color: #f8f8f8;
347-
border: 1px solid #ddd;
348-
font-size: 13px;
349-
line-height: 19px;
358+
padding: 16px;
350359
overflow: auto;
351-
padding: 6px 10px;
360+
font-size: 85%;
361+
line-height: 1.45;
362+
background-color: #f7f7f7;
352363
border-radius: 3px;
353364
}
354365

@@ -357,15 +368,15 @@
357368
}
358369

359370
.markdown-body pre code {
360-
margin: 0;
361-
padding: 0;
362-
background-color: transparent;
363-
border: none;
364-
word-wrap: normal;
365-
max-width: initial;
366371
display: inline;
372+
max-width: initial;
373+
padding: 0;
374+
margin: 0;
367375
overflow: initial;
368376
line-height: inherit;
377+
word-wrap: normal;
378+
background-color: transparent;
379+
border: 0;
369380
}
370381

371382
.markdown-body pre code:before,

screenshot.png

-4.05 KB
Loading

0 commit comments

Comments
 (0)
0