Fixed blog post metadata overlap on mobile/tablet

material/templates/base.html

@@ -44,7 +44,7 @@
       {% endif %}
     {% endblock %}
     {% block styles %}
-      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.b2ea3d00.min.css' | url }}">
+      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.1dbc8ddf.min.css' | url }}">
       {% if config.theme.palette %}
         {% set palette = config.theme.palette %}
         <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.a5377069.min.css' | url }}">

src/templates/assets/stylesheets/main/components/_post.scss

@@ -161,6 +161,36 @@
 
   // [tablet -]: Adjust spacing
   @include break-to-device(tablet) {
+    position: initial;
+    width: 100%;
     padding: 0;
+
+    .md-sidebar__inner {
+      padding: 0;
+    }
+
+    .md-post__meta {
+      margin-inline: px2rem(12px);
+    }
+
+    .md-nav__item {
+      display: inline;
+      border: none;
+    }
+
+    .md-nav__list {
+      display: inline-flex;
+      flex-wrap: wrap;
+      gap: px2rem(12px);
+      padding-block: px2rem(12px);
+    }
+
+    .md-nav__link {
+      padding: 0;
+    }
+
+    .md-nav {
+      position: initial;
+    }
   }
 }