@onereach/styles 2.14.2 → 2.14.3-next.984.0

package/main.css

@@ -1,3 +1,6 @@
+@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap";
+@import "https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24..48,400..700,0..1,0";
+
 @import "tailwindcss/base.css";
 @import "tailwindcss/components.css";
 @import "tailwindcss/utilities.css";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/styles",
-  "version": "2.14.2",
+  "version": "2.14.3-next.984.0",
   "description": "Styles for or-ui-next",
   "main": "./main.css",
   "unpkg": "./main.css",
@@ -48,6 +48,5 @@
   "dependencies": {
     "@tailwindcss/typography": "^0.5.4",
     "tailwindcss": "^3.1.3"
-  },
-  "gitHead": "a3bec18d4acd5f1cd9471d35ad3a9ab3dfed61c5"
+  }
 }

package/tailwind.config.preset.js

@@ -133,7 +133,7 @@ module.exports = {
     fontFamily: {
       ...parseFontFamilyTokens(typographyTokens),
       'inherit': 'inherit',
-      'icon': '"Material Symbols Rounded"',
+      'icon': '"Material Symbols Outlined"',
     },
 
     fontSize: {
@@ -153,34 +153,8 @@ module.exports = {
   },
 
   plugins: [
-    plugin(({ addBase, addVariant, addUtilities, theme }) => {
+    plugin(({ addBase, addUtilities, addVariant, theme }) => {
       addBase({
-        '@font-face': [
-          {
-            'font-family': '"Inter"',
-            'font-style': 'normal',
-            'font-weight': '400',
-            'font-display': 'swap',
-            'src': 'url("https://rsms.me/inter/font-files/Inter-Regular.woff2?v=3.19") format("woff2")',
-          },
-
-          {
-            'font-family': '"Inter"',
-            'font-style': 'normal',
-            'font-weight': '600',
-            'font-display': 'swap',
-            'src': 'url("https://rsms.me/inter/font-files/Inter-SemiBold.woff2?v=3.19") format("woff2")',
-          },
-
-          {
-            'font-family': '"Inter"',
-            'font-style': 'normal',
-            'font-weight': '700',
-            'font-display': 'swap',
-            'src': 'url("https://rsms.me/inter/font-files/Inter-Bold.woff2?v=3.19") format("woff2")',
-          },
-        ],
-
         ':root': {
           fontFamily: theme('fontFamily.body-1-regular'),
           fontSize: theme('fontSize.body-1-regular'),
@@ -188,6 +162,33 @@ module.exports = {
         },
       });
 
+      addUtilities({
+        '.font-icon-outlined': {
+          fontVariationSettings: '"opsz" 48, "wght" 400, "FILL" 0, "GRAD" 0',
+        },
+
+        '.font-icon-filled': {
+          fontVariationSettings: '"opsz" 48, "wght" 400, "FILL" 1, "GRAD" 0',
+        },
+
+        '.font-icon-outlined-bold': {
+          fontVariationSettings: '"opsz" 24, "wght" 700, "FILL" 0, "GRAD" 0',
+        },
+
+        '.font-icon-filled-bold': {
+          fontVariationSettings: '"opsz" 24, "wght" 700, "FILL" 1, "GRAD" 0',
+        },
+      });
+
+      // TODO: Remove when migration complete
+      addUtilities({
+        '.visually-hidden': {
+          width: 0,
+          height: 0,
+          visibility: 'hidden',
+        },
+      });
+
       addVariant('hover', '&:hover:not(.pointer-events-none)');
       addVariant('focus-visible', '&:focus-visible:not(.pointer-events-none)');
       addVariant('focus-within', '&:focus-within:not(.pointer-events-none)');
@@ -210,15 +211,6 @@ module.exports = {
 
       addVariant('enabled', ['&:enabled', '&:not([disabled])']);
       addVariant('disabled', ['&:disabled', '&[disabled]']);
-
-      // TODO: Remove when migration complete
-      addUtilities({
-        '.visually-hidden': {
-          width: 0,
-          height: 0,
-          visibility: 'hidden',
-        },
-      });
     }),
   ],
 };