8000 feat: add premium license behavior for create organization page by jaaydenh · Pull Request #14650 · coder/coder · GitHub
[go: up one dir, main page]
Skip to content

feat: add premium license behavior for create organization page #14650

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Sep 13, 2024
Merged

feat: add premium license behavior for create organization page #14650

Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
791d88d
fix: type
jaaydenh Sep 11, 2024
164b65e
chore: paywall improvements
jaaydenh Sep 11, 2024
81f167e
feat: update create org for premium license
jaaydenh Sep 11, 2024
01ae143
fix: remove []
jaaydenh Sep 13, 2024
09a92cb
feat: update licensing pills to reflect new premium tier (#14670)
jaaydenh Sep 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
chore: paywall improvements
  • Loading branch information
@jaaydenh
jaaydenh committed Sep 11, 2024
commit 164b65ef8a354e62e35eb6b5253c88a96764c689
41 changes: 20 additions & 21 deletions site/src/components/Paywall/Paywall.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,15 +19,7 @@ export const Paywall: FC<PaywallProps> = ({
documentationLink,
}) => {
return (
<div
css={[
styles.root,
(theme) => ({
backgroundImage: `linear-gradient(160deg, transparent, ${theme.branding.background})`,
border: `1px solid ${theme.branding.border}`,
}),
]}
>
<div css={[styles.root]}>
<div>
<Stack direction="row" alignItems="center" css={{ marginBottom: 24 }}>
<h5 css={styles.title}>{message}</h5>
Expand All @@ -45,7 +37,7 @@ export const Paywall: FC<PaywallProps> = ({
</Link>
</div>
<div css={styles.separator} />
<Stack direction="column" alignItems="center" spacing={3}>
<Stack direction="column" alignItems="left" spacing={3}>
<ul css={styles.featureList}>
<li css={styles.feature}>
<FeatureIcon />
Expand All @@ -64,16 +56,18 @@ export const Paywall: FC<PaywallProps> = ({
Unlimited Git & external auth integrations
</li>
</ul>
<Button
href={docs("/enterprise")}
target="_blank"
rel="noreferrer"
startIcon={<span css={{ fontSize: 22 }}>&rarr;</span>}
variant="outlined"
color="neutral"
>
Learn about Premium
</Button>
<div css={styles.learnButton}>
<Button
href={docs("/enterprise")}
target="_blank"
rel="noreferrer"
startIcon={<span css={{ fontSize: 22 }}>&rarr;</span>}
variant="outlined"
color="neutral"
>
Learn about Premium
</Button>
</div>
</Stack>
</div>
);
Expand All @@ -92,7 +86,7 @@ const FeatureIcon: FC = () => {
};

const styles = {
root: () => ({
root: (theme) => ({
display: "flex",
flexDirection: "row",
justifyContent: "center",
Expand All @@ -101,6 +95,8 @@ const styles = {
padding: 24,
borderRadius: 8,
gap: 32,
backgroundImage: `linear-gradient(160deg, transparent, ${theme.branding.background})`,
border: `1px solid ${theme.branding.border}`,
}),
title: {
fontWeight: 600,
Expand All @@ -119,6 +115,9 @@ const styles = {
backgroundColor: theme.branding.divider,
marginLeft: 8,
}),
learnButton: {
padding: "0 28px",
},
featureList: {
listStyle: "none",
margin: 0,
Expand Down
0