Feat: Moving prices to footer

helsingborg-stad · Jul 11, 2023 · 9574f2b · 9574f2b
1 parent 6e27f18
commit 9574f2b
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 8 deletions.
diff --git a/source/php/Component/Product/Product.php b/source/php/Component/Product/Product.php
@@ -25,6 +25,7 @@ public function init()
             if (!isset($button['color'])) {
                 $this->data['button']['color'] = $backgroundColor;
             }
+            $this->data['button']['classList'][] = 'c-product__button';
         }
     }
 }
diff --git a/source/php/Component/Product/components/button.blade.php b/source/php/Component/Product/components/button.blade.php
@@ -1,4 +1,3 @@
-<div class="c-card__footer">
-    @button($button)
-    @endbutton
-</div>
+@button($button)
+@endbutton
+
diff --git a/source/php/Component/Product/components/price.blade.php b/source/php/Component/Product/components/price.blade.php
@@ -1,3 +1,4 @@
+<div class="{{$baseClass}}__prices {{!empty($button) ? 'has-button' : ''}}">
 @foreach ($prices as $price)
     <div class="{{ $baseClass }}__price {{ $baseClass }}__price--{{ $price['color'] ?? $backgroundColor ?? 'primary' }}">
         @typography([
@@ -28,3 +29,4 @@
         @endif
     </div>
 @endforeach
+</div>
diff --git a/source/php/Component/Product/product.blade.php b/source/php/Component/Product/product.blade.php
@@ -17,9 +17,6 @@
             ])
                 {{ $label }}
             @endtypography
-            <div class="{{$baseClass}}__prices">
-                @includeWhen($prices, 'Product.components.price')
-            </div>
         </div>
         <div class="c-card__body c-product__body">
             @if ($meta)
@@ -39,6 +36,9 @@
                 @endlisting
             @endif
         </div>
-        @includeWhen(!empty($button), 'Product.components.button')
+        <div class="c-card__footer {{$baseClass}}__footer">
+                @includeWhen($prices, 'Product.components.price')
+                @includeWhen(!empty($button), 'Product.components.button')
+        </div>
     @endcard
 </div>