Multiple unrelated changes

- Changed favicon
- Article width is more narrow

sass/style.scss

@@ -11,27 +11,38 @@ $success-color: color("green", "base");
 $error-color: color("red", "base");
 $link-color: color("light-blue", "darken-1");
 
-$small-screen: 650px;
-$small-screen-up: 651px;
+/*$small-screen: 650px;
+$small-screen-up: 651px;*/
 
 @import "materialize.scss";
 
 /* overall page look */
+$p-max-width: 512px;
 #content, .container.nav-wrapper {
     width: 86%;
 }
+html {
+  font-size: 16px;
+}
+p:has(img) {
+  display: inline;
+  max-width: unset;
+}
 
 /* Article list style */
-.block.article {
+.article {
   overflow: hidden;
   text-align:justify;
   margin: 10px 0;
   background-color: white;
   box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
-}
-
-.article h5 {
-  font-size: 1.3rem;
+  h5 {
+    font-size: 1.3rem;
+    margin: 0 10px;
+  }
+  .head-title {
+    margin: 10px 0;
+  }
 }
 
 .leadimage {
@@ -52,13 +63,15 @@ footer.page-footer {
 	color: white;
 }
 #all {
+  background-color: #fafafa;
   position:relative;
   overflow-y: hidden;
   min-height: 100vh;
 }
 #content, #search {
-  margin-bottom: 90px;
-  margin-top: 104px;
+  padding-bottom: 20px;
+  padding-top: 104px;
+  margin: 0 auto;
 }
 html, body {
   min-height: 100vh;
@@ -115,6 +128,7 @@ html, body {
 }
 
 nav {
+  background-color: $primary-color;
   line-height: 64px;
 }
 @media #{$medium-and-down} {
@@ -124,6 +138,7 @@ nav {
 }
 
 nav.subnav {
+  background-color: $primary-color-light;
   margin-top: -16px;
   transition: 0.3s;
   height: 40px;
@@ -198,57 +213,98 @@ nav.subnav li {
 }
 
 /* Article */
-h2#title {
-  margin-bottom: 0px;
-}
+.type-article {
+  p {
+    padding: 0 .5rem;
+    text-align: justify;
+    display: block;
+    max-width: $p-max-width;
+    margin: 0 auto;
+  }
+  
+  h2#title {
+    margin: 0px;
+  }
 
-.author {
-  margin-bottom: 1rem;
-}
+  .metadata {
+    margin-bottom: 1rem;
+    text-align: center;
+  }
 
-.type-article .container {
-  max-width: 1024px;
-}
-.article article {
-  text-align: justify;
-}
-th {
-  padding: 5px 5px 0px 5px;
-  font-weight: unset;
-}
-td {
-  padding: 5px;
-}
-.article {
-  h3 {
-    font-size: 2rem;
-    padding-bottom: 3px;
-    border-bottom: solid #d0d0d0 1px ;
+  article {
+    text-align: center;
   }
-  h4 {
-    font-size: 1.6rem;
+  th {
+    padding: 5px 5px 0px 5px;
+    font-weight: unset;
   }
-  h5 {
-    font-size: 1.1rem;
+  td {
+    padding: 5px;
   }
-  h6 {
-    font-size: 1rem;
+  .section {
+    background-color:white;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+    .has-image {
+      text-align: center;
+    }
+    img {
+      max-width: 100%;
+    }
+    ul, ol {
+      text-align: left;
+      padding: 0 .5rem;
+      max-width: $p-max-width;
+      margin: 10px auto;
+    }
+    h3, h4, h5, h6 {
+      max-width: $p-max-width;
+      margin: 10px auto;
+      padding: 0 .5rem;
+      text-align: left;
+    }
+    h3 {
+      font-size: 2rem;
+      padding-bottom: 3px;
+      border-bottom: solid #d0d0d0 1px ;
+    }
+    h4 {
+      font-size: 1.6rem;
+    }
+    h5 {
+      font-size: 1.1rem;
+    }
+    h6 {
+      font-size: 1rem;
+    }
   }
-}
 
-pre {
-  padding: 2px 0 2px 10px;
-  background-color: #2b2b2b;
-}
-code {
-  padding: 2px 5px;
-  color: #bababa;
-  background-color: #2b2b2b;
-  font-family: "Menlo", "Liberation Mono", "Consolas", "DejaVu Sans Mono", "Ubuntu Mono", "Courier New", "andale mono", "lucida console", monospace;
-}
-pre code {
-  padding: 0;
+  pre {
+    padding: 2px 0 2px 10px;
+    background-color: #2b2b2b;
+    display:inline-block;
+    text-align: left;
+    min-width: 508px;
+    max-width:100%;
+  }
+  code {
+    padding: 2px 5px;
+    color: #bababa;
+    background-color: #2b2b2b;
+    font-family: "Menlo", "Liberation Mono", "Consolas", "DejaVu Sans Mono", "Ubuntu Mono", "Courier New", "andale mono", "lucida console", monospace;
+  }
+  pre code {
+    padding: 0;
+  }
+  article ul li {list-style: circle inside}
+  
+  @media #{$small-and-down} {
+    #content {
+      width: 100%;
+    }
+    pre {
+      min-width: 100%;
+    }
+  }
 }
-.article ul li {list-style: circle outside}
 
 @import "search.scss"

static/theme/favicons/browserconfig.xml

@@ -2,10 +2,10 @@
 <browserconfig>
   <msapplication>
     <tile>
-      <square70x70logo src="/favicons/mstile-70x70.png"/>
-      <square150x150logo src="/favicons/mstile-150x150.png"/>
-      <square310x310logo src="/favicons/mstile-310x310.png"/>
-      <wide310x150logo src="/favicons/mstile-310x150.png"/>
+      <square70x70logo src="{{ config.baseurl }}/theme/favicons/mstile-70x70.png?v=lkk0Gr4nzB"/>
+      <square150x150logo src="{{ config.baseurl }}/theme/favicons/mstile-150x150.png?v=lkk0Gr4nzB"/>
+      <square310x310logo src="{{ config.baseurl }}/theme/favicons/mstile-310x310.png?v=lkk0Gr4nzB"/>
+      <wide310x150logo src="{{ config.baseurl }}/theme/favicons/mstile-310x150.png?v=lkk0Gr4nzB"/>
       <TileColor>#2d89ef</TileColor>
     </tile>
   </msapplication>