Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit1ce4dfe

Browse files
authored
fix: stop text from overflowing on delete org button (#16549)
Closes#16433 I also took the opportunity to convert the components to tailwind. Sincethere aren't designs for this piece of UI yet I tried to match it asclosely as possible using the existing tailwind config![Screenshot 2025-02-12 at 5 0358 PM](https://github.com/user-attachments/assets/71d66269-9440-4692-91ba-fed2e5cb5821)
1 parent77306f3 commit1ce4dfe

File tree

1 file changed

+7
-45
lines changed

1 file changed

+7
-45
lines changed

‎site/src/pages/OrganizationSettingsPage/OrganizationSettingsPageView.tsx

Lines changed: 7 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -126,14 +126,18 @@ export const OrganizationSettingsPageView: FC<
126126
</HorizontalForm>
127127

128128
{!organization.is_default&&(
129-
<HorizontalContainercss={{marginTop:48}}>
129+
<HorizontalContainerclassName="mt-12">
130130
<HorizontalSection
131131
title="Settings"
132132
description="Change or delete your organization."
133133
>
134-
<divcss={styles.dangerSettings}>
134+
<divclassName="flex bg-surface-orange items-center justify-between border border-solid border-orange-600 rounded-md p-3 pl-4 gap-2 flex-grow">
135135
<span>Deleting an organization is irreversible.</span>
136-
<Buttonvariant="destructive"onClick={()=>setIsDeleting(true)}>
136+
<Button
137+
variant="destructive"
138+
onClick={()=>setIsDeleting(true)}
139+
className="min-w-fit"
140+
>
137141
Delete this organization
138142
</Button>
139143
</div>
@@ -151,45 +155,3 @@ export const OrganizationSettingsPageView: FC<
151155
</div>
152156
);
153157
};
154-
155-
conststyles={
156-
dangerSettings:(theme)=>({
157-
display:"flex",
158-
backgroundColor:theme.roles.danger.background,
159-
alignItems:"center",
160-
justifyContent:"space-between",
161-
border:`1px solid${theme.roles.danger.outline}`,
162-
borderRadius:8,
163-
padding:12,
164-
paddingLeft:18,
165-
gap:8,
166-
lineHeight:"18px",
167-
flexGrow:1,
168-
169-
"& .option":{
170-
color:theme.roles.danger.fill.solid,
171-
"&.Mui-checked":{
172-
color:theme.roles.danger.fill.solid,
173-
},
174-
},
175-
176-
"& .info":{
177-
fontSize:14,
178-
fontWeight:600,
179-
color:theme.roles.danger.text,
180-
},
181-
}),
182-
dangerButton:(theme)=>({
183-
borderColor:theme.roles.danger.outline,
184-
color:theme.roles.danger.text,
185-
186-
"&.MuiLoadingButton-loading":{
187-
color:theme.roles.danger.disabled.text,
188-
},
189-
190-
"&:hover:not(:disabled)":{
191-
backgroundColor:theme.roles.danger.hover.background,
192-
borderColor:theme.roles.danger.hover.fill.outline,
193-
},
194-
}),
195-
}satisfiesRecord<string,Interpolation<Theme>>;

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp