atome UI

src/components/ProductList/ProductList.jsx

             >
               {`${minDiscountPriceCurrency} ${parseFloat(minDiscountPrice).toFixed(2)}`}
             </Typography>}
-
-            {/* <Typography
+            
+            <Typography
               variant="body2"
               sx={{
                 fontWeight: "100",
                 },
               }}
             >
-              or 3 payments of <span style={{fontWeight:"900"}}>  {`${parseFloat((minPrice/3)).toFixed(2)} ${minPriceCurrency}`}</span> with <span style={{fontWeight:"900"}}>Atome <img style={{marginLeft:5, verticalAlign:"middle"}} width="15" src={atomeLogo} /> </span>
-            </Typography> */}
+              or 3 payments of <span style={{fontWeight:"900"}}>  {`${ (minDiscountPrice > 0) ? parseFloat((minDiscountPrice/3)).toFixed(2) : parseFloat((minPrice/3)).toFixed(2) } ${minPriceCurrency}`}</span> with <span style={{fontWeight:"900"}}>Atome <img style={{marginLeft:5, verticalAlign:"middle"}} width="15" src={atomeLogo} /> </span>
+            </Typography>
+
+
 
           </Box>
         </Box>

src/components/ProductSelected/ProductSelected.jsx

 import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
 import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
 import defaultImage from "../../assets/images/default.png"
+import atomeLogo from "../../assets/images/atome.webp"
 
 const ProductSelected = () => {
 
               >
                 {`${minDiscountPriceCurrency} ${parseFloat(minDiscountPrice).toFixed(2)}`}
               </Typography>}
+
+              <Typography
+                variant="body2"
+                sx={{
+                  fontWeight: "100",
+                  fontSize: {
+                    xs: "0.73rem",
+                    sm: "0.73rem",
+                    md: "0.875rem",
+                  },
+                }}
+              >
+                or 3 payments of <span style={{ fontWeight: "900" }}>  {`${(minDiscountPrice > 0) ? parseFloat((minDiscountPrice / 3)).toFixed(2) : parseFloat((minPrice / 3)).toFixed(2)} ${minPriceCurrency}`}</span> with <span style={{ fontWeight: "900" }}>Atome <img style={{ marginLeft: 5, verticalAlign: "middle" }} width="15" src={atomeLogo} /> </span>
+              </Typography>
             </Box>
           </Box>
         </a>