Merge branch 'add-reactjs-with-new-theme-#67' into develop

kkamara · Mar 7, 2022 · 4683721 · 4683721
2 parents b8f06dd + dfe3897
commit 4683721
Show file tree

Hide file tree

Showing 7 changed files with 23 additions and 12 deletions.
diff --git a/public/css/app.css b/public/css/app.css
diff --git a/public/js/bootstrap.js b/public/js/bootstrap.js
diff --git a/resources/js/components/pages/Product/ProductCard.css b/resources/js/components/pages/Product/ProductCard.css
@@ -1,7 +1,3 @@
-.product-container {
-  background-color: 'yellow';
-}
-
 @media screen and (max-width: 650px) {
   .product-container {
     margin-left: 17%;

diff --git a/resources/js/components/pages/Product/ProductComponent.css b/resources/js/components/pages/Product/ProductComponent.css
@@ -1,4 +1,10 @@
-#product {
+.product {
   margin-top:50px;
   margin-bottom:50px;
 }
+
+@media screen and (max-width: 650px) {
+  .product-image {
+      max-height: 350px;
+  }
+}
diff --git a/resources/js/components/pages/Product/ProductComponent.js b/resources/js/components/pages/Product/ProductComponent.js
@@ -49,7 +49,7 @@ export default function ProductComponent({ match }) {
       has_permission_to_review: true,
       company: {
         id: 496,
-        slug: 'Kessler, Windler and Hessel',
+        slug: 'kessler-windler-and-hessel',
       },
     },
     review: '2.33',
@@ -131,14 +131,17 @@ export default function ProductComponent({ match }) {
   }
 
   return (
-    <div className='container' id='product'>
+    <div className='container product'>
       <div className='row'>
         <div className='col-md-9'>
           <table className='table table-striped'>
             <tbody>
               <tr className='text-center'>
                 <th scope='row' colSpan='2'>
-                  <img src={product.image_path} className='img-responsive'/>
+                  <img 
+                    src={product.image_path} 
+                    className='img-responsive product-image'
+                  />
                   <h4 dusk='product-name'>
                     { product.name }
                   </h4>
@@ -215,7 +218,7 @@ export default function ProductComponent({ match }) {
           <div className='card'>
             <div className='card-header'>
               <div className='lead'>
-                Reviews {product.review !== '0.00' ? `(Average  ${ product.review })` : null}
+                Reviews {product.review !== '£0.00' ? `(Average  ${ product.review })` : null}
               </div>
             </div>
             <div className='card-body'>

diff --git a/resources/sass/app.scss b/resources/sass/app.scss
@@ -46,6 +46,9 @@ img {
             max-height: 300px;
         }
     }
+    .product-image {
+        max-height: 350px;
+    }
     .block {
         display: none;
     }

diff --git a/resources/views/product/show.blade.php b/resources/views/product/show.blade.php
@@ -7,7 +7,10 @@
                 <tbody>
                     <tr class='text-center'>
                         <th scope='row' colspan='2'>
-                            <img src="{{ $product->image_path }}" class='img-responsive'/>
+                            <img 
+                                src="{{ $product->image_path }}" 
+                                class='img-responsive product-image'
+                            />
                             <h4 dusk="product-name">
                                 {{ $product->name }}
                             </h4>