From 1816733d7eb68f8af7313697cdbf9a93f79d0a15 Mon Sep 17 00:00:00 2001 From: Tomi Olubeko Date: Tue, 27 Dec 2022 12:15:05 -0800 Subject: [PATCH 1/3] Update styling for contentBefore and contentAfter input slots --- .../react-input/src/components/Input/useInputStyles.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-components/react-input/src/components/Input/useInputStyles.ts b/packages/react-components/react-input/src/components/Input/useInputStyles.ts index 03a29c29088b2..cdada7c024d2d 100644 --- a/packages/react-components/react-input/src/components/Input/useInputStyles.ts +++ b/packages/react-components/react-input/src/components/Input/useInputStyles.ts @@ -217,7 +217,7 @@ const useContentStyles = makeStyles({ boxSizing: 'border-box', color: tokens.colorNeutralForeground3, // "icon color" in design spec // special case styling for icons (most common case) to ensure they're centered vertically - '> svg': { display: 'block' }, + '> svg': { display: 'flex' }, }, disabled: { color: tokens.colorNeutralForegroundDisabled, From e46a7fa3b0fae6400869c39695e30cf9b3c9bb8d Mon Sep 17 00:00:00 2001 From: Tomi Olubeko Date: Tue, 27 Dec 2022 12:17:09 -0800 Subject: [PATCH 2/3] change files --- ...i-react-input-68d90a7c-d6d4-4cc4-bd74-697d991fdfca.json | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 change/@fluentui-react-input-68d90a7c-d6d4-4cc4-bd74-697d991fdfca.json diff --git a/change/@fluentui-react-input-68d90a7c-d6d4-4cc4-bd74-697d991fdfca.json b/change/@fluentui-react-input-68d90a7c-d6d4-4cc4-bd74-697d991fdfca.json new file mode 100644 index 0000000000000..93d42f67f7d82 --- /dev/null +++ b/change/@fluentui-react-input-68d90a7c-d6d4-4cc4-bd74-697d991fdfca.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "fix: Update contentBefore and contentAfter slot styling for svg", + "packageName": "@fluentui/react-input", + "email": "ololubek@microsoft.com", + "dependentChangeType": "patch" +} From 6d99aee407e92e851d9d5b72cb9667e7498be223 Mon Sep 17 00:00:00 2001 From: Tomi Olubeko Date: Thu, 5 Jan 2023 15:16:15 -0800 Subject: [PATCH 3/3] Update styling --- .../react-input/src/components/Input/useInputStyles.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-components/react-input/src/components/Input/useInputStyles.ts b/packages/react-components/react-input/src/components/Input/useInputStyles.ts index cdada7c024d2d..f55c51e865c79 100644 --- a/packages/react-components/react-input/src/components/Input/useInputStyles.ts +++ b/packages/react-components/react-input/src/components/Input/useInputStyles.ts @@ -216,8 +216,8 @@ const useContentStyles = makeStyles({ base: { boxSizing: 'border-box', color: tokens.colorNeutralForeground3, // "icon color" in design spec + display: 'flex', // special case styling for icons (most common case) to ensure they're centered vertically - '> svg': { display: 'flex' }, }, disabled: { color: tokens.colorNeutralForegroundDisabled,