Skip to content

Commit ad27c06

Browse files
committed
chore: update styling for premium banner
1 parent a6d1e5e commit ad27c06

File tree

1 file changed

+57
-54
lines changed

1 file changed

+57
-54
lines changed

site/src/pages/ManagementSettingsPage/CreateOrganizationPageView.tsx

Lines changed: 57 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ export const CreateOrganizationPageView: FC<
7272
Go Back
7373
</Link>
7474
</div>
75-
<div className="flex flex-col gap-4 w-4/5 max-w-xl min-w-72 mx-auto">
75+
<div className="flex flex-col gap-4 w-full min-w-72 mx-auto">
7676
<div className="flex flex-col items-center">
7777
{Boolean(error) && !isApiValidationError(error) && (
7878
<div css={{ marginBottom: 32 }}>
@@ -108,65 +108,68 @@ export const CreateOrganizationPageView: FC<
108108
</p>
109109
</header>
110110
</div>
111-
112111
<ChooseOne>
113112
<Cond condition={!isEntitled}>
114-
<Paywall
115-
message="Organizations"
116-
description="Create multiple organizations within a single Coder deployment, allowing several platform teams to operate with isolated users, templates, and distinct underlying infrastructure."
117-
documentationLink={docs("/admin/users/organizations")}
118-
/>
113+
<div className="min-w-fit mx-auto">
114+
<Paywall
115+
message="Organizations"
116+
description="Create multiple organizations within a single Coder deployment, allowing several platform teams to operate with isolated users, templates, and distinct underlying infrastructure."
117+
documentationLink={docs("/admin/users/organizations")}
118+
/>
119+
</div>
119120
</Cond>
120121
<Cond>
121-
<form
122-
onSubmit={form.handleSubmit}
123-
aria-label="Organization settings form"
124-
className="flex flex-col gap-6 w-full"
125-
>
126-
<fieldset
127-
disabled={form.isSubmitting}
128-
className="flex flex-col gap-6 w-full border-none"
122+
<div className="flex flex-col gap-4 w-full max-w-xl min-w-72 mx-auto">
123+
<form
124+
onSubmit={form.handleSubmit}
125+
aria-label="Organization settings form"
126+
className="flex flex-col gap-6 w-full"
129127
>
130-
<TextField
131-
{...getFieldHelpers("name")}
132-
onChange={onChangeTrimmed(form)}
133-
fullWidth
134-
label="Slug"
135-
/>
136-
<TextField
137-
{...getFieldHelpers("display_name")}
138-
fullWidth
139-
label="Display name"
140-
/>
141-
<TextField
142-
{...getFieldHelpers("description")}
143-
multiline
144-
label="Description"
145-
rows={2}
146-
/>
147-
<IconField
148-
{...getFieldHelpers("icon")}
149-
onChange={onChangeTrimmed(form)}
150-
onPickEmoji={(value) => form.setFieldValue("icon", value)}
151-
/>
152-
</fieldset>
153-
<div className="flex flex-row gap-2">
154-
<Button
155-
className="w-20"
156-
type="submit"
157-
data-testid="form-submit"
128+
<fieldset
129+
disabled={form.isSubmitting}
130+
className="flex flex-col gap-6 w-full border-none"
158131
>
159-
Save
160-
</Button>
161-
<Button
162-
variant="outline"
163-
type="button"
164-
onClick={() => navigate("/organizations")}
165-
>
166-
Cancel
167-
</Button>
168-
</div>
169-
</form>
132+
<TextField
133+
{...getFieldHelpers("name")}
134+
onChange={onChangeTrimmed(form)}
135+
fullWidth
136+
label="Slug"
137+
/>
138+
<TextField
139+
{...getFieldHelpers("display_name")}
140+
fullWidth
141+
label="Display name"
142+
/>
143+
<TextField
144+
{...getFieldHelpers("description")}
145+
multiline
146+
label="Description"
147+
rows={2}
148+
/>
149+
<IconField
150+
{...getFieldHelpers("icon")}
151+
onChange={onChangeTrimmed(form)}
152+
onPickEmoji={(value) => form.setFieldValue("icon", value)}
153+
/>
154+
</fieldset>
155+
<div className="flex flex-row gap-2">
156+
<Button
157+
className="w-20"
158+
type="submit"
159+
data-testid="form-submit"
160+
>
161+
Save
162+
</Button>
163+
<Button
164+
variant="outline"
165+
type="button"
166+
onClick={() => navigate("/organizations")}
167+
>
168+
Cancel
169+
</Button>
170+
</div>
171+
</form>
172+
</div>
170173
</Cond>
171174
</ChooseOne>
172175
</div>

0 commit comments

Comments
 (0)