fix: fix article regresssion (#250)

* refactor: output article element when needed

* refactor: refactor container styles and media queries

- Add the `$tablet` variable to `_container.scss`
- Add a media query to `_container.scss`
- Import `_container.scss` in `critical.scss`
- Remove the import of `_container.scss` in `style.scss`

assets/scss/_partial/_container.scss

@@ -1,4 +1,7 @@
-.container {
+$tablet: map-get($breakpoints, 'tablet') - 1;
+
+@media (max-width: $tablet), (hover: none) {
+  .container {
     position: fixed;
     top: 0;
     z-index: 0;
@@ -12,8 +15,9 @@
 
     overscroll-behavior: none;
     -webkit-overflow-scrolling: none;
-}
+  }
 
-.disableScroll {
+  .disableScroll {
     pointer-events: none;
+  }
 }

assets/scss/critical.scss

@@ -9,3 +9,4 @@
 
 @import '_partial/nav';
 @import '_partial/article';
+@import '_partial/container';

assets/scss/style.scss

@@ -6,6 +6,5 @@
 
 @import '_partial/collection';
 @import '_partial/gallery';
-@import '_partial/container';
 
 @import 'node_modules/swiper/swiper.scss';

layouts/_default/single.html

@@ -7,8 +7,10 @@
   </script>
   <div class="container">
     {{- partial "nav.html" . -}}
+    {{- with .Content -}}
       <article class="info">
-      {{ .Content }}
+        {{- . -}}
       </article>
+    {{- end -}}
   </div>
 {{- end -}}