@graphcommerce/next-ui 3.1.3 → 3.1.4

package/AppShell/FixedFab.tsx

@@ -10,15 +10,18 @@ const useStyles = makeStyles(
       bottom: 20,
       right: 20,
       zIndex: 100,
+      width: 56,
       boxShadow: theme.shadows[4],
       borderRadius: 99,
+      maxWidth: 56,
       [theme.breakpoints.down('sm')]: {
         top: 'unset !important',
       },
       [theme.breakpoints.up('md')]: {
         pointerEvents: 'all',
-        top: `calc(${theme.spacings.xxs} - 2px)`,
-        left: `calc(100vw - ${theme.page.horizontal} - 70px)`,
+        top: theme.spacings.xxs,
+        // hacky way to measure page width without scrollbar width
+        left: `calc((100vw - (100vw - 100%)) - ${theme.page.horizontal} - 56px)`,
         bottom: 'unset',
         boxShadow: 'unset',
       },

package/AppShell/useFixedFabAnimation.tsx

@@ -6,13 +6,11 @@ export default function useFixedFabAnimation() {
   const isMobile = useMediaQuery(theme.breakpoints.down('sm'))
   const { scrollY } = useViewportScroll()
   const scrollTo = isMobile ? 0 : 60
-
   const opacity = useTransform(scrollY, [50, scrollTo], [0, 1])
   const opacity1 = useTransform(scrollY, [0, scrollTo], [0, 0.08])
-  const opacity2 = useTransform(scrollY, [0, scrollTo], [0, 0.1])
-  const filter = useMotionTemplate`
-    drop-shadow(0 1px 4px rgba(0,0,0,${opacity1}))
-    drop-shadow(0 4px 10px rgba(0,0,0,${opacity2}))`
+  const boxShadow = useMotionTemplate`
+    0 2px 10px 0 rgba(0, 0, 0, ${opacity1})
+    `
 
-  return { filter, opacity }
+  return { boxShadow, opacity }
 }

package/CHANGELOG.md

@@ -3,6 +3,19 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.1.4](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.1.3...@graphcommerce/next-ui@3.1.4) (2021-10-06)
+
+
+### Bug Fixes
+
+* cart fab alignment ([209ad30](https://github.com/ho-nl/m2-pwa/commit/209ad3027eff32e174c1774d21e9f33a3051a819))
+* **cart-fab:** box shadow in safari ([4eb316d](https://github.com/ho-nl/m2-pwa/commit/4eb316dd0f2ab7ee2806a3acdb306af1eb72854b))
+* **cart-fab:** positioning ([7bb31b4](https://github.com/ho-nl/m2-pwa/commit/7bb31b4bf6e663d14220aedaddf420b24d427b3a))
+
+
+
+
+
 ## [3.1.3](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.1.2...@graphcommerce/next-ui@3.1.3) (2021-10-04)
 
 

package/icons/icon_shopping_bag.svg

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg transform="translate(0.25, 0.25)" width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-     <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+     <g transform='translate(0.0, -2.0)' stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
         <path d="M22.7211388,13.8851398 L23.5468356,26.00354 L8.74931805,26.00354 L9.57501488,13.8851398 L22.7211388,13.8851398 Z" id="Rectangle-6" stroke="#000000" stroke-width="1.4"></path>
         <path d="M12.4444055,14.953 L12.4444055,11.4552028 C12.4444055,9.54694698 13.9458954,8 15.798077,8 C17.6502587,8 19.1517485,9.54694698 19.1517485,11.4552028 L19.1517485,14.9497766" id="Path" stroke="#000000" stroke-width="1.4" stroke-linecap="square" stroke-linejoin="bevel"></path>
     </g>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graphcommerce/next-ui",
-  "version": "3.1.3",
+  "version": "3.1.4",
   "author": "",
   "license": "MIT",
   "scripts": {
@@ -56,5 +56,5 @@
       "project": "./tsconfig.json"
     }
   },
-  "gitHead": "148ed6eb34bf3b3da72c1791c4195d8d141bc6e6"
+  "gitHead": "3cdea8f8c2a7a717955e81634ffdf769a1317584"
 }