Minimalist theme.

1 files changed, 47 insertions, 186 deletions

diff --git a/assets/css/main.css b/assets/css/main.css
index d3355d9..ebaf1dd 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1,218 +1,79 @@
-@font-face {
-  font-family: 'Averia Serif';
-  src: url('/assets/fonts/AveriaSerif-Light.ttf') format('truetype');
-}
-
-:root {
-  --main-bg-color: #ffffff;
-  --main-fg-color: #000000;
-  --font-family: 'Averia Serif', serif;
-}
-
-*,
-*:before,
-*:after {
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-}
-
 body {
-  height: 100%;
-  text-decoration-skip: ink;
-  color: var(--main-fg-color);
-  padding-top: 10px;
-  font-family: var(--font-family);
-  background-color: var(--main-bg-color);
-  background-size: 2px 2px;
-}
-
-::selection {
-  color: var(--main-bg-color);
-  background: var(--main-fg-color);
-}
-::-moz-selection {
-  color: var(--main-bg-color);
-  background: var(--main-fg-color);
-}
-
-.footer {
-  position: relative;
-  bottom: 0;
-  width: 100%;
-  padding-top: 10px;
-  padding-bottom: 10px;
-  color: rgba(0, 0, 0, 0.6);
-}
-
-a { 
-  cursor: default;
-  color: var(--main-fg-color);
-  text-decoration: underline 1.5px; 
-  text-underline-offset: 2.5px;
+  font: 17px/1.6 sans-serif;
+  text-rendering: optimizeLegibility;
+  padding: 2rem;
+  max-width: 70ch;
+  margin: 0 auto;
 }
 
-.link-decor-none {
-  text-decoration: none;
+h1, h2, h3, h4, h5 {
+  font-size: inherit;
+  font-weight: inherit;
+  text-decoration: underline;
 }
 
-img {
-  width: 100%;
-}
-
-table {
-  width: 100%;
-}
-
-table, tr, td {
-  border: none !important;
-}
-
-td {
-  background-color: transparent;
-}
-
-.project-item {
-  border: none;
-  vertical-align: top;
-  width: 50%;
-}
-
-#navlist
-{
-  list-style-type: none;
-  margin-left: 0 !important;
-}
-
-#navlist li
-{
+header h1 {
   display: inline;
-  list-style-type: none inside;
-  padding-right: 20px;
-}
-
-#navlist > .active > a {
-  font-weight: 600;
-  text-decoration: none;
-}
-
-@media (min-width: 400px) {
-  #nav-container {
-    padding: 0 6px; 
-  }
-  .container-2 {
-    padding: 0 3px; 
-  }
-}
-
-@media (min-width: 550px) {
-  .post-container {
-    padding: 0; 
-  }
-}
-
-.author {
-  font-size: 1.3em;
-  padding-top: 20px;
-}
-
-.tagline {
-  padding-top: 20px;
-}
-
-.center {
-  text-align: center;
-}
-
-.right {
-  text-align: right;
-}
-
-.justify {
-  text-align: justify;
 }
 
-.twocol::first-letter {
-  font-size: 2.5em;
+pre, code {
+  font-size: inherit;
+  background: #eee;
 }
 
-.twocol {
-  -ms-word-break: keep-all;
-  word-break: keep-all;
-  hyphens: auto;
-  -webkit-hyphens: auto;
-  -moz-hyphens: auto;
-}
-
-@media only screen
-and (min-device-width : 768px)  {
-  .twocol {
-    -moz-column-count: 2;
-    -moz-column-gap: 20px;
-    -webkit-column-count: 2;
-    -webkit-column-gap: 20px;
-    column-count: 2;
-    column-gap: 20px;
-    width: 100%;
-  }
-  .tag{
-    width: 23%;
-    margin-right:0;
-  }
+pre {
+  margin-bottom: 2rem;
 }
 
-.posts-td {
+pre code {
+  display: block;
   border: none;
-  vertical-align: top;
+  padding: 1em;
+  background: none;
+  overflow-x: auto;
 }
 
-.posts-td-link a {
-  display: block;
+ol, ul {
+  list-style: outside; 
+  padding: 0;
+  margin-left: 1em; 
 }
 
-.posts-td-time {
-  min-width: 100px;
-  white-space: nowrap;
+#post-list {
+  margin-left: 0;
 }
 
-.author {
-  margin-bottom: 2rem;
-}
-
-#footer-text {
-  font-size: 14px;
+#post-list li {
+  list-style-type: none;
+  display: flex;
+  font-variant-numeric: tabular-nums;
 }
 
-.post-author {
-  margin-top: 4px;
+#post-list li a {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
-pre {
-  border: none;
-  max-height: 400px;
-  overflow-y: auto;
-  scrollbar-width: none;
-  -ms-overflow-style: none;
+#post-list a {
+  text-decoration: none;
+  color: inherit;
 }
 
-pre::-webkit-scrollbar {
-  display: none;
+time {
+  padding-right: 1rem;
 }
 
-input {
-  font-family: var(--font-family);
+blockquote {
+  margin: 1em 0;
+  padding: 0 2em;
+  border-left: 3px solid #eee;
 }
 
-#search-box {
-  border-radius: 0;
-  border-color: var(--main-fg-color);
-  color: var(--main-fg-color) !important;
-  background-color: var(--main-bg-color);
+img {
+  max-width: 100%;
 }
 
-#search-btn {
-  border-radius: 0;
-  border-color: var(--main-fg-color);
-  color: var(--main-fg-color);
-  background-color: var(--main-bg-color);
+a, a:visited {
+  color: initial;
 }