chore: Update ADS button min width (#37338)
## Description Sets the min width of an ADS button (expect icon buttons) to be 60px Fixes #`Issue Number` _or_ Fixes `Issue URL` > [!WARNING] > _If no issue exists, please create an issue first, and check with the maintainers if the issue is valid._ ## Automation /ok-to-test tags="@tag.All" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!CAUTION] > 🔴 🔴 🔴 Some tests have failed. > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/11809774671> > Commit: 224483d356083468d27acc5bb6a3d2b059ba8146 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=11809774671&attempt=1&selectiontype=test&testsstatus=failed&specsstatus=fail" target="_blank">Cypress dashboard</a>. > Tags: @tag.All > Spec: > The following are new failures, please fix them before merging the PR: <ol> > <li>cypress/e2e/Regression/ClientSide/Widgets/ListV2/Childwigets/List_Inputs_spec.js</ol> > <a href="https://internal.appsmith.com/app/cypress-dashboard/identified-flaky-tests-65890b3c81d7400d08fa9ee3?branch=master" target="_blank">List of identified flaky tests</a>. > <hr>Wed, 13 Nov 2024 04:12:40 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [ ] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Enhanced button styles to include minimum width constraints: 60 pixels for small buttons and 80 pixels for medium buttons, improving layout consistency for non-icon buttons. - Introduced a new property `isIconButton` in the `Button` component to adjust button presentation. - Added functionality to refresh the workspace list immediately after creating a new workspace. - Implemented improved error handling by checking for `workspace.id` before rendering workspace items. - Added a new state variable to manage the visibility of the import application modal. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
parent
81c6a1ea8d
commit
df7521e93a
|
|
@ -29,6 +29,7 @@ const getSizes = (size: ButtonSizes, isIconButton?: boolean) => {
|
||||||
? "var(--ads-v2-spaces-2)"
|
? "var(--ads-v2-spaces-2)"
|
||||||
: "var(--ads-v2-spaces-2) var(--ads-v2-spaces-3)"};
|
: "var(--ads-v2-spaces-2) var(--ads-v2-spaces-3)"};
|
||||||
--button-gap: var(--ads-v2-spaces-2);
|
--button-gap: var(--ads-v2-spaces-2);
|
||||||
|
--button-min-width: 60px;
|
||||||
`,
|
`,
|
||||||
md: css`
|
md: css`
|
||||||
--button-font-weight: 600;
|
--button-font-weight: 600;
|
||||||
|
|
@ -37,6 +38,7 @@ const getSizes = (size: ButtonSizes, isIconButton?: boolean) => {
|
||||||
? "var(--ads-v2-spaces-3)"
|
? "var(--ads-v2-spaces-3)"
|
||||||
: "var(--ads-v2-spaces-3) var(--ads-v2-spaces-4)"};
|
: "var(--ads-v2-spaces-3) var(--ads-v2-spaces-4)"};
|
||||||
--button-gap: var(--ads-v2-spaces-3);
|
--button-gap: var(--ads-v2-spaces-3);
|
||||||
|
--button-min-width: 80px;
|
||||||
`,
|
`,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -175,6 +177,8 @@ export const ButtonContent = styled.div<{
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: var(--button-padding);
|
padding: var(--button-padding);
|
||||||
border-radius: inherit;
|
border-radius: inherit;
|
||||||
|
min-width: ${({ isIconButton }) =>
|
||||||
|
isIconButton ? "unset" : "var(--button-min-width)"};
|
||||||
|
|
||||||
& > .${ButtonContentChildrenClassName} {
|
& > .${ButtonContentChildrenClassName} {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
||||||
|
|
@ -318,6 +318,7 @@ export function LeftPaneSection(props: {
|
||||||
<Button
|
<Button
|
||||||
data-testid="t--workspace-new-workspace-auto-create"
|
data-testid="t--workspace-new-workspace-auto-create"
|
||||||
isDisabled={props.isFetchingWorkspaces}
|
isDisabled={props.isFetchingWorkspaces}
|
||||||
|
isIconButton
|
||||||
kind="tertiary"
|
kind="tertiary"
|
||||||
onClick={createNewWorkspace}
|
onClick={createNewWorkspace}
|
||||||
startIcon="add-line"
|
startIcon="add-line"
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user