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,3 +1,6 @@
+$tablet: map-get($breakpoints, 'tablet') - 1;
+
+@media (max-width: $tablet), (hover: none) {
   .container {
     position: fixed;
     top: 0;
@@ -17,3 +20,4 @@
   .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 -}}