format updates

design-tokens · Aug 2, 2023 · 15d896a · 15d896a
1 parent 1b18504
commit 15d896a
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 11 deletions.
diff --git a/technical-reports/color/color-type.md b/technical-reports/color/color-type.md
@@ -217,7 +217,6 @@ Formatted in L (lightness), C (chroma), H (hue) and an optional (A) alpha. Hue r
 | Pros                                       | Cons                                                                        |
 | ------------------------------------------ | --------------------------------------------------------------------------- |
 | Access to 50% more colors (P3 color space) | Colors more perceptually uniform, so it can be harder to distinguish values |
-|                                            | Limited browser support (Safari only)                                       |
 
 ---
 

diff --git a/technical-reports/color/token-naming.md b/technical-reports/color/token-naming.md
@@ -57,7 +57,7 @@ Descriptive names can be more emotional and human-friendly because they often re
 
 | Pros                                                                                                   | Cons                                                                                                                          |
 | ------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------- |
-| Easier for some people to identify with, could be used to distinguish brand colors from product colors | Harder to determine the scale of colors (for example: which ones are lighter vs. darker? How well do they pair together?)     |
+| Easier for some people to identify with, could be used to distinguish brand colors from product colors | Harder to determine the scale of colors (for example: which ones are lighter vs. darker? How well do they pair together?)            |
 |                                                                                                        | Names may not be easily recognized by non-English speakers. For teams working across languages, this may not be a good choice |
 
 <aside class="example">
@@ -204,11 +204,11 @@ In this case, the **$color-text-default** token is defined once, and “value”
       "default": {
         "$description": "Default text color",
         "$value": {
-          "$hex": "#111111"
+          "$hex": "#111111",
         },
         "$darkValue": {
           "$hex": "#ffffff"
-        }
+        },
       }
     }
   }
@@ -232,8 +232,8 @@ In this case, the **$color-text-default** token is defined in two separate files
       "default": {
         "$description": "Default text color",
         "$value": {
-          "$hex": "#111111"
-        }
+          "$hex": "#111111",
+        },
       }
     }
   }
@@ -253,8 +253,8 @@ In this case, the **$color-text-default** token is defined in two separate files
       "default": {
         "$description": "Default text color",
         "$value": {
-          "$hex": "#FFFFFF"
-        }
+          "$hex": "#FFFFFF",
+        },
       }
     }
   }
@@ -299,12 +299,12 @@ export const SubbrandContext = React.createContext();
 
 const Theme = React.forwardRef(function Theme(
   { theme = 'light', subbrand, children },
-  forwardedRef,
+  forwardedRef
 ) {
   return (
     <SubbrandContext.Provider value={subbrand}>
       <ThemeContext.Provider value={theme}>
-        <div className={cx(subbrand, theme)} ref={forwardedRef}>
+        <div className={`${subbrand} ${theme}`} ref={forwardedRef}>
           {children}
         </div>
       </ThemeContext.Provider>
@@ -338,7 +338,7 @@ const Portal = ({ children, ...props }) => {
 
   return (
 
-        <Theme theme={theme} subbrand={cx(interopContext, subbrand)}>
+        <Theme theme={theme} subbrand={`${interopContext} ${subbrand}`}>
           {children}
         </Theme>
     </PortalStackContext.Provider>