2 files changed, 79 insertions, 10 deletions
diff --git a/static/css/fonts.css b/static/css/fonts.css
new file mode 100644
index 0000000..be3d523
--- /dev/null
+++ b/static/css/fonts.css
@@ -0,0 +1,53 @@
+@font-face {
+  font-family: "IBM Plex Sans";
+  src: url("/fonts/IBMPlexSans-Regular.ttf");
+}
+
+@font-face {
+  font-family: "IBM Plex Sans";
+  src: url("/fonts/IBMPlexSans-Bold.ttf");
+  font-weight: bold;
+}
+
+@font-face {
+  font-family: "IBM Plex Sans";
+  src: url("/fonts/IBMPlexSans-Italic.ttf");
+  font-style: italic;
+}
+
+@font-face {
+  font-family: "IBM Plex Sans";
+  src: url("/fonts/IBMPlexSans-BoldItalic.ttf");
+  font-style: italic;
+  font-weight: bold;
+}
+
+@font-face {
+  font-family: "IBM Plex Serif";
+  src: url("/fonts/IBMPlexSerif-Regular.ttf");
+}
+
+@font-face {
+  font-family: "IBM Plex Serif";
+  src: url("/fonts/IBMPlexSerif-Bold.ttf");
+  font-weight: bold;
+}
+
+@font-face {
+  font-family: "IBM Plex Serif";
+  src: url("/fonts/IBMPlexSerif-Italic.ttf");
+  font-style: italic;
+}
+
+@font-face {
+  font-family: "IBM Plex Serif";
+  src: url("/fonts/IBMPlexSerif-BoldItalic.ttf");
+  font-style: italic;
+  font-weight: bold;
+}
+
+@font-face {
+  font-family: "IBM Plex Mono";
+  src: url("/fonts/BlexMono.ttf");
+}
+
diff --git a/static/css/yaroslavps.css b/static/css/yaroslavps.css
index c65b2d4..f4f722f 100644
--- a/static/css/yaroslavps.css
+++ b/static/css/yaroslavps.css
@@ -1,3 +1,5 @@
+@import url("/css/fonts.css");
+
 html, body {
   width: 100%;
   min-height: 100vh;
@@ -26,16 +28,7 @@ li,
 a,
 p {
   line-height: 1.3;
-  font-family: Cantarell, Verdana, sans-serif;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-family: Georgia, serif;
+  font-family: "IBM Plex Sans", Verdana, Helvetica, sans-serif;
 }
 
 a, a:visited {
@@ -47,6 +40,25 @@ a:hover {
   color: #81acc1;
 }
 
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+h1 > a,
+h2 > a,
+h3 > a,
+h4 > a,
+h5 > a,
+h6 > a {
+  font-family: "IBM Plex Serif", Georgia, serif;
+}
+
+span.icon {
+  font-family: "IBM Plex Mono";
+}
+
 .main-container {
   display: grid;
   grid-template-columns: 3fr 1fr;
@@ -58,3 +70,7 @@ a:hover {
   grid-column-start: 1;
   grid-column-end: 3;
 }
+
+.sidebar-container {
+  padding: 1em;
+}