2 files changed, 53 insertions, 5 deletions
diff --git a/static/css/yaroslavps.css b/static/css/yaroslavps.css
index f4f722f..21e70a6 100644
--- a/static/css/yaroslavps.css
+++ b/static/css/yaroslavps.css
@@ -3,7 +3,10 @@
 html, body {
   width: 100%;
   min-height: 100vh;
-  background-color: #1b1e25;
+  background-color: #000;
+  background-image: url("/svg/background.svg");
+  background-size: 45px 45px;
+  background-repeat: repeat;
   margin: 0;
   padding: 0;
   font-size: 18px;
@@ -32,12 +35,12 @@ p {
 }
 
 a, a:visited {
-  color: #3f6e90;
+  color: #7fac96;
   text-decoration: none;
 }
 
 a:hover {
-  color: #81acc1;
+  color: #5b8277;
 }
 
 h1,
@@ -53,24 +56,65 @@ h4 > a,
 h5 > a,
 h6 > a {
   font-family: "IBM Plex Serif", Georgia, serif;
+  font-weight: 300;
+}
+
+hr {
+  border-style: solid;
+  border-color: #dedede;
+  border-width: 1px 0 0 0;
 }
 
 span.icon {
   font-family: "IBM Plex Mono";
+  font-size: 2em;
+  margin: auto 0.5em;
+}
+
+.publish-date {
+  color: #a1a6b2;
+  font-family: "IBM Plex Sans";
+  font-weight: 300;
+  font-style: italic;
+}
+
+h2 > span.publish-date {
+  font-size: 0.8em;
 }
 
 .main-container {
   display: grid;
-  grid-template-columns: 3fr 1fr;
-  max-width: 62em;
+  grid-template-columns: 5fr 2fr;
+  grid-template-rows: min-content auto;
+  max-width: 1080px;
   margin: 0 auto;
+  min-height: 100vh;
+  background-color: #000;
+}
+
+.landing-page-container {
+  grid-column-start: 1;
+  grid-column-end: 3;
 }
 
 .header-container {
   grid-column-start: 1;
   grid-column-end: 3;
+  text-align: center;
+  padding: 0 1em;
 }
 
 .sidebar-container {
   padding: 1em;
 }
+
+.links-container {
+  text-align: center;
+}
+
+.content-container {
+}
+
+.post-container {
+  padding: 2em;
+}
diff --git a/static/svg/background.svg b/static/svg/background.svg
new file mode 100644
index 0000000..d178423
--- /dev/null
+++ b/static/svg/background.svg
@@ -0,0 +1,4 @@
+<svg viewbox="0 0 45 45" xmlns="http://www.w3.org/2000/svg">
+  <line x1="0" x2="45" y1="45" y2="45" stroke="#a1a6b2" stroke-dasharray="1 2" />
+  <line x1="45" x2="45" y1="0" y2="45" stroke="#a1a6b2" stroke-dasharray="1 2" />
+</svg>