Added theme to website

1 files changed, 46 insertions, 17 deletions

diff --git a/static/style.css b/static/style.css
index 8d96a37..25a88a4 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,3 +1,5 @@
+@import url('https://fonts.googleapis.com/css?family=PT+Serif:400,400i,700,700i&display=swap&subset=latin-ext');
+
 * {
   box-sizing: border-box;
 }
@@ -5,12 +7,20 @@
 body {
   line-height: 150%;
   margin-bottom: 100px;
-  font-family: serif;
-  font-size: 16px;
+  font-family: 'PT Serif', serif;
+  font-size: 20px;
+}
+
+a {
+  color: #000;
+  font-style: italic;
+  text-decoration: underline;
+  text-decoration-style: dotted;
+  text-decoration-color: #ccc;
 }
 
 main {
-  max-width: 760px;
+  max-width: 800px;
   padding: 20px 30px;
   margin: 0 auto;
 }
@@ -28,6 +38,10 @@ header {
   margin-block-end: 40px;
 }
 
+p {
+  line-height: 1.5;
+}
+
 blockquote {
   position: relative;
   margin-block-start: 30px;
@@ -51,17 +65,17 @@ blockquote p {
 }
 
 h1 {
-  font-size: 280%;
+  font-size: 260%;
   line-height: initial;
 }
 
 h2 {
-  font-size: 200%;
+  font-size: 180%;
   line-height: initial;
 }
 
 h3 {
-  font-size: 160%;
+  font-size: 140%;
   line-height: initial;
 }
 
@@ -71,17 +85,24 @@ img, video {
   display: block;
 }
 
-ul.article-list li {
-  margin-bottom: 10px;
+ul li {
+  list-style-type: square;
 }
 
-ul.article-list li div {
-  display: flex;
+ul.article-list {
+  margin-block-end: 60px;
+}
+
+ul.article-list li {
+  margin-bottom: 35px;
 }
 
 ul.article-list time {
-  display: inline-block;
-  min-width: 150px;
+  display: block;
+}
+
+ul.article-list li a {
+  font-size: 120%;
 }
 
 ul.project-list li {
@@ -92,10 +113,6 @@ article .info {
   font-style: oblique;
 }
 
-pre {
-  overflow: auto;
-}
-
 table {
   width: 100%;
 }
@@ -109,8 +126,12 @@ th, td {
   padding: 5px 10px;
 }
 
+pre {
+  overflow: auto;
+}
+
 code, pre {
-  font-size: 13px;
+  font-size: 16px;
 }
 
 code {
@@ -140,6 +161,10 @@ p.modified {
 }
 
 @media only screen and (max-width:480px) {
+  body {
+    font-size: 18px;
+  }
+
   main {
     padding: 20px;
   }
@@ -183,6 +208,10 @@ p.modified {
   h3 {
     font-size: 160%;
   }
+
+  code, pre {
+    font-size: 14px;
+  }
 }
 
 @media (prefers-color-scheme: light) {