Merge pull request #1491 from gethinode/develop

fix: improve non-fluid section rendering

component-library/helpers/component.html

@@ -36,6 +36,7 @@
     {{- $style := index $component_props "wrapper" -}}
     {{- $width := index $component_props "width" -}}
     {{- $justify := index $component_props "justify" | default "start" -}}
+    {{- $paddingOuter := cond (ne $component_name "separator") (printf "px-xxl-0 px-%d py-0" $padding.x) "" -}}
     {{- $padding := cond (ne $component_name "separator") (printf "px-%d %spy-%d" $padding.x (cond $fluid "px-xxl-0 " "") $padding.y) "" -}}
     {{- $wrapper := $style }}
     {{ with $background }}
@@ -44,14 +45,16 @@
             {{ with $background.backdrop }}{{ $wrapper = "" }}{{ $backdrop = . }}{{ end }}
         {{ end }}
     {{ end }}
-    {{/* warnf "wrapper: '%s'" $wrapper */}}
     {{- $theme := index $component_props "theme" -}}
     {{- $overlayMode := (or (index $component_props "overlay-mode") page.Params.overlayMode) | default "dark" -}}
     {{ if not $backdrop }}{{ $overlayMode = page.Params.overlayMode }}{{ end }}
     {{ if eq $overlayMode "none" }}{{ $overlayMode = "" }}{{ end }}
     
     {{ (printf "<!--bookshop-live name(%s)-->" $component_name) | safeHTML }}
-    <section {{ with $id }}id="{{ . }}" {{ end }}class="{{ $component_name }} container-{{ cond $fluid "fluid" "xxl" }} {{ $class }} {{ with $wrapper }}{{ . }}{{ end -}}
+    {{ if not $fluid }}<div class="container-xxl {{ $paddingOuter }}">{{ end }}
+    <section {{ with $id }}id="{{ . }}" {{ end }}class="{{ $component_name }}
+        container-fluid {{ $class }}
+        {{ with $wrapper }}{{ . }}{{ end -}}
         {{- if and $backdrop $overlayMode }} background-container{{ end -}}
         {{- if $cover }} section-cover d-flex align-items-center{{ end }}" 
         {{ with $overlayMode -}}
@@ -62,12 +65,16 @@
         {{- end -}}
         >
         {{- if $backdrop -}}
-            {{ partial "assets/live-image.html" (dict "src" $backdrop "class" (printf "background-img-fluid %s" $bgclass) "title" (T "backgroundImage")) }}
+            {{ partial "assets/live-image.html" (dict
+                "src" $backdrop
+                "class" (printf "background-img-fluid %s" $bgclass)
+                "title" (T "backgroundImage"))
+            }}
         {{- end -}}
 
         {{ $col := cond (and $width (lt $width 12)) (printf "col-12 col-md-%d" $width) "" }}
 
-        <div class="container-xxl {{ $padding }} d-flex flex-column align-items-{{ $justify }}">
+        <div class="container-{{ cond $fluid "xxl" "fluid" }} {{ $padding }} d-flex flex-column align-items-{{ $justify }}">
             {{ with $col }}
                 <div class="{{ . }}">{{ partial $resolved_component $component_props }}</div>
             {{ else }}
@@ -75,6 +82,7 @@
             {{ end}}
         </div>
     </section>
+    {{ if not $fluid }}</div>{{ end }}
     {{ "<!--bookshop-live end-->" | safeHTML }}
 {{- else -}}
     {{- $file_loc := slicestr $component_path 9 -}}

package-lock.json

@@ -36,7 +36,7 @@
         "rimraf": "^6.0.1",
         "semantic-release": "^24.2.6",
         "shx": "^0.4.0",
-        "stylelint": "^16.21.0",
+        "stylelint": "^16.21.1",
         "stylelint-config-standard-scss": "^15.0.1"
       },
       "optionalDependencies": {
@@ -15694,9 +15694,9 @@
       }
     },
     "node_modules/stylelint": {
-      "version": "16.21.0",
+      "version": "16.21.1",
-      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.21.0.tgz",
+      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.21.1.tgz",
-      "integrity": "sha512-ki3PpJGG7xhm3WtINoWGnlvqAmbqSexoRMbEMJzlwewSIOqPRKPlq452c22xAdEJISVi80r+I7KL9GPUiwFgbg==",
+      "integrity": "sha512-WCXdXnYK2tpCbebgMF0Bme3YZH/Rh/UXerj75twYo4uLULlcrLwFVdZTvTEF8idFnAcW21YUDJFyKOfaf6xJRw==",
       "dev": true,
       "funding": [
         {
@@ -15708,7 +15708,6 @@
           "url": "https://github.com/sponsors/stylelint"
         }
       ],
-      "license": "MIT",
       "dependencies": {
         "@csstools/css-parser-algorithms": "^3.0.5",
         "@csstools/css-tokenizer": "^3.0.4",
@@ -15737,7 +15736,7 @@
         "micromatch": "^4.0.8",
         "normalize-path": "^3.0.0",
         "picocolors": "^1.1.1",
-        "postcss": "^8.5.5",
+        "postcss": "^8.5.6",
         "postcss-resolve-nested-selector": "^0.1.6",
         "postcss-safe-parser": "^7.0.1",
         "postcss-selector-parser": "^7.1.0",

package.json

@@ -98,7 +98,7 @@
     "rimraf": "^6.0.1",
     "semantic-release": "^24.2.6",
     "shx": "^0.4.0",
-    "stylelint": "^16.21.0",
+    "stylelint": "^16.21.1",
     "stylelint-config-standard-scss": "^15.0.1"
   },
   "optionalDependencies": {