Skip to content

Commit

Permalink
Merge pull request #86 from pluralsh/home-page-updates
Browse files Browse the repository at this point in the history
Home page updates
  • Loading branch information
michaeljguarino authored Jun 18, 2024
2 parents cad983f + 6da5993 commit 4aace10
Show file tree
Hide file tree
Showing 89 changed files with 12,277 additions and 2,689 deletions.
2 changes: 2 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,12 @@ module.exports = {
tsconfigRootDir: __dirname,
},
extends: ['@pluralsh/eslint-config-typescript', 'prettier'],
plugins: ['prettier'],
globals: {
JSX: true,
},
rules: {
'prettier/prettier': 'error',
'@typescript-eslint/consistent-type-exports': 'error',
'@typescript-eslint/consistent-type-imports': [
'error',
Expand Down
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
"@markdoc/markdoc": "0.4.0",
"@markdoc/next.js": "0.2.2",
"@open-draft/until": "2.1.0",
"@pluralsh/design-system": "3.23.0",
"@pluralsh/design-system": "3.48.0",
"@react-types/shared": "3.22.0",
"@tanstack/react-table": "8.10.7",
"@tanstack/react-virtual": "3.0.1",
Expand Down Expand Up @@ -111,6 +111,7 @@
"eslint-plugin-import": "2.29.1",
"eslint-plugin-import-newlines": "1.3.4",
"eslint-plugin-jsx-a11y": "6.8.0",
"eslint-plugin-prettier": "^5.1.3",
"eslint-plugin-react": "7.33.2",
"eslint-plugin-react-hooks": "4.6.0",
"husky": "8.0.3",
Expand Down
127 changes: 59 additions & 68 deletions pages/about.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import { StandardPageWidth } from '@src/components/layout/LayoutHelpers'
import { TextLimiter } from '@src/components/layout/TextLimiter'
import { TeamSection } from '@src/components/page-sections/TeamSection'
import { CenteredSectionHead } from '@src/components/SectionHeads'
import { Cta } from '@src/components/Typography'
import { ResponsiveText } from '@src/components/Typography'
import { getTeamMembers } from '@src/data/getTeamMembers'
import { type TeamMemberFragment } from '@src/generated/graphqlDirectus'
import { cn as classNames } from '@src/utils/cn'
Expand Down Expand Up @@ -49,27 +49,11 @@ export default function About({
</h1>
<Columns className="gap-y-xxxxlarge columns:items-center">
<EqualColumn>
<TextLimiter>
<h2 className="txt-mktg-hero-2 [text-wrap:balance] md:txt-mktg-hero-1">
We are building a flexible, scalable solution to application
delivery.
</h2>
</TextLimiter>
</EqualColumn>
<EqualColumn>
<TextLimiter>
<p className="txt-mktg-body-1 mb-xlarge text-text-light">
At Plural, we believe that there is a better way to solve
the third major constraint—distributed systems operational
cost—that benefits OSS developers and DevOps teams alike.
</p>
<Cta
target="_blank"
href="https://www.plural.sh/blog/what-is-plural/"
>
Read more
</Cta>
</TextLimiter>
<h2 className="txt-mktg-hero-2 [text-wrap:balance] md:txt-mktg-hero-1">
Our mission is to democratize elite DevOps capabilities by
simplifing tooling complexities, fostering a ZeroOps world
that accelerates software development.
</h2>
</EqualColumn>
</Columns>
</StandardPageWidth>
Expand Down Expand Up @@ -108,37 +92,43 @@ export default function About({
'bg-fill-zero',
'flex flex-col',
'gap-y-xxxxlarge py-xxxxlarge',
'md:gap-y-xxxxxlarge md:py-xxxxxlarge',
'xxl:gap-y-xxxxxxlarge xxl:py-xxxxxxlarge',
'md:gap-y-large md:py-xxxxxlarge',
'xxl:py-xxxxxxlarge',
'text-text'
)}
>
<StandardPageWidth className="mb-xxxxxlarge max:mb-xxxxxxlarge">
<CenteredSectionHead
preHeading="About us"
heading="Who we are"
intro={
<p>
We are a dynamic and innovative company that specializes in
creating meaningful connections and fostering collaboration.
At Plural, we believe in the power of diversity and inclusion,
recognizing that when different perspectives come together,
incredible things happen.
</p>
}
className="mb-xxxxlarge text-center"
/>
<ResponsiveText
as="h1"
textStyles={{ '': 'mLabel' }}
color="text-light"
className="mb-xlarge"
>
Who we are
</ResponsiveText>
<ResponsiveText
as="p"
textStyles={{ '': 'mHero2' }}
// color="text-light"
className="mb-xxxxlarge"
>
We are a dynamic and innovative company that specializes in
creating meaningful connections and fostering collaboration. At
Plural, we believe in the power of diversity and inclusion,
recognizing that when different perspectives come together,
incredible things happen.
</ResponsiveText>

<img
alt="The Plural team standing together on a sidewalk in the French Quarter of New Orleans."
src="/images/about/team.jpg"
src="/images/about/team.png"
/>
</StandardPageWidth>
<StandardPageWidth className="mb-xxxxxlarge max:mb-xxxxxxlarge">
<CenteredSectionHead
preHeading="Our company values"
heading="As a driven and cohesive team, we share a common
mission to build something unique."
intro={<p> How we stay connected as a team</p>}
className="mb-xxxxlarge text-center"
/>
<Columns
Expand All @@ -165,16 +155,6 @@ mission to build something unique."
do.
</p>
</Value>
<Value label="Kindness and respect">
<p className="m-0 p-0">
At Plural, kindness and respect are fundamental to our
culture. We foster a supportive and inclusive environment
where everyone is treated with empathy, dignity, and
respect. We believe in the power of positive interactions
and aim to uplift and encourage one another, both within
our team and the wider community.
</p>
</Value>
<Value label="Inclusivity">
<p className="m-0 p-0">
We are dedicated to building an inclusive platform that
Expand All @@ -187,6 +167,16 @@ mission to build something unique."
succeed.
</p>
</Value>
<Value label="Open mindedness and exploration">
<p className="m-0 p-0">
We have a passion for excellence and continuously strive
to deliver the highest quality in everything we do. We are
committed to providing outstanding products, services, and
experiences to our community. We encourage innovation,
embrace challenges, and consistently seek ways to improve
and exceed expectations.
</p>
</Value>
</TextLimiter>
</EqualColumn>
<EqualColumn className="gap-y-xxxxlarge">
Expand All @@ -197,6 +187,16 @@ mission to build something unique."
'columns:gap-y-xxlarge'
)}
>
<Value label="Kindness and respect">
<p className="m-0 p-0">
At Plural, kindness and respect are fundamental to our
culture. We foster a supportive and inclusive environment
where everyone is treated with empathy, dignity, and
respect. We believe in the power of positive interactions
and aim to uplift and encourage one another, both within
our team and the wider community.
</p>
</Value>
<Value label="Excellence">
<p className="m-0 p-0">
We have a passion for excellence and continuously strive
Expand All @@ -207,24 +207,15 @@ mission to build something unique."
and exceed expectations.
</p>
</Value>
<Value label="Open mindedness and exploration">
<p className="m-0 p-0">
We believe in the power of open-mindedness and embracing
new possibilities. We encourage curiosity, creativity, and
a willingness to explore uncharted territories. We foster
an environment that embraces diverse ideas, encourages
constructive feedback, and values continuous learning. We
are open to new perspectives and always ready to embark on
exciting adventures.
</p>
<p className="m-0 p-0">
By embracing these values, we aim to build a vibrant and
thriving community where developers can collaborate,
learn, and grow together. We are committed to making a
positive impact and empowering individuals to achieve
their goals.
</p>
</Value>
<ResponsiveText
as="p"
textStyles={{ '': 'mTitle1' }}
>
By embracing these values, we aim to build a vibrant and
thriving community where developers can collaborate, learn,
and grow together. We are committed to making a positive
impact and empowering individuals to achieve their goals.
</ResponsiveText>
</TextLimiter>
</EqualColumn>
</Columns>
Expand Down
17 changes: 3 additions & 14 deletions pages/contact-sales.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import { ColorModeProvider } from '@pluralsh/design-system'
import Head from 'next/head'
import Script from 'next/script'

Expand All @@ -7,9 +6,6 @@ import { GradientBG } from '@src/components/layout/GradientBG'
import { HeaderPad } from '@src/components/layout/HeaderPad'
import { propsWithGlobalSettings } from '@src/utils/getGlobalProps'

import { HubspotForm } from '../src/components/HubspotForm'
import { StandardPageWidth } from '../src/components/layout/LayoutHelpers'

import { ContactHeader } from './contact'

export default function Index() {
Expand All @@ -25,20 +21,13 @@ export default function Index() {
as={GradientBG}
size="cover"
position="top middle"
image="/images/gradients/gradient-bg-4.jpg"
image="/images/gradients/gradient-bg-12.png"
>
<ContactHeader
title="Contact our sales team"
subtitle="Our pricing is designed to be flexible and transparent, catering to the needs of all customers."
title="Contact sales"
subtitle="Reach out to the team for demos, assistance with onboarding, or any inquiries about our products."
/>
</HeaderPad>
<ColorModeProvider mode="light">
<div className="bg-fill-zero py-xxxxlarge">
<StandardPageWidth>
<HubspotForm formId="5c21c2a5-0e6b-462e-be7e-11bb53209dfc" />
</StandardPageWidth>
</div>
</ColorModeProvider>
</>
)
}
Expand Down
48 changes: 29 additions & 19 deletions pages/contact.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { ColorModeProvider } from '@pluralsh/design-system'
import { Button } from '@pluralsh/design-system'
import Head from 'next/head'
import Link from 'next/link'
import Script from 'next/script'

import { clsx } from 'clsx'
Expand Down Expand Up @@ -33,7 +34,7 @@ export function ContactHeader({
)}
>
<Columns className="gap-y-medium columns:items-center">
<EqualColumn className="justify-start">
<EqualColumn className="mb-xxlarge justify-start self-start lg:mb-0">
<TextLimiter>
<ResponsiveText
className="[text-wrap:balance]"
Expand All @@ -45,20 +46,37 @@ export function ContactHeader({
>
{title}
</ResponsiveText>
</TextLimiter>
</EqualColumn>
<EqualColumn>
<TextLimiter>
<ResponsiveText
as="p"
textStyles={{ '': 'mBody1' }}
textStyles={{ '': 'mTitle2' }}
color="text-light"
className="[text-wrap:balance] "
className="mt-xlarge [text-wrap:balance]"
>
{subtitle}
</ResponsiveText>
<ResponsiveText
as="p"
textStyles={{ '': 'mBody1Bold' }}
color="text-light"
className="mt-xlarge [text-wrap:balance]"
>
Want to learn more about pricing?
</ResponsiveText>
<Button
large
secondary
outline
as={Link}
href="/pricing"
className="mt-medium w-fit"
>
Go to pricing
</Button>
</TextLimiter>
</EqualColumn>
<EqualColumn>
<HubspotForm formId="234b5476-6ee0-4a32-a677-aa1f0d318e9c" />
</EqualColumn>
</Columns>
</div>
</StandardPageWidth>
Expand All @@ -78,21 +96,13 @@ export default function Index() {
as={GradientBG}
size="cover"
position="top middle"
image="/images/gradients/gradient-bg-4.jpg"
image="/images/gradients/gradient-bg-12.png"
>
<ContactHeader
title="Drop us a note"
subtitle="We’re here to help with support available for teams of all
sizes."
title="Contact sales"
subtitle="Reach out to the team for demos, assistance with onboarding, or any inquiries about our products."
/>
</HeaderPad>
<ColorModeProvider mode="light">
<div className="bg-fill-zero py-xxxxlarge">
<StandardPageWidth>
<HubspotForm formId="4381b90a-ac28-4e54-842e-0319c16cf882" />
</StandardPageWidth>
</div>
</ColorModeProvider>
</>
)
}
Expand Down
Loading

0 comments on commit 4aace10

Please sign in to comment.