Add browserslist and improve CSS masks for compatibility (#3471)

Co-authored-by: Nicolas Dorseuil <nicolas@gitbook.io>

Author: conico974

.changeset/gold-sheep-obey.md

@@ -0,0 +1,6 @@
+---
+"gitbook": patch
+"@gitbook/icons": patch
+---
+
+add browserlists and fix old browser css-masks

packages/gitbook/package.json

@@ -111,5 +111,8 @@
         "e2e-customers": "playwright test e2e/customers.spec.ts",
         "unit": "bun test {src,packages} --preload ./tests/preload-bun.ts",
         "typecheck": "tsc --noEmit"
-    }
+    },
+    "browserslist": [
+        ">0.3%, chrome >= 64, edge >= 79, firefox >= 67, opera >= 51, safari >= 12 and not dead"
+    ]
 }

packages/icons/src/Icon.tsx

@@ -58,8 +58,12 @@ export const Icon = React.forwardRef(function Icon(
             {...rest}
             style={{
                 maskImage: `url(${url})`,
+                //@ts-ignore // For compatibility with older browsers
+                '-webkit-mask-image': `url(${url})`,
                 maskRepeat: 'no-repeat',
+                '-webkit-mask-repeat': 'no-repeat',
                 maskPosition: 'center',
+                '-webkit-mask-position': 'center',
                 ...(size ? { width: size, height: size } : {}),
                 ...rest.style,
             }}