From 1f6f0ee8af9b1405d39d0cea6e3e2bcf93e1333a Mon Sep 17 00:00:00 2001 From: olearyb Date: Tue, 18 Nov 2025 15:17:59 +0000 Subject: [PATCH 1/7] fix: Missed a change in the last update, correcting the size tokens for the Text Area component-level tokens to change the term "default" to "medium". This applies to the following tokens in each theme: component.textarea.medium.padding-x component.textarea.medium.padding-y --- .../made-tokens/json/made-unify-tokens.json | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/plugins/made-tokens/json/made-unify-tokens.json b/plugins/made-tokens/json/made-unify-tokens.json index e69c69ad..7d40acf9 100644 --- a/plugins/made-tokens/json/made-unify-tokens.json +++ b/plugins/made-tokens/json/made-unify-tokens.json @@ -5352,7 +5352,7 @@ } }, "textarea": { - "default": { + "medium": { "padding-x": { "$componentLevelToken": "true", "$type": "spacing", @@ -8957,7 +8957,7 @@ } }, "textarea": { - "default": { + "medium": { "padding-x": { "$componentLevelToken": "true", "$type": "spacing", @@ -12480,7 +12480,7 @@ } }, "textarea": { - "default": { + "medium": { "padding-x": { "$componentLevelToken": "true", "$type": "spacing", @@ -17404,8 +17404,6 @@ "component.table.cell.data.font-weight": "8ce8d531e856cab0d7cc24342a33445b12aeee9e", "component.table.cell.data.line-height": "2aaf5b16746f87ffb874c75eb529a9c71983c112", "component.table.border-radius": "8460ece4ca59b5d0783209fdb3ea18042861ffb8", - "component.textarea.default.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", - "component.textarea.default.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f", "component.textarea.large.padding-x": "7eb31ea20382c6d4ca72cc1579c1f4df7e2fdb66", "component.textarea.large.padding-y": "12137718e5dd8eb236801cf3a764f0e6fe326eca", "component.drawer-picker.padding-x": "cee89d16db31c7beeadf6a5c81c3b183daa4294f", @@ -17488,7 +17486,9 @@ "font-weight.h6": "9b4a35b1472d74c70e35fb96c7526470d784348a", "font-weight.eyebrow": "34160f671e75bf9f6dfa4bafdadf40bd1b63c4cd", "font-weight.link": "875061cb2262c6cf299a9985d2c63a7a013761a7", - "component.link.hover.text-mode-dark": "09841d3dfac56b4ea6935ae049f5677cf01a6899" + "component.link.hover.text-mode-dark": "09841d3dfac56b4ea6935ae049f5677cf01a6899", + "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", + "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f" }, "$figmaCollectionId": "VariableCollectionId:1:5", "$figmaModeId": "1:4", @@ -18104,8 +18104,6 @@ "component.table.cell.data.font-weight": "8ce8d531e856cab0d7cc24342a33445b12aeee9e", "component.table.cell.data.line-height": "2aaf5b16746f87ffb874c75eb529a9c71983c112", "component.table.border-radius": "8460ece4ca59b5d0783209fdb3ea18042861ffb8", - "component.textarea.default.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", - "component.textarea.default.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f", "component.textarea.large.padding-x": "7eb31ea20382c6d4ca72cc1579c1f4df7e2fdb66", "component.textarea.large.padding-y": "12137718e5dd8eb236801cf3a764f0e6fe326eca", "component.drawer-picker.padding-x": "cee89d16db31c7beeadf6a5c81c3b183daa4294f", @@ -18189,7 +18187,9 @@ "font-weight.eyebrow": "34160f671e75bf9f6dfa4bafdadf40bd1b63c4cd", "font-weight.link": "875061cb2262c6cf299a9985d2c63a7a013761a7", "color.border.strongest-mode-light": "3ab4ff526239620a34d8636e00b5f552de3715ae", - "color.border.strongest-mode-dark": "30d5ef2b02a161c223e7d9f96f85acab7d406fd4" + "color.border.strongest-mode-dark": "30d5ef2b02a161c223e7d9f96f85acab7d406fd4", + "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", + "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f" }, "$figmaCollectionId": "VariableCollectionId:1:5", "$figmaModeId": "1:3", @@ -18773,8 +18773,6 @@ "component.table.cell.data.font-weight": "8ce8d531e856cab0d7cc24342a33445b12aeee9e", "component.table.cell.data.line-height": "2aaf5b16746f87ffb874c75eb529a9c71983c112", "component.table.border-radius": "8460ece4ca59b5d0783209fdb3ea18042861ffb8", - "component.textarea.default.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", - "component.textarea.default.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f", "component.textarea.large.padding-x": "7eb31ea20382c6d4ca72cc1579c1f4df7e2fdb66", "component.textarea.large.padding-y": "12137718e5dd8eb236801cf3a764f0e6fe326eca", "component.drawer-picker.padding-x": "cee89d16db31c7beeadf6a5c81c3b183daa4294f", @@ -18857,7 +18855,9 @@ "font-weight.h6": "9b4a35b1472d74c70e35fb96c7526470d784348a", "font-weight.eyebrow": "34160f671e75bf9f6dfa4bafdadf40bd1b63c4cd", "font-weight.link": "875061cb2262c6cf299a9985d2c63a7a013761a7", - "component.link.hover.text-color-mode-dark": "54cab3abef3c6a61cb59396026d88bc81740dfb4" + "component.link.hover.text-color-mode-dark": "54cab3abef3c6a61cb59396026d88bc81740dfb4", + "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", + "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f" }, "$figmaCollectionId": "VariableCollectionId:1:5", "$figmaModeId": "1:5", From 175482c48a841ee1c006a121ddcc6076a9a8f97a Mon Sep 17 00:00:00 2001 From: olearyb Date: Fri, 21 Nov 2025 11:19:47 +0000 Subject: [PATCH 2/7] Fix: Updating the value of the token: component.modal.top-bar.padding-right In the mastercar theme, this was incorrectly set to 3rem {size-space.12-x} instead of 1.5rem {size-space.6-x} Updating the value of the token: color.background.backdrop-mode-light Specifically, updating the opacity value in the Mastercard theme from 70% opacity to 40% so that it is the same as the Unify theme. --- plugins/made-tokens/json/made-unify-tokens.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/plugins/made-tokens/json/made-unify-tokens.json b/plugins/made-tokens/json/made-unify-tokens.json index 7d40acf9..3b787937 100644 --- a/plugins/made-tokens/json/made-unify-tokens.json +++ b/plugins/made-tokens/json/made-unify-tokens.json @@ -6161,7 +6161,7 @@ "studio.tokens": { "modify": { "type": "alpha", - "value": "0.7", + "value": "0.4", "space": "lch" } } @@ -6174,7 +6174,7 @@ "studio.tokens": { "modify": { "type": "alpha", - "value": "0.7", + "value": "0.4", "space": "lch" } } @@ -7477,7 +7477,7 @@ "padding-right": { "$componentLevelToken": "true", "$type": "spacing", - "$value": "{size-space.12-x}" + "$value": "{size-space.6-x}" } }, "border-radius": { From 09be9368bca01ceb0edaa684d66f51a81bea993b Mon Sep 17 00:00:00 2001 From: olearyb Date: Mon, 9 Feb 2026 15:47:08 +0000 Subject: [PATCH 3/7] Adjusting hover and active colors for link component tokens: +-----------------------------------------------------+-------------------+-------------------+ | Token name | Old value | New value | +-----------------------------------------------------+-------------------+-------------------+ | component.link.hover.text-color-mode-light | {color.gray.1600} | {color.gray.1300} | +-----------------------------------------------------+-------------------+-------------------+ | component.link.active.text-color-mode-light | {color.gray.1400} | {color.gray.1200} | +-----------------------------------------------------+-------------------+-------------------+ | component.link.hover.text-color-mode-dark | {color.gray.200} | {color.gray.300} | +-----------------------------------------------------+-------------------+-------------------+ | component.link.active.text-color-mode-dark | {color.gray.400} | {color.gray.500} | +-----------------------------------------------------+-------------------+-------------------+ | component.link.neutral.hover.text-color-mode-light | {color.gray.1600} | {color.gray.1300} | +-----------------------------------------------------+-------------------+-------------------+ | component.link.neutral.active.text-color-mode-light | {color.gray.1400} | {color.gray.1200} | +-----------------------------------------------------+-------------------+-------------------+ | component.link.neutral.hover.text-color-mode-dark | {color.gray.200} | {color.gray.300} | +-----------------------------------------------------+-------------------+-------------------+ | component.link.neutral.active.text-color-mode-dark | {color.gray.400} | {color.gray.500} | +-----------------------------------------------------+-------------------+-------------------+ --- plugins/made-tokens/json/made-unify-tokens.json | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/plugins/made-tokens/json/made-unify-tokens.json b/plugins/made-tokens/json/made-unify-tokens.json index 3b787937..639cabde 100644 --- a/plugins/made-tokens/json/made-unify-tokens.json +++ b/plugins/made-tokens/json/made-unify-tokens.json @@ -7155,21 +7155,21 @@ "hover": { "text-color-mode-light": { "$type": "color", - "$value": "{color.gray.1600}" + "$value": "{color.gray.1300}" }, "text-mode-dark": { "$type": "color", - "$value": "{color.gray.200}" + "$value": "{color.gray.300}" } }, "active": { "text-color-mode-light": { "$type": "color", - "$value": "{color.gray.1400}" + "$value": "{color.gray.1200}" }, "text-color-mode-dark": { "$type": "color", - "$value": "{color.gray.400}" + "$value": "{color.gray.500}" } }, "visited": { @@ -7196,21 +7196,21 @@ "hover": { "text-color-mode-light": { "$type": "color", - "$value": "{color.gray.1600}" + "$value": "{color.gray.1300}" }, "text-color-mode-dark": { "$type": "color", - "$value": "{color.gray.200}" + "$value": "{color.gray.300}" } }, "active": { "text-color-mode-light": { "$type": "color", - "$value": "{color.gray.1400}" + "$value": "{color.gray.1200}" }, "text-color-mode-dark": { "$type": "color", - "$value": "{color.gray.400}" + "$value": "{color.gray.500}" } }, "visited": { From ada6b8343da22b86a3929fc256a9f7eede01beed Mon Sep 17 00:00:00 2001 From: olearyb Date: Mon, 9 Feb 2026 16:07:54 +0000 Subject: [PATCH 4/7] Adding new tokens for the backgrounds of the Tab components in their "contained" variants: | Token | Reference *new* | Raw *new* | +------------------------------------------------+-----------------+-----------+ | component.tabs.contained.background-mode-light | {gray.300} | {#F3F0EE} | +------------------------------------------------+-----------------+-----------+ | component.tabs.contained.background-mode-dark | {gray.1500} | {#2A2A28} | +------------------------------------------------+-----------------+-----------+ | component.tabs.contained.background | | | --- .../made-tokens/json/made-unify-tokens.json | 40 +++++++++++++++++++ 1 file changed, 40 insertions(+) diff --git a/plugins/made-tokens/json/made-unify-tokens.json b/plugins/made-tokens/json/made-unify-tokens.json index 639cabde..c0a5869c 100644 --- a/plugins/made-tokens/json/made-unify-tokens.json +++ b/plugins/made-tokens/json/made-unify-tokens.json @@ -4190,6 +4190,16 @@ "letter-spacing": { "$type": "letterSpacing", "$value": "{component.tabs.contained.font-size} * -0.02" + }, + "background-mode-dark": { + "$type": "color", + "$value": "{color.gray.1500}", + "$description": "Background color of tabs component group in its contained style. " + }, + "background-mode-light": { + "$type": "color", + "$value": "{color.gray.300}", + "$description": "Background color of tabs component group in its contained style. " } }, "minimal": { @@ -7795,6 +7805,16 @@ "letter-spacing": { "$type": "letterSpacing", "$value": "{component.tabs.contained.font-size} * -0.02" + }, + "background-mode-light": { + "$type": "color", + "$value": "{color.gray.300}", + "$description": "Background color of tabs component group in its contained style. " + }, + "background-mode-dark": { + "$type": "color", + "$value": "{color.gray.1500}", + "$description": "Background color of tabs component group in its contained style. " } }, "minimal": { @@ -12003,6 +12023,16 @@ "letter-spacing": { "$type": "letterSpacing", "$value": "{component.tabs.contained.font-size} * 0" + }, + "background-mode-dark": { + "$type": "color", + "$value": "{color.gray.1500}", + "$description": "Background color of tabs component group in its contained style. " + }, + "background-mode-light": { + "$type": "color", + "$value": "{color.neutral.200}", + "$description": "Background color of tabs component group in its contained style. " } }, "minimal": { @@ -14790,6 +14820,11 @@ "$type": "color", "$value": "{color.background.surface.default-mode-light}" } + }, + "background": { + "$type": "color", + "$value": "{component.tabs.contained.background-mode-light}", + "$description": "Background color of tabs component group in its contained style. " } }, "minimal": { @@ -15989,6 +16024,11 @@ "$type": "color", "$value": "{color.background.surface.default-mode-dark}" } + }, + "background": { + "$type": "color", + "$value": "{component.tabs.contained.background-mode-dark}", + "$description": "Background color of tabs component group in its contained style. " } }, "minimal": { From 7293d3388ebe80374aac70d32feca66fde4044b1 Mon Sep 17 00:00:00 2001 From: olearyb Date: Tue, 10 Feb 2026 13:14:07 +0000 Subject: [PATCH 5/7] . --- .../made-tokens/json/made-unify-tokens.json | 38 +++++++++++-------- 1 file changed, 23 insertions(+), 15 deletions(-) diff --git a/plugins/made-tokens/json/made-unify-tokens.json b/plugins/made-tokens/json/made-unify-tokens.json index c0a5869c..b7e2884c 100644 --- a/plugins/made-tokens/json/made-unify-tokens.json +++ b/plugins/made-tokens/json/made-unify-tokens.json @@ -17026,8 +17026,8 @@ "color.border.brand-mode-dark": "01522591d106784687fdec4256c701d3dee69dd0", "color.border.default-mode-light": "7c721cc229017c5631e2248d84fbb840fed02659", "color.border.default-mode-dark": "d5825c9de6976591db713de5777bef30f2701b05", - "color.border.bold-mode-light": "6772e2a6f3e82a98e95658ad9886c337ef17b487", - "color.border.bold-mode-dark": "b0064537a61ce6d979e712de4fdc796cf8df69c6", + "color.border.bold-mode-light": "355025673d273c4da90f7bcf6b1a2ba929005285", + "color.border.bold-mode-dark": "7d180be6d024180d62b181d0bb8b401088b8fe19", "color.border.strong-mode-light": "d901f1a7a7a8dcde66c90df2fc045309c4d570d8", "color.border.strong-mode-dark": "5a05b11966ebd7142fbc07d048dad4c5b2c71087", "color.border.neutral-mode-light": "72f9656241d0dd822f3cd20b8be779327fb53bbe", @@ -17238,6 +17238,8 @@ "component.tabs.contained.font-weight": "300a600a237fe4b97559b7f60cb842bf9e4e6a68", "component.tabs.contained.line-height": "70135a8cb9485089b5ba333925683c43c0b444a7", "component.tabs.contained.letter-spacing": "4557988163e3487ca6dae85062a7c4406f6cbc50", + "component.tabs.contained.background-mode-dark": "7755bfa1912157a2139bb5588a205d9cc544b467", + "component.tabs.contained.background-mode-light": "198df44f037cde8237f2f06ecac39e2ec8c36a91", "component.tabs.minimal.item.background-selected-mode-light": "2567d64ec6c357ad4b33addb6517efbc7fa61c23", "component.tabs.minimal.item.background-selected-mode-dark": "4b8f324b03c4fce37f5d58c039ecc256d8419f83", "component.tag.border-color-mode-light": "d9768a63e1a75190c1e5976f0bed6ef9dc2bc21e", @@ -17444,6 +17446,8 @@ "component.table.cell.data.font-weight": "8ce8d531e856cab0d7cc24342a33445b12aeee9e", "component.table.cell.data.line-height": "2aaf5b16746f87ffb874c75eb529a9c71983c112", "component.table.border-radius": "8460ece4ca59b5d0783209fdb3ea18042861ffb8", + "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", + "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f", "component.textarea.large.padding-x": "7eb31ea20382c6d4ca72cc1579c1f4df7e2fdb66", "component.textarea.large.padding-y": "12137718e5dd8eb236801cf3a764f0e6fe326eca", "component.drawer-picker.padding-x": "cee89d16db31c7beeadf6a5c81c3b183daa4294f", @@ -17526,9 +17530,7 @@ "font-weight.h6": "9b4a35b1472d74c70e35fb96c7526470d784348a", "font-weight.eyebrow": "34160f671e75bf9f6dfa4bafdadf40bd1b63c4cd", "font-weight.link": "875061cb2262c6cf299a9985d2c63a7a013761a7", - "component.link.hover.text-mode-dark": "09841d3dfac56b4ea6935ae049f5677cf01a6899", - "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", - "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f" + "component.link.hover.text-mode-dark": "4f5a6c301c02c6b31d5020abb183991f0cb16032" }, "$figmaCollectionId": "VariableCollectionId:1:5", "$figmaModeId": "1:4", @@ -17831,7 +17833,7 @@ "component.link.default.text-color-mode-light": "e252daa5d288dbdb358de6c09f9b7bf49769433c", "component.link.default.text-color-mode-dark": "0f1ccfd68e2bbb924dc95900fa1bdb16e38b3af8", "component.link.hover.text-color-mode-light": "d070ded1abee44ba335bedce8c7d885a343ed0ec", - "component.link.hover.text-color-mode-dark": "54cab3abef3c6a61cb59396026d88bc81740dfb4", + "component.link.hover.text-color-mode-dark": "11f0ea1cbe6512e75b3c859500aea4b05507ee79", "component.link.active.text-color-mode-light": "ad894d05bca4b02a78f72c41c9ffd70735ca2e61", "component.link.active.text-color-mode-dark": "52535d5265dd4c696c9349ab1ac5aaf5b46a7da2", "component.link.visited.text-color-mode-light": "2aee1b0ac0b31748b55d8b889672a182d324e5f0", @@ -17938,6 +17940,8 @@ "component.tabs.contained.font-weight": "300a600a237fe4b97559b7f60cb842bf9e4e6a68", "component.tabs.contained.line-height": "70135a8cb9485089b5ba333925683c43c0b444a7", "component.tabs.contained.letter-spacing": "4557988163e3487ca6dae85062a7c4406f6cbc50", + "component.tabs.contained.background-mode-dark": "7755bfa1912157a2139bb5588a205d9cc544b467", + "component.tabs.contained.background-mode-light": "198df44f037cde8237f2f06ecac39e2ec8c36a91", "component.tabs.minimal.item.background-selected-mode-light": "2567d64ec6c357ad4b33addb6517efbc7fa61c23", "component.tabs.minimal.item.background-selected-mode-dark": "4b8f324b03c4fce37f5d58c039ecc256d8419f83", "component.tag.border-color-mode-light": "d9768a63e1a75190c1e5976f0bed6ef9dc2bc21e", @@ -18144,6 +18148,8 @@ "component.table.cell.data.font-weight": "8ce8d531e856cab0d7cc24342a33445b12aeee9e", "component.table.cell.data.line-height": "2aaf5b16746f87ffb874c75eb529a9c71983c112", "component.table.border-radius": "8460ece4ca59b5d0783209fdb3ea18042861ffb8", + "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", + "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f", "component.textarea.large.padding-x": "7eb31ea20382c6d4ca72cc1579c1f4df7e2fdb66", "component.textarea.large.padding-y": "12137718e5dd8eb236801cf3a764f0e6fe326eca", "component.drawer-picker.padding-x": "cee89d16db31c7beeadf6a5c81c3b183daa4294f", @@ -18226,10 +18232,8 @@ "font-weight.h6": "9b4a35b1472d74c70e35fb96c7526470d784348a", "font-weight.eyebrow": "34160f671e75bf9f6dfa4bafdadf40bd1b63c4cd", "font-weight.link": "875061cb2262c6cf299a9985d2c63a7a013761a7", - "color.border.strongest-mode-light": "3ab4ff526239620a34d8636e00b5f552de3715ae", - "color.border.strongest-mode-dark": "30d5ef2b02a161c223e7d9f96f85acab7d406fd4", - "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", - "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f" + "color.border.strongest-mode-light": "3f1c4d3b36a85bb1153d4ee7b606ca1aff2508a3", + "color.border.strongest-mode-dark": "5e9b64d8d076818548e16c432c305522dcc3e2d0" }, "$figmaCollectionId": "VariableCollectionId:1:5", "$figmaModeId": "1:3", @@ -18395,8 +18399,8 @@ "color.border.brand-mode-dark": "01522591d106784687fdec4256c701d3dee69dd0", "color.border.default-mode-light": "7c721cc229017c5631e2248d84fbb840fed02659", "color.border.default-mode-dark": "d5825c9de6976591db713de5777bef30f2701b05", - "color.border.bold-mode-light": "6772e2a6f3e82a98e95658ad9886c337ef17b487", - "color.border.bold-mode-dark": "b0064537a61ce6d979e712de4fdc796cf8df69c6", + "color.border.bold-mode-light": "355025673d273c4da90f7bcf6b1a2ba929005285", + "color.border.bold-mode-dark": "7d180be6d024180d62b181d0bb8b401088b8fe19", "color.border.strong-mode-light": "d901f1a7a7a8dcde66c90df2fc045309c4d570d8", "color.border.strong-mode-dark": "5a05b11966ebd7142fbc07d048dad4c5b2c71087", "color.border.neutral-mode-light": "72f9656241d0dd822f3cd20b8be779327fb53bbe", @@ -18607,6 +18611,8 @@ "component.tabs.contained.font-weight": "300a600a237fe4b97559b7f60cb842bf9e4e6a68", "component.tabs.contained.line-height": "70135a8cb9485089b5ba333925683c43c0b444a7", "component.tabs.contained.letter-spacing": "4557988163e3487ca6dae85062a7c4406f6cbc50", + "component.tabs.contained.background-mode-light": "198df44f037cde8237f2f06ecac39e2ec8c36a91", + "component.tabs.contained.background-mode-dark": "7755bfa1912157a2139bb5588a205d9cc544b467", "component.tabs.minimal.item.background-selected-mode-light": "2567d64ec6c357ad4b33addb6517efbc7fa61c23", "component.tabs.minimal.item.background-selected-mode-dark": "4b8f324b03c4fce37f5d58c039ecc256d8419f83", "component.tag.border-color-mode-light": "d9768a63e1a75190c1e5976f0bed6ef9dc2bc21e", @@ -18813,6 +18819,8 @@ "component.table.cell.data.font-weight": "8ce8d531e856cab0d7cc24342a33445b12aeee9e", "component.table.cell.data.line-height": "2aaf5b16746f87ffb874c75eb529a9c71983c112", "component.table.border-radius": "8460ece4ca59b5d0783209fdb3ea18042861ffb8", + "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", + "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f", "component.textarea.large.padding-x": "7eb31ea20382c6d4ca72cc1579c1f4df7e2fdb66", "component.textarea.large.padding-y": "12137718e5dd8eb236801cf3a764f0e6fe326eca", "component.drawer-picker.padding-x": "cee89d16db31c7beeadf6a5c81c3b183daa4294f", @@ -18895,9 +18903,7 @@ "font-weight.h6": "9b4a35b1472d74c70e35fb96c7526470d784348a", "font-weight.eyebrow": "34160f671e75bf9f6dfa4bafdadf40bd1b63c4cd", "font-weight.link": "875061cb2262c6cf299a9985d2c63a7a013761a7", - "component.link.hover.text-color-mode-dark": "54cab3abef3c6a61cb59396026d88bc81740dfb4", - "component.textarea.medium.padding-x": "42bb30661b3def3dbda34543a731cd88f3ce073f", - "component.textarea.medium.padding-y": "865cb72b70ea6864b5e05747a2420af42e8fd50f" + "component.link.hover.text-color-mode-dark": "11f0ea1cbe6512e75b3c859500aea4b05507ee79" }, "$figmaCollectionId": "VariableCollectionId:1:5", "$figmaModeId": "1:5", @@ -19045,6 +19051,7 @@ "component.rating.star.background-active": "4022d412363d5b5fcedaa68f3e2d2e576796f31f", "component.tabs.default.border-color": "095fab8bdb383b3f815d86d32d323d99a8c31215", "component.tabs.contained.item.background-selected": "c1641fdc922f74776369e032ca03bc2618083bec", + "component.tabs.contained.background": "700d92b5fdb0a3d56f4b7518e183ea7544489320", "component.tabs.minimal.item.background-selected": "151b15d5631d8b85bfa706718b14175fd45a3e4b", "component.tag.border-color": "973578214e9977dcb1c9e2482afdb0e85708f4c0", "component.tag.warning.contrast-high.text-color": "ba20156018dfc55f864f92ad8ebcc6f3f4c43334", @@ -19243,6 +19250,7 @@ "component.rating.star.background-active": "4022d412363d5b5fcedaa68f3e2d2e576796f31f", "component.tabs.default.border-color": "095fab8bdb383b3f815d86d32d323d99a8c31215", "component.tabs.contained.item.background-selected": "c1641fdc922f74776369e032ca03bc2618083bec", + "component.tabs.contained.background": "700d92b5fdb0a3d56f4b7518e183ea7544489320", "component.tabs.minimal.item.background-selected": "151b15d5631d8b85bfa706718b14175fd45a3e4b", "component.tag.border-color": "973578214e9977dcb1c9e2482afdb0e85708f4c0", "component.tag.warning.contrast-high.text-color": "ba20156018dfc55f864f92ad8ebcc6f3f4c43334", From 7a8ca1fe9f35e3a1de4cc6479794102cb8096f44 Mon Sep 17 00:00:00 2001 From: olearyb Date: Thu, 12 Feb 2026 18:53:45 +0000 Subject: [PATCH 6/7] Pushing a fox for a token conflict in the Unify theme for the token: component.tabs.contained.background-mode-dark It was referencing a Mastercard primitive color instead of a Unify primitive color --- plugins/made-tokens/json/made-unify-tokens.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/made-tokens/json/made-unify-tokens.json b/plugins/made-tokens/json/made-unify-tokens.json index b7e2884c..6aaaa4fe 100644 --- a/plugins/made-tokens/json/made-unify-tokens.json +++ b/plugins/made-tokens/json/made-unify-tokens.json @@ -12026,7 +12026,7 @@ }, "background-mode-dark": { "$type": "color", - "$value": "{color.gray.1500}", + "$value": "{color.neutral.800}", "$description": "Background color of tabs component group in its contained style. " }, "background-mode-light": { From 331d447e0320b496c3dbe92f583a6b1e8132e9b5 Mon Sep 17 00:00:00 2001 From: olearyb Date: Fri, 13 Mar 2026 15:59:31 +0000 Subject: [PATCH 7/7] The following Design Token changes need to be made, these arose from the Design QA of the first batch of web components. MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit making the token value of color.border.disabled to use the same value as color.background.disabled for the Mastercard theme in both modes. Update the border radius of the checkbox to 4px in the Mastercard theme (currently set to 2px, this doesn’t really fit with the look and feel of the rest of our components) Update the border radius of the Modal to 20px in the Mastercard theme (currently set to 10px, this doesn’t really fit with the look and feel of the rest of our components such as Card and Menu) The feedback from Andy is that our Modal overlay offers too little contrast between the actual modal and the application visuals underneath. I tested in design and I agree. Therefore we need to update 2 tokens: {color.background.backdrop-mode-dark} to color.black at 60% opacity in Dark mode for the Mastercard theme. While this improves it, the modal could still use a border in order to ensure its can be distinguished form the background component.modal.border-color should reference color.border.default in both modes for the Mastercard theme. --- .../made-tokens/json/made-unify-tokens.json | 22 ++++++++++--------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/plugins/made-tokens/json/made-unify-tokens.json b/plugins/made-tokens/json/made-unify-tokens.json index 6aaaa4fe..ae3bb4d2 100644 --- a/plugins/made-tokens/json/made-unify-tokens.json +++ b/plugins/made-tokens/json/made-unify-tokens.json @@ -6184,13 +6184,13 @@ "studio.tokens": { "modify": { "type": "alpha", - "value": "0.4", + "value": "0.6", "space": "lch" } } }, "$type": "color", - "$value": "{color.gray.1800}" + "$value": "{color.black}" }, "surface": { "default-mode-light": { @@ -6696,11 +6696,13 @@ }, "disabled-mode-light": { "$type": "color", - "$value": "{color.gray.100}" + "$value": "{color.gray.300}", + "$description": "Border color for elements in their disabled state" }, "disabled-mode-dark": { "$type": "color", - "$value": "{color.gray.1600}" + "$value": "{color.gray.1400}", + "$description": "Border color for elements in their disabled state" }, "input-mode-light": { "$type": "color", @@ -7461,12 +7463,12 @@ "border-color-mode-light": { "$componentLevelToken": "true", "$type": "color", - "$value": "{color.border.none}" + "$value": "{color.border.default-mode-light}" }, "border-color-mode-dark": { "$componentLevelToken": "true", "$type": "color", - "$value": "{color.border.none}" + "$value": "{color.border.default-mode-dark}" }, "top-bar": { "padding-top": { @@ -7493,7 +7495,7 @@ "border-radius": { "$componentLevelToken": "true", "$type": "borderRadius", - "$value": "{border.radius.default}" + "$value": "{border.radius.large}" }, "box-shadow": { "$componentLevelToken": "true", @@ -9106,7 +9108,7 @@ "border-radius": { "$componentLevelToken": "true", "$type": "borderRadius", - "$value": "{border-radius.01}" + "$value": "{border-radius.02}" }, "box-shadow": { "$componentLevelToken": "true", @@ -14763,7 +14765,7 @@ "border-color": { "$colorSchemeToken": "true", "$type": "color", - "$value": "{color.border.none}" + "$value": "{component.modal.border-color-mode-light}" } }, "card": { @@ -15967,7 +15969,7 @@ "border-color": { "$colorSchemeToken": "true", "$type": "color", - "$value": "{color.border.none}" + "$value": "{component.modal.border-color-mode-dark}" } }, "card": {