update style

_layouts/post-sensor-watch.html

@@ -46,7 +46,7 @@
             position: fixed;
         }
 
-        @media only screen and (max-width: 1200px) {
+        @media only screen and (max-width: 1500px) {
             .wrapper {
                 grid-template-columns: 10rem auto;
                 grid-template-rows: auto;
@@ -57,14 +57,13 @@
             }
 
             .article {
-                padding-left: 1rem;
+                padding-left: 3rem;
                 padding-right: 1rem;
                 padding-top: 1rem;
-                font-size: 1rem;
             }
         }
 
-        @media only screen and (max-width: 600px) {
+        @media only screen and (max-width: 800px) {
             .side {
                 display: none;
             }
@@ -75,8 +74,7 @@
             }
 
             .article {
-                padding: 10px;
-                font-size: 0.8rem;
+                padding: 1rem;
             }
         }
     </style>

_sass/main.scss

@@ -4,34 +4,6 @@ $heading-color: rgb(255, 182, 193);
 $link-color: rgb(252, 169, 184);
 $inl-code-color: rgb(165, 214, 255);
 
-@font-face {
-  font-family: TeXGyreCursor;
-  src: url('../fonts/texgyrecursor-regular.woff') format('woff');
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: TeXGyreCursor;
-  src: url('../fonts/texgyrecursor-bold.woff') format('woff');
-  font-weight: bold;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: TeXGyreCursor;
-  src: url('../fonts/texgyrecursor-italic.woff') format('woff');
-  font-weight: normal;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: TeXGyreCursor;
-  src: url('../fonts/texgyrecursor-bolditalic.woff') format('woff');
-  font-weight: bold;
-  font-style: italic;
-}
-
 @font-face {
   font-family: 'Source Code Pro';
   font-style: normal;
@@ -76,6 +48,10 @@ body {
   padding-top: 5vh;
   font-family: 'Source Code Pro';
   font-size: 1.5rem;
+
+  @media screen and (max-width: 600px) {
+    font-size: 1rem;
+  }
 }
 
 h1 {
@@ -95,6 +71,10 @@ a {
   text-decoration: none;
 }
 
+li {
+  line-height: 150%;
+}
+
 .article {
   p, li {
     a {
@@ -102,6 +82,10 @@ a {
       text-decoration: underline;
       word-wrap: break-word;
     }
+
+    code {
+      color: #a5d6ff;
+    }
   }
 
   picture img, p img {
@@ -115,11 +99,6 @@ a {
     padding: 0;
   }
 
-  p code {
-    font-size: 1.5rem;
-    color: #a5d6ff;
-  }
-
   .header-link {
     display: inline-block;
   }

assets/css/pygments.css

@@ -7,13 +7,16 @@ pre {
 figure.highlight {
     margin: 0;
     margin-left: 1.5rem;
-}
-
-.rouge-table {
     display: block;
     overflow-x: auto;
 }
 
+@media screen and (max-width: 600px) {
+    pre {
+        font-size: 0.8rem;
+    }
+}
+
 td.gutter {
     padding-right: 10px;
     border-right: 3px solid rgb(252, 169, 184);