size样式美化

app/design/frontend/Joshine/breeze/Magento_Catalog/templates/product/view/addtocart.phtml

@@ -80,8 +80,10 @@
         $chartTableArray = [];
         $chartTableArray = [];
         $chartInfo = '';
         $chartInfo = '';
         $chartEnabled = 1;
         $chartEnabled = 1;
+        $sizeDesc = '';
         if ($sizeChart != null) {
         if ($sizeChart != null) {
             $chartTable      = $sizeChart->getData('custom_size');
             $chartTable      = $sizeChart->getData('custom_size');
+            $sizeDesc = $sizeChart->getData('description');
             $chartTableArray = json_decode($chartTable, true);
             $chartTableArray = json_decode($chartTable, true);
             $chartInfo = $sizeChart->getData('sizechart_info');
             $chartInfo = $sizeChart->getData('sizechart_info');
         }
         }
@@ -101,7 +103,7 @@
     }
     }
 
 
     #chart-details .tbody .td:first-child {
     #chart-details .tbody .td:first-child {
-        font-weight: bold;
+        /*font-weight: bold;*/
     }
     }
 
 
     #fme_sizechart_table {
     #fme_sizechart_table {
@@ -115,7 +117,9 @@
         border: 1px solid #111;
         border: 1px solid #111;
         padding:8px 0;
         padding:8px 0;
         color: #fff;
         color: #fff;
+        /*
         font-weight: 600 !important;
         font-weight: 600 !important;
+        */
     }
     }
 
 
     #fme_sizechart_table .td {
     #fme_sizechart_table .td {
@@ -123,7 +127,9 @@
     }
     }
 
 
     #fme_sizechart_table .td.bold {
     #fme_sizechart_table .td.bold {
+        /*
         font-weight:600 !important;
         font-weight:600 !important;
+        */
     }
     }
 
 
     #fme_sizechart_table .th, .table .td {
     #fme_sizechart_table .th, .table .td {
@@ -318,8 +324,9 @@
                 <li class="lastli lastli-right" style="cursor:pointer">X</li>
                 <li class="lastli lastli-right" style="cursor:pointer">X</li>
             </ul>
             </ul>
             <div class="area-content">
             <div class="area-content">
-                <div id="size-chart" style="display: none;">
+                <div id="size-chart" style="display: none;padding: 1.6em;">
                 <?php if ($chartBlock->isEnabled() && (count($chartTableArray) > 1)): ?>
                 <?php if ($chartBlock->isEnabled() && (count($chartTableArray) > 1)): ?>
+                    <h4 class="joshine-text-center">Size Guide</h4>
                     <div id="chart-details">
                     <div id="chart-details">
                         <div class="chart-size-switch ">
                         <div class="chart-size-switch ">
                             <input type="hidden" value="">
                             <input type="hidden" value="">
@@ -355,6 +362,9 @@
                             </div>
                             </div>
                         </div>
                         </div>
                     </div>
                     </div>
+                    <?php if($sizeDesc): ?>
+                        <span class="size-desc"><?= $sizeDesc ?></span>
+                    <?php endif; ?>
                     <?php echo $chartBlock->getContentFromStaticBlock($chartInfo);?>
                     <?php echo $chartBlock->getContentFromStaticBlock($chartInfo);?>
                 <?php else: ?>
                 <?php else: ?>
                     <?php
                     <?php
@@ -386,6 +396,16 @@
     <div id="areaMask" class="mask"></div>
     <div id="areaMask" class="mask"></div>
 </li>
 </li>
 <style>
 <style>
+    .size-chart {
+        padding-right: 20px !important;
+        padding-left: 20px !important;
+    }
+    .size-desc {
+        font-size: .85em;
+        color: #9E9E9E;
+        display: inline-block;
+        margin-bottom: 1em;
+    }
     #product-intro__freeshipping-more-3{
     #product-intro__freeshipping-more-3{
         display: revert;
         display: revert;
         color: #2d68a;
         color: #2d68a;