@graphcommerce/magento-product 3.6.4 → 3.7.0

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.7.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-product@3.6.4...@graphcommerce/magento-product@3.7.0) (2021-12-01)
+
+
+### Bug Fixes
+
+* borderRadius ([b9cffcc](https://github.com/ho-nl/m2-pwa/commit/b9cffccf444cb2ff8d6257ef3a64c0ea18e30477))
+* icon OrderBefore ([25a2390](https://github.com/ho-nl/m2-pwa/commit/25a2390321c7047c5191a15a9352020b8161ff7a))
+
+
+### Features
+
+* borderRadius based on theme.shape.borderRadius ([7c34937](https://github.com/ho-nl/m2-pwa/commit/7c349376cd41a131c628324c299106fdb7e60484))
+* introduce borderRadius ([183afbc](https://github.com/ho-nl/m2-pwa/commit/183afbc8ee269f6694c372b06afdf41302f86c09))
+* variable font weights ([bfd8142](https://github.com/ho-nl/m2-pwa/commit/bfd8142b96742efd1208556e3c48de382d8d8ceb))
+
+
+
+
+
 ## [3.6.4](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-product@3.6.3...@graphcommerce/magento-product@3.6.4) (2021-11-27)
 
 

package/components/ProductListItem/index.tsx

@@ -88,6 +88,7 @@ export const useProductListItemStyles = makeStyles(
       position: 'relative',
       paddingTop: `calc(100% / ${aspectRatio[0]} * ${aspectRatio[1]})`,
       background: theme.palette.background.image, // theme specific,
+      borderRadius: responsiveVal(theme.shape.borderRadius * 2, theme.shape.borderRadius * 3),
     }),
     placeholder: {
       display: 'flex',

package/components/ProductPageDescription/index.tsx

@@ -6,22 +6,19 @@ import { ProductPageDescriptionFragment } from './ProductPageDescription.gql'
 const useStyles = makeStyles((theme: Theme) => ({
   /* nested styles because we don't know beforehand which elements the description contains */
   description: {
-    ...theme.typography.body2,
-    fontWeight: 400,
-    [theme.breakpoints.up('md')]: {
-      ...theme.typography.h4,
-      lineHeight: 1.7,
-      fontWeight: 400,
-    },
     '& p:first-of-type': {
       marginTop: 0,
     },
     '& p, & li': {
-      ...theme.typography.h4,
+      ...theme.typography.body1,
       fontWeight: 400,
+
       [theme.breakpoints.up('md')]: {
         ...theme.typography.h3,
         fontWeight: 400,
+        '@supports (font-variation-settings: normal)': {
+          fontVariationSettings: "'wght' 420",
+        },
       },
     },
     '& ul': {

package/components/ProductSidebarDelivery/index.tsx

@@ -1,5 +1,5 @@
-import { SvgImage, responsiveVal, iconBox, SvgImageSimple } from '@graphcommerce/next-ui'
-import { makeStyles, Theme, Typography } from '@material-ui/core'
+import { SvgImage, responsiveVal, iconOrderBefore, SvgImageSimple } from '@graphcommerce/next-ui'
+import { darken, lighten, makeStyles, Theme, Typography } from '@material-ui/core'
 import React from 'react'
 
 const useStyles = makeStyles(
@@ -14,16 +14,16 @@ const useStyles = makeStyles(
       gridTemplateColumns: `min-content auto`,
       columnGap: theme.spacings.xxs,
       marginTop: theme.spacings.xxs,
-      background: theme.palette.background.paper,
-      border: `1px solid ${theme.palette.divider}`,
+      background:
+        theme.palette.type === 'light'
+          ? darken(theme.palette.background.default, 0.01)
+          : lighten(theme.palette.background.default, 0.2),
       padding: theme.spacings.xxs,
-      borderRadius: responsiveVal(4, 6),
+      borderRadius: responsiveVal(theme.shape.borderRadius * 3, theme.shape.borderRadius * 4),
     },
     text: {},
     image: {
       gridArea: 'image',
-      width: responsiveVal(18, 24),
-      height: responsiveVal(18, 24),
     },
     title: {
       gridArea: 'title',
@@ -42,7 +42,7 @@ export default function ProductSidebarDelivery() {
 
   return (
     <div className={classes.root}>
-      <SvgImageSimple className={classes.image} src={iconBox} />
+      <SvgImageSimple className={classes.image} src={iconOrderBefore} size='small' />
       <Typography className={classes.title} variant='body2' component='div'>
         Order before 22:00
       </Typography>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graphcommerce/magento-product",
-  "version": "3.6.4",
+  "version": "3.7.0",
   "sideEffects": false,
   "prettier": "@graphcommerce/prettier-config-pwa",
   "browserslist": [
@@ -24,9 +24,9 @@
     "@graphcommerce/framer-scroller": "^1.0.4",
     "@graphcommerce/graphql": "^2.105.5",
     "@graphcommerce/image": "^2.105.4",
-    "@graphcommerce/magento-cart": "^3.7.4",
-    "@graphcommerce/magento-store": "^3.3.4",
-    "@graphcommerce/next-ui": "^3.18.2",
+    "@graphcommerce/magento-cart": "^3.8.0",
+    "@graphcommerce/magento-store": "^3.3.5",
+    "@graphcommerce/next-ui": "^3.19.0",
     "@lingui/macro": "^3.12.1",
     "@material-ui/core": "^4.12.3",
     "@material-ui/lab": "^4.0.0-alpha.60",
@@ -38,5 +38,5 @@
     "schema-dts": "^1.0.0",
     "type-fest": "^2.5.1"
   },
-  "gitHead": "4d36627aeb43cba320c249b9a876384627064f18"
+  "gitHead": "f079c0b5b96dd1a048ca4d3c1d07916353c6bc33"
 }