|
|
@@ -1,51 +1,63 @@ |
|
|
|
body { |
|
|
|
max-width: 800px; |
|
|
|
margin: auto; |
|
|
|
padding: 1em; |
|
|
|
line-height: 1.5em; |
|
|
|
max-width: 800px; |
|
|
|
margin: auto; |
|
|
|
padding: 1em; |
|
|
|
line-height: 1.5em; |
|
|
|
text-align: justify; |
|
|
|
text-justify: inter-word; |
|
|
|
} |
|
|
|
|
|
|
|
/* header and footer areas */ |
|
|
|
.menu { padding: 0; } |
|
|
|
.menu li { display: inline-block; } |
|
|
|
.article-meta, .menu a { |
|
|
|
text-decoration: none; |
|
|
|
background: #eee; |
|
|
|
padding: 5px; |
|
|
|
border-radius: 5px; |
|
|
|
text-decoration: none; |
|
|
|
padding: 5px; |
|
|
|
border-radius: 5px; |
|
|
|
} |
|
|
|
.menu, .article-meta, footer { text-align: center; } |
|
|
|
.menu, .article-meta, h1, h2, footer { text-align: center; } |
|
|
|
.title { font-size: 1.1em; } |
|
|
|
footer a { text-decoration: none; } |
|
|
|
hr { |
|
|
|
border-style: dashed; |
|
|
|
color: #ddd; |
|
|
|
border-style: dashed; |
|
|
|
} |
|
|
|
|
|
|
|
/* code */ |
|
|
|
pre { |
|
|
|
border: 1px solid #ddd; |
|
|
|
box-shadow: 5px 5px 5px #eee; |
|
|
|
padding: 1em; |
|
|
|
overflow-x: auto; |
|
|
|
border: 1px solid; |
|
|
|
padding: 1em; |
|
|
|
overflow-x: auto; |
|
|
|
} |
|
|
|
code { background: #f9f9f9; } |
|
|
|
pre code { background: none; } |
|
|
|
|
|
|
|
/* misc elements */ |
|
|
|
img, iframe, video { max-width: 100%; } |
|
|
|
main { hyphens: auto; } |
|
|
|
blockquote { |
|
|
|
background: #f9f9f9; |
|
|
|
border-left: 5px solid #ccc; |
|
|
|
padding: 3px 1em 3px; |
|
|
|
padding: 3px 1em 3px; |
|
|
|
} |
|
|
|
|
|
|
|
table { |
|
|
|
margin: auto; |
|
|
|
border-top: 1px solid #666; |
|
|
|
border-bottom: 1px solid #666; |
|
|
|
margin: auto; |
|
|
|
border-top: 1px solid; |
|
|
|
border-bottom: 1px solid; |
|
|
|
} |
|
|
|
table thead th { border-bottom: 1px solid #ddd; } |
|
|
|
table thead th { border-bottom: 1px solid } |
|
|
|
th, td { padding: 5px; } |
|
|
|
thead, tfoot, tr:nth-child(even) { background: #eee; } |
|
|
|
|
|
|
|
/* about page elements */ |
|
|
|
|
|
|
|
img[src~="avatar"] { |
|
|
|
display: block; |
|
|
|
float: right; |
|
|
|
height: 256px; |
|
|
|
width: 256px; |
|
|
|
padding-left: 1em; |
|
|
|
} |
|
|
|
|
|
|
|
@media only screen and (max-width: 512px) { |
|
|
|
img[src~="avatar"] { |
|
|
|
height: 128px; |
|
|
|
width: 128px; |
|
|
|
} |
|
|
|
} |