@patternfly/design-tokens 1.14.9 → 1.15.1

package/plugins/export-patternfly-tokens/src/ui.tsx

@@ -91,6 +91,10 @@ const saveVars = (text, setJsonFiles, setZipFile) => {
         saveFileName = 'semantic.dimension.highcontrast.json';
         saveFolderNames = ['default/highcontrast'];
         break;
+      case ('/* Semantic Dimension Tokens.Glass.tokens.json */'):
+        saveFileName = 'semantic.dimension.glass.json';
+        saveFolderNames = ['default/glass'];
+        break;
       // Semantic motion
       case '/* Semantic Motion Tokens.Mode 1.tokens.json */':
         saveFileName = 'semantic.motion.json';
@@ -139,6 +143,10 @@ const saveVars = (text, setJsonFiles, setZipFile) => {
         saveFileName = 'redhat.dimension.json';
         saveFolderNames = ['redhat/light'];
         break;
+      case '/* Red Hat Dimension Tokens.Glass.tokens.json */':
+        saveFileName = 'redhat.dimension.glass.json';
+        saveFolderNames = ['redhat/glass'];
+        break;
       case '/* Red Hat Dimension Tokens.High Contrast - Beta.tokens.json */':
         saveFileName = 'redhat.dimension.highcontrast.json';
         saveFolderNames = ['redhat/highcontrast'];

package/tokens/default/dark/base.dark.json

@@ -69,15 +69,15 @@
             },
             "200": {
               "type": "color",
-              "value": "{color.red.40}"
+              "value": "{color.red.60}"
             },
             "300": {
               "type": "color",
-              "value": "{color.red.30}"
+              "value": "{color.red.40}"
             },
             "350": {
               "type": "color",
-              "value": "{color.red.20}"
+              "value": "{color.gray.20}"
             },
             "400": {
               "type": "color",
@@ -382,7 +382,7 @@
           },
           "100": {
             "type": "color",
-            "value": "{color.gray.50}"
+            "value": "{color.gray.60}"
           },
           "200": {
             "type": "color",
@@ -456,7 +456,7 @@
           },
           "200": {
             "type": "color",
-            "value": "rgba(0, 0, 0, 0.7000)"
+            "value": "rgba(0, 0, 0, 0.6000)"
           }
         }
       },

package/tokens/default/dark/charts.dark.json

@@ -270,10 +270,6 @@
           }
         }
       },
-      "letter-spacing": {
-        "type": "string",
-        "value": "normal"
-      },
       "FontSize": {
         "xs": {
           "type": "number",
@@ -292,23 +288,9 @@
           "value": 22
         }
       },
-      "stroke-line-cap": {
+      "letter-spacing": {
         "type": "string",
-        "value": "round"
-      },
-      "layout": {
-        "padding": {
-          "type": "number",
-          "value": 50
-        },
-        "height": {
-          "type": "number",
-          "value": 300
-        },
-        "width": {
-          "type": "number",
-          "value": 450
-        }
+        "value": "normal"
       },
       "label": {
         "padding": {
@@ -336,6 +318,24 @@
           "value": "{color.white}"
         }
       },
+      "layout": {
+        "padding": {
+          "type": "number",
+          "value": 50
+        },
+        "height": {
+          "type": "number",
+          "value": 300
+        },
+        "width": {
+          "type": "number",
+          "value": 450
+        }
+      },
+      "stroke-line-cap": {
+        "type": "string",
+        "value": "round"
+      },
       "stroke-line-join": {
         "type": "string",
         "value": "round"

package/tokens/default/dark/semantic.dark.json

@@ -2,31 +2,7 @@
 {
   "global": {
     "background": {
-      "filter": {
-        "glass": {
-          "blur": {
-            "primary": {
-              "type": "number",
-              "value": 0
-            },
-            "floating": {
-              "type": "number",
-              "value": 0
-            }
-          }
-        }
-      },
       "color": {
-        "glass": {
-          "primary": {
-            "type": "color",
-            "value": "{global.background.color.primary.default}"
-          },
-          "floating": {
-            "type": "color",
-            "value": "{global.background.color.floating.default}"
-          }
-        },
         "primary": {
           "default": {
             "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
@@ -68,6 +44,14 @@
             "value": "{global.dark.background.color.600}"
           }
         },
+        "glass": {
+          "primary": {
+            "default": {
+              "type": "color",
+              "value": "{global.background.color.primary.default}"
+            }
+          }
+        },
         "floating": {
           "default": {
             "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
@@ -83,6 +67,19 @@
             "description": "Use as the clicked state for floating backgrounds",
             "type": "color",
             "value": "{global.dark.background.color.200}"
+          },
+          "secondary": {
+            "default": {
+              "type": "color",
+              "value": "{global.background.color.secondary.default}"
+            }
+          }
+        },
+        "sticky": {
+          "default": {
+            "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
+            "type": "color",
+            "value": "{global.dark.background.color.200}"
           }
         },
         "action": {
@@ -124,7 +121,7 @@
           },
           "read-only": {
             "type": "color",
-            "value": "{global.dark.background.color.300}"
+            "value": "{global.dark.background.color.200}"
           }
         },
         "highlight": {
@@ -170,6 +167,14 @@
             "value": "{global.dark.background.color.500}"
           }
         },
+        "striped": {
+          "row": {
+            "default": {
+              "type": "color",
+              "value": "rgba(21, 21, 21, 0.3000)"
+            }
+          }
+        },
         "loading": {
           "skeleton": {
             "default": {
@@ -183,15 +188,13 @@
           }
         }
       },
-      "opacity": {
+      "filter": {
         "glass": {
-          "primary": {
-            "type": "number",
-            "value": 100
-          },
-          "floating": {
-            "type": "number",
-            "value": 100
+          "blur": {
+            "primary": {
+              "type": "number",
+              "value": 0
+            }
           }
         }
       }
@@ -610,7 +613,7 @@
             "default": {
               "description": "Use as the default color for icons that are placed on a brand background color and/or are paired with on-brand colored text.",
               "type": "color",
-              "value": "{global.icon.color.regular}"
+              "value": "{global.icon.color.inverse}"
             },
             "hover": {
               "description": "Use as the hover state color for icons that are placed on a brand background color and/or are paired with on-brand colored text.",
@@ -1265,7 +1268,7 @@
         "subtle": {
           "description": "Use as the default border color for elements like form inputs, menu toggles, cards, etc.",
           "type": "color",
-          "value": "{global.dark.border.color.50}"
+          "value": "{global.dark.border.color.100}"
         },
         "disabled": {
           "description": "Use as the disabled border color for elements like form inputs, menu toggles, cards, etc.",
@@ -1282,6 +1285,12 @@
           "type": "color",
           "value": "{global.dark.border.color.200}"
         },
+        "glass": {
+          "default": {
+            "type": "color",
+            "value": "{global.border.color.subtle}"
+          }
+        },
         "nonstatus": {
           "red": {
             "default": {
@@ -1954,7 +1963,7 @@
           "directional": {
             "description": "Use as the color of medium box-shadows.",
             "type": "color",
-            "value": "{global.dark.box-shadow.color.200}"
+            "value": "{global.dark.box-shadow.color.100}"
           }
         },
         "lg": {

package/tokens/default/glass/base.dimension.json

@@ -110,16 +110,6 @@
       }
     },
     "font": {
-      "line-height": {
-        "100": {
-          "type": "number",
-          "value": 1.2999999523162842
-        },
-        "200": {
-          "type": "number",
-          "value": 1.5
-        }
-      },
       "weight": {
         "100": {
           "type": "number",
@@ -138,6 +128,16 @@
           "value": 700
         }
       },
+      "line-height": {
+        "100": {
+          "type": "number",
+          "value": 1.2999999523162842
+        },
+        "200": {
+          "type": "number",
+          "value": 1.5
+        }
+      },
       "size": {
         "100": {
           "type": "number",
@@ -229,7 +229,7 @@
         },
         "300": {
           "type": "number",
-          "value": -1
+          "value": -2
         },
         "400": {
           "type": "number",
@@ -237,7 +237,7 @@
         },
         "500": {
           "type": "number",
-          "value": 1
+          "value": 2
         },
         "600": {
           "type": "number",
@@ -263,7 +263,7 @@
         },
         "200": {
           "type": "number",
-          "value": -2
+          "value": -4
         },
         "300": {
           "type": "number",
@@ -279,7 +279,7 @@
         },
         "600": {
           "type": "number",
-          "value": 2
+          "value": 4
         },
         "700": {
           "type": "number",
@@ -293,11 +293,11 @@
       "blur": {
         "100": {
           "type": "number",
-          "value": 4
+          "value": 6
         },
         "200": {
           "type": "number",
-          "value": 9
+          "value": 10
         },
         "300": {
           "type": "number",

package/tokens/default/glass/base.json

@@ -80,7 +80,7 @@
           },
           "300": {
             "type": "color",
-            "value": "{color.red.70}"
+            "value": "{color.gray.60}"
           },
           "400": {
             "type": "color",
@@ -493,7 +493,7 @@
       "color": {
         "50": {
           "type": "color",
-          "value": "{color.gray.10}"
+          "value": "{color.gray.20}"
         },
         "100": {
           "type": "color",