diff --git a/static/archives.tera b/static/archives.tera
index 15ae702..2eeff04 100644
--- a/static/archives.tera
+++ b/static/archives.tera
@@ -1,7 +1,12 @@
-
-
{{ post.post.title }}
-
{{ post.timestamp | date(format="%B %d, %Y") }}
-
- {{ post.markdown_content }}
-
-
\ No newline at end of file
+{% extends "base" %}
+
+{% block body %}
+
+
+ {{ post.timestamp | date(format="%B %d, %Y") }}
+ {{ post.post.title }}
+
+ {{ post.markdown_content }}
+
+
+{% endblock body %}
\ No newline at end of file
diff --git a/static/resources/style.css b/static/resources/style.css
index d9dfeb4..e929b0f 100644
--- a/static/resources/style.css
+++ b/static/resources/style.css
@@ -2,8 +2,9 @@
box-sizing: border-box;
margin: 0;
padding: 0;
- font:300 1em/1.5 PingFangSC-Regular,Microsoft Yahei UI,Noto Sans CJK SC DemiLight,sans-serif;
+ font: 300 1em/1.5 PingFangSC-Regular, Microsoft Yahei UI, Noto Sans CJK SC DemiLight, sans-serif;
}
+
html {
font-size: 14px;
}
@@ -13,6 +14,7 @@ html {
margin: 0 auto;
padding: 5px 10px;
}
+
header {
background-color: #FCFCFC;
border-bottom: solid 1px #DDD;
@@ -26,6 +28,7 @@ header h1 {
padding: 1rem 0;
margin: 0;
}
+
header p {
color: #A3ABB3;
margin: 0;
@@ -34,27 +37,29 @@ header p {
}
-
section.article {
margin: 4rem 0;
}
section.article p.mate {
- color:#A3ABB3;
+ color: #A3ABB3;
margin: 0;
font-size: .9rem;
}
+
section.article p.mate a {
- color:#A3ABB3;
+ color: #A3ABB3;
margin: 0 5px;
/* font-size: .9rem; */
text-decoration: none;
}
+
section.article p.mate a:hover {
color: #000;
/* text-decoration: underline; */
border-bottom: 1px solid #000;
}
+
section.article .title {
font-size: 1.5em;
margin-bottom: 1rem;
@@ -66,13 +71,352 @@ section.article .title {
padding: 0;
}
-
section.article a.title:hover {
border-bottom: 2px solid #dc1313
}
-
section.article section.desc {
color: #555;
margin-top: .25rem;
}
+
+.single.article {
+ padding: 3rem 0.25rem;
+ max-width: 800px;
+ margin: 0 auto;
+}
+
+.single.article h2 {
+ font-size: 1.5em;
+ margin-bottom: 1rem;
+ margin-top: 0.5rem;
+ text-transform: uppercase;
+ color: #444;
+ text-decoration: none;
+ font-weight: 400;
+ padding: 0;
+}
+
+/*MARKDOWN*/
+.yue {
+ font: 300 1em/1.62 Georgia, "Xin Gothic", "Hiragino Sans GB", "Droid Sans Fallback", "Microsoft YaHei", sans-serif;
+ color: #444443
+}
+
+.windows .yue {
+ font-size: 16px;
+ font-family: Georgia, SimSun, sans-serif
+}
+
+.yue ::-moz-selection {
+ background-color: rgba(0, 0, 0, .2)
+}
+
+.yue ::selection {
+ background-color: rgba(0, 0, 0, .2)
+}
+
+.yue h1, .yue h2, .yue h3, .yue h4, .yue h5, .yue h6 {
+ font-family: PingFang SC, Verdana, Helvetica Neue, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
+ color: #000;
+ font-weight: 400
+}
+
+.yue h1 {
+ font-size: 1.75em;
+ margin: .67em 0
+}
+
+.yue > h1 {
+ margin-top: 0;
+ font-size: 1.75em
+}
+
+.yue > h1:before {
+ content: "#";
+ color: #d6d6d6;
+ margin-right: 0.25rem;
+}
+
+.yue h2:before {
+ content: "##";
+ color: #d6d6d6;
+ margin-right: 0.25rem;
+}
+.yue h3:before {
+ content: "###";
+ color: #d6d6d6;
+ margin-right: 0.25rem;
+}
+.yue h4:before {
+ content: "####";
+ color: #d6d6d6;
+ margin-right: 0.25rem;
+}
+.yue h5:before {
+ content: "#####";
+ color: #d6d6d6;
+ margin-right: 0.25rem;
+}
+.yue h6:before {
+ content: "######";
+ color: #d6d6d6;
+ margin-right: 0.25rem;
+}
+
+.yue h2 {
+ font-size: 1.5em;
+ margin: .83em 0
+}
+
+
+
+.yue h3 {
+ font-size: 1.17em;
+ margin: 1em 0
+}
+
+.yue h4, .yue h5, .yue h6 {
+ font-size: 1em;
+ margin: 1.6em 0 1em 0
+}
+
+.yue h6 {
+ font-weight: 500
+}
+
+.yue p {
+ margin-top: 0;
+ margin-bottom: 1.46em
+}
+
+.yue a {
+ color: #dc1313;
+ word-wrap: break-word;
+ text-decoration: none;
+ /*border-bottom: none*/
+}
+
+.yue a:hover {
+ /*border-bottom: 1px solid #dc1313*/
+ text-decoration: underline;
+}
+
+.yue h1 a, .yue h2 a, .yue h3 a {
+ text-decoration: none
+}
+
+.yue b, .yue strong {
+ font-weight: 700;
+ color: #222223
+}
+
+.yue b:before, .yue strong:before {
+ content: "**";
+ color: #d6d6d6;
+ margin-right: 0.1rem;
+}
+.yue b:after, .yue strong:after {
+ content: "**";
+ color: #d6d6d6;
+ margin-left: 0.1rem;
+}
+
+.yue em, .yue i {
+ font-style: italic;
+ font-weight: 400;
+ color: #222223
+}
+
+.yue em:before, .yue i:before {
+ content: "*";
+ color: #d6d6d6;
+ margin-right: 0.1rem;
+}
+.yue em:after, .yue i:after {
+ content: "*";
+ color: #d6d6d6;
+ margin-left: 0.1rem;
+}
+
+.yue img {
+ max-width: 100%;
+ height: auto;
+ margin: .2em 0
+}
+
+.yue a img {
+ border: none
+}
+
+.yue figure {
+ position: relative;
+ clear: both;
+ outline: 0;
+ margin: 10px 0 30px;
+ padding: 0;
+ min-height: 100px
+}
+
+.yue figure img {
+ display: block;
+ max-width: 100%;
+ margin: auto auto 4px;
+ box-sizing: border-box
+}
+
+.yue figure figcaption {
+ position: relative;
+ width: 100%;
+ text-align: center;
+ left: 0;
+ margin-top: 10px;
+ font-weight: 400;
+ font-size: 14px;
+ color: #666665
+}
+
+.yue figure figcaption a {
+ text-decoration: none;
+ color: #666665
+}
+
+.yue hr {
+ border: none;
+ border-bottom: 1px solid #cfcfcf;
+ margin-bottom: .8em;
+ height: 10px
+}
+
+.yue blockquote {
+ margin: 0 0 1.64em 0;
+ border-left: 3px solid #dadada;
+ padding-left: 12px
+}
+
+.yue ol, .yue ul {
+ margin: 0 0 24px 6px;
+ padding-left: 16px
+}
+
+.yue ul {
+ list-style-type: square
+}
+
+.yue ol {
+ list-style-type: decimal
+}
+
+.yue li {
+ margin-bottom: .2em
+}
+
+.yue li ol, .yue li ul {
+ margin-top: 0;
+ margin-bottom: 0;
+ margin-left: 14px
+}
+
+.yue li ul {
+ list-style-type: disc
+}
+
+.yue li ul ul {
+ list-style-type: circle
+}
+
+.yue li p {
+ margin: .4em 0 .6em
+}
+
+.yue .unstyled {
+ list-style-type: none;
+ margin: 0;
+ padding: 0
+}
+
+.yue code, .yue tt {
+ font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
+ padding: 0 3px;
+ padding-top: .2em;
+ padding-bottom: .2em;
+ margin: 0;
+ font-size: 90%;
+ background-color: rgba(0, 0, 0, .04);
+ border-radius: 3px;
+ word-break: break-all
+}
+
+.yue pre {
+ font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
+ padding: 16px;
+ overflow: auto;
+ font-size: 95%;
+ line-height: 1.45;
+ background-color: #f7f7f7;
+ border-radius: 3px
+}
+
+.yue pre code, .yue pre tt {
+ color: #4c4c4c;
+ border: none;
+ background: 0 0;
+ padding: 0
+}
+
+.yue table {
+ width: 100%;
+ max-width: 100%;
+ border-collapse: collapse;
+ border-spacing: 0;
+ margin-bottom: 1.5em;
+ font-size: .96em;
+ box-sizing: border-box
+}
+
+.yue td, .yue th {
+ text-align: left;
+ padding: 4px 8px 4px 10px;
+ border: 1px solid #dadada
+}
+
+.yue td {
+ vertical-align: top
+}
+
+.yue tr:nth-child(even) {
+ background-color: #efefee
+}
+
+.yue iframe {
+ display: block;
+ max-width: 100%;
+ margin-bottom: 30px
+}
+
+.yue figure iframe {
+ margin: auto
+}
+
+.yue table pre {
+ margin: 0;
+ padding: 0;
+ border: none;
+ background: 0 0
+}
+
+@media (min-width: 1100px) {
+ .yue blockquote {
+ margin-left: 10px;
+ padding-left: 20px;
+ border-width: 2px
+ }
+
+ .yue blockquote blockquote {
+ margin-left: 10px
+ }
+}
+
+img {
+ max-width: 100%;
+}
\ No newline at end of file