Skip to content

Commit 5f8af0e

Browse files
authored
fix: Remove Storybook theme flex style (#27783)
## **Description** In this PR, I updated the wrapper of the Storybook to remove the flex layout, as seen in the provided before and after screenshots. The change simplifies the layout, which was previously managed with a flexbox that is no longer necessary. This modification improves layout management for the `FormTextField` component examples. Both light and dark modes are supported, ensuring a consistent appearance across different themes. ## **Related issues** None reported. ## **Manual testing steps** 1. Open the Storybook interface. 2. Navigate to the `FormTextField` component. 3. Observe the layout in both light and dark themes. 4. Verify that the form elements are correctly aligned and behave as expected. ## **Screenshots/Recordings** ### **Before** <img width="1221" alt="Screenshot 2024-10-10 at 3 48 41 PM" src="https://github.com/user-attachments/assets/1c2e1b91-6c1b-458e-bf35-47db1645c21a"> ### **After** <img width="1079" alt="Screenshot 2024-10-10 at 3 51 02 PM" src="https://github.com/user-attachments/assets/61e1c0d5-6fa8-4490-8a2b-ee9a12d04377"> https://github.com/user-attachments/assets/48c56e71-8dde-4f4b-8a78-15b8f25d116c ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Extension Coding Standards](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/CODING_GUIDELINES.md). - [x] I've completed the PR template to the best of my ability. - [ ] I’ve included tests if applicable. - [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable. - [x] I’ve applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g., pull and build the branch, run the app, and test the code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and/or screenshots.
1 parent 3453c95 commit 5f8af0e

File tree

1 file changed

+0
-1
lines changed

1 file changed

+0
-1
lines changed

.storybook/preview.js

-1
Original file line numberDiff line numberDiff line change
@@ -186,7 +186,6 @@ const withColorScheme = (Story, context) => {
186186
<div
187187
{...props}
188188
style={{
189-
display: 'flex',
190189
padding: '1rem',
191190
backgroundColor: 'var(--color-background-default)',
192191
color: 'var(--color-text-default)',

0 commit comments

Comments
 (0)