General theme changes & Fixing warnings

themes/hugo-theme-stack/assets/scss/general.scss

@@ -18,8 +18,6 @@ a {
 
 .section-title {
     text-transform: uppercase;
-    margin-top: 0;
-    margin-bottom: 10px;
     display: block;
     font-size: 1.6rem;
     font-weight: bold;

themes/hugo-theme-stack/assets/scss/grid.scss

@@ -91,10 +91,9 @@ main.main {
 .main-container {
     min-height: 100vh;
     align-items: flex-start;
-    padding: 0 15px;
     gap: var(--section-separation);
-    padding-top: var(--main-top-padding);
-    
+    padding: var(--main-top-padding) 15px 0;
+
     @include respond(md) {
         padding: 0 20px;
     }

themes/hugo-theme-stack/assets/scss/partials/layout/article.scss

@@ -14,6 +14,15 @@
         box-shadow: var(--shadow-l1);
         overflow: hidden;
 
+        @media (max-width:768px) {
+            border-radius: unset;
+            width: 100vw;
+            position: relative;
+            left: 50%;
+            transform: translateX(-50%);
+            max-width: none;
+        }
+
         .article-header {
             .article-image {
                 img {

themes/hugo-theme-stack/assets/scss/partials/menu.scss

@@ -218,6 +218,30 @@
     flex-direction: row;
     gap: 10px;
 
+    @media (max-width: 768px) {
+        display: none;
+    }
+
+    svg {
+        width: 24px;
+        height: 24px;
+        stroke: var(--body-text-color);
+        stroke-width: 1.33;
+    }
+}
+
+.social-menu-waffle {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    flex-direction: row;
+    gap: 10px;
+
+    @media (min-width: 768px) {
+        display: none;
+    }
+
     svg {
         width: 24px;
         height: 24px;

themes/hugo-theme-stack/assets/scss/partials/sidebar.scss

@@ -90,6 +90,10 @@
     flex-direction: column;
     gap: var(--sidebar-element-separation);
 
+    @media (max-width: 768px) {
+        flex-direction: row;
+    }
+
     @include respond(md) {
         padding: 0;
     }

themes/hugo-theme-stack/assets/scss/partials/widgets.scss

@@ -14,6 +14,13 @@
 
 /* Tag cloud widget */
 .tagCloud {
+    a {
+        display: flex;
+        flex-direction: row;
+        gap: 1rem;
+        align-items: center;
+    }
+
     .tagCloud-tags {
         display: flex;
         flex-wrap: wrap;
@@ -43,6 +50,13 @@
         background-color: var(--card-background);
     }
 
+    a {
+        display: flex;
+        flex-direction: row;
+        gap: 1rem;
+        align-items: center;
+    }
+
     .archives-year {
         &:not(:last-of-type) {
             border-bottom: 1.5px solid var(--card-separator-color);