Browse Source

replaced subhead with subheading

pull/3/head
remorses 1 year ago
parent
commit
198c3eeb10
32 changed files with 177 additions and 177 deletions
  1. +6
    -6
      demos/src/pages/demos/airtable.tsx
  2. +8
    -8
      demos/src/pages/demos/datocms.tsx
  3. +18
    -18
      demos/src/pages/demos/dovetail.tsx
  4. +6
    -6
      demos/src/pages/demos/kintohub.tsx
  5. +13
    -13
      demos/src/pages/demos/prismic.tsx
  6. +9
    -9
      demos/src/pages/demos/prismic_dark.tsx
  7. +9
    -9
      demos/src/pages/demos/quovery.tsx
  8. +3
    -3
      demos/src/pages/demos/rocketchat.tsx
  9. +6
    -6
      demos/src/pages/demos/spendesk.tsx
  10. +7
    -7
      demos/src/pages/demos/testim.tsx
  11. +1
    -1
      demos/src/pages/docs/banner.mdx
  12. +4
    -4
      demos/src/pages/docs/feature.mdx
  13. +13
    -13
      demos/src/pages/docs/featuresGrid.mdx
  14. +12
    -12
      demos/src/pages/docs/featuresList.mdx
  15. +8
    -8
      demos/src/pages/docs/hero.mdx
  16. +4
    -4
      demos/src/pages/docs/howItWorks.mdx
  17. +3
    -3
      demos/src/pages/docs/pricing.mdx
  18. +1
    -1
      demos/src/pages/docs/sectionTitle.mdx
  19. +2
    -2
      demos/src/pages/docs/testimonialsTweets.mdx
  20. +7
    -7
      demos/src/pages/index.tsx
  21. +2
    -2
      demos/tests/testPrintJsx.tsx
  22. +2
    -2
      react-landing/src/Banner.tsx
  23. +2
    -2
      react-landing/src/Faqs.tsx
  24. +2
    -2
      react-landing/src/Feature.tsx
  25. +4
    -4
      react-landing/src/FeaturesGrid.tsx
  26. +5
    -5
      react-landing/src/FeaturesList.tsx
  27. +2
    -2
      react-landing/src/Hero.tsx
  28. +4
    -4
      react-landing/src/HowItWorks.tsx
  29. +6
    -6
      react-landing/src/Pricing.tsx
  30. +2
    -2
      react-landing/src/SectionTitle.tsx
  31. +3
    -3
      react-landing/src/TestimonialsLogos.tsx
  32. +3
    -3
      react-landing/src/TestimonialsTweets.tsx

+ 6
- 6
demos/src/pages/demos/airtable.tsx View File

@ -36,20 +36,20 @@ const Page = () => (
/>
<Hero
heading='Create, your way'
subhead='Part spreadsheet, part database, and entirely flexible, teams use Airtable to organize their work, their way.'
subheading='Part spreadsheet, part database, and entirely flexible, teams use Airtable to organize their work, their way.'
image={<img width='500px' src='/airtable/hero.png' />}
cta={<EmailForm />}
fingerprint='Already using Airtable? Sign in'
/>
<Feature
heading='Unleash your team’s creative potential with Blocks'
subhead='Airtable Blocks give you a creative palette of app-like functionality that you can mix and match to create the perfect workflow for your team.'
subheading='Airtable Blocks give you a creative palette of app-like functionality that you can mix and match to create the perfect workflow for your team.'
image={<img src='/airtable/feature1.jpg' width='500px' />}
flip
/>
<TestimonialsTweets
heading="Don't you trust me?"
subhead='Trust them'
subheading='Trust them'
tweets={[
'933354946111705097',
'1246480107604078592',
@ -70,14 +70,14 @@ const Page = () => (
prices={[
{
heading: 'FREE',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: ['Unlimited', '1200', '2Gb', '2 Weeks'],
price: 'Free',
cta: <Link color='blue.600'>Get started</Link>,
},
{
heading: 'PLUS',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: [
'Unlimited',
'1200',
@ -91,7 +91,7 @@ const Page = () => (
},
{
heading: 'PRO',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: [
'Unlimited',
'1200',

+ 8
- 8
demos/src/pages/demos/datocms.tsx View File

@ -46,7 +46,7 @@ const Page = () => (
The best companies are built on unified content
</Heading>
}
subhead='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
subheading='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
image={null}
// cta={<Button>Try it now for free!</Button>}
cta={<MailchimpForm url='https://gmail.us20.list-manage.com/subscribe/post?u=7a2ded8c33767b20e6fe824c0&amp;id=e774d6f31e' />}
@ -74,7 +74,7 @@ const Page = () => (
infrastructure?
</Heading>
}
subhead='HERE’S 3 SYMPTOMS TO WATCH OUT'
subheading='HERE’S 3 SYMPTOMS TO WATCH OUT'
image={null}
floatingElement={
<GradientRect
@ -86,18 +86,18 @@ const Page = () => (
/>
<Feature
heading='Is content spread across endless different CMSs?'
subhead='How can you deliver a cohesive brand and message strategy if your company functions in silos and information is manually copy-pasted across tens of different platforms?'
subheading='How can you deliver a cohesive brand and message strategy if your company functions in silos and information is manually copy-pasted across tens of different platforms?'
image={<img src='/datocms/illustration1.svg' width='400px' />}
flip
/>
<Feature
heading='Are you slowed down by legacy technology?'
subhead='Your customers demand blazing-fast digital products, web standards are evolving at the speed of light, yet you rely on 15-years-old solutions like Wordpress that force you to deliver heavy, low-quality user experiences.'
subheading='Your customers demand blazing-fast digital products, web standards are evolving at the speed of light, yet you rely on 15-years-old solutions like Wordpress that force you to deliver heavy, low-quality user experiences.'
image={<img src='/datocms/illustration2.svg' width='400px' />}
/>
<Feature
heading='Is your infrastructure ready for scale?'
subhead='New channels, new markets, complex use cases, fast iterations. You can no longer afford to think locally. You need to have a reliable solution that is capable of following your growth, globally, and lets you adapt along the journey.'
subheading='New channels, new markets, complex use cases, fast iterations. You can no longer afford to think locally. You need to have a reliable solution that is capable of following your growth, globally, and lets you adapt along the journey.'
image={<img src='/datocms/illustration3.svg' width='400px' />}
flip
/>
@ -111,7 +111,7 @@ const Page = () => (
-79%
</Heading>
),
subhead: 'In operational cost',
subheading: 'In operational cost',
},
{
heading: (
@ -119,7 +119,7 @@ const Page = () => (
2x
</Heading>
),
subhead: 'Faster time to market',
subheading: 'Faster time to market',
},
{
heading: (
@ -127,7 +127,7 @@ const Page = () => (
8x
</Heading>
),
subhead: 'Faster loading times',
subheading: 'Faster loading times',
},
]}
bg='gray.100'

+ 18
- 18
demos/src/pages/demos/dovetail.tsx View File

@ -45,7 +45,7 @@ const Page = () => (
/>
<Hero
heading={'Make analysis enjoyable'}
subhead='Discover patterns across a variety of qualitative research methods and unstructured data. Dovetail is analysis software you’ll love to use.'
subheading='Discover patterns across a variety of qualitative research methods and unstructured data. Dovetail is analysis software you’ll love to use.'
image={<img src='/dovetail/hero.png' />}
cta={<Button>Try free for 7 days</Button>}
/>
@ -61,19 +61,19 @@ const Page = () => (
features={[
{
heading: 'Make sense of data',
subhead:
subheading:
'Dovetail is a powerful way to discover patterns across interviews, usability testing, survey responses, and more',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Build your taxonomy',
subhead:
subheading:
'Organize tags into a hierarchy with intuitive controls like drag & drop, and extend your project with global tags.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Visualize your research',
subhead:
subheading:
'Turn qualitative data into quantitative data with highlights, and visualize your work with a variety of beautiful charts.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
@ -81,7 +81,7 @@ const Page = () => (
/>
<Feature
heading='From raw data to insights'
subhead='Simply select text and highlight to add tags. Discover patterns across interview transcripts, usability testing notes, survey responses, and more.'
subheading='Simply select text and highlight to add tags. Discover patterns across interview transcripts, usability testing notes, survey responses, and more.'
bg='#FFF0D4'
direction='column'
floatingElement={
@ -105,77 +105,77 @@ const Page = () => (
/>
<FeaturesGrid
heading='Analysis features'
subhead='Make sense of interview notes, transcripts, survey responses, and more.'
subheading='Make sense of interview notes, transcripts, survey responses, and more.'
features={[
{
heading: 'Highlights',
subhead:
subheading:
'Select text and highlight paragraphs, sentences, or words to tag them.',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Charts',
subhead:
subheading:
'Visualize your tags with multiple charts including a bar chart, pie chart, radar plot, and more.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Tag management',
subhead:
subheading:
'asily modify your tags during analysis with controls like edit, copy, move, and merge.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Search',
subhead:
subheading:
'Search the full text of research data and insights across all projects in your workspace.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Highlights',
subhead:
subheading:
'Select text and highlight paragraphs, sentences, or words to tag them.',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Charts',
subhead:
subheading:
'Visualize your tags with multiple charts including a bar chart, pie chart, radar plot, and more.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Filtering',
subhead:
subheading:
'asily modify your tags during analysis with controls like edit, copy, move, and merge.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Search',
subhead:
subheading:
'Search the full text of research data and insights across all projects in your workspace.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Bulk Edit',
subhead:
subheading:
'Select text and highlight paragraphs, sentences, or words to tag them.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Project',
subhead:
subheading:
'Visualize your tags with multiple charts including a bar chart, pie chart, radar plot, and more.',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Tag management',
subhead:
subheading:
'asily modify your tags during analysis with controls like edit, copy, move, and merge.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Search',
subhead:
subheading:
'Search the full text of research data and insights across all projects in your workspace.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},

+ 6
- 6
demos/src/pages/demos/kintohub.tsx View File

@ -42,7 +42,7 @@ const Page = () => (
<Hero
dark
heading='Develop. Combine. Promote.'
subhead='KintoHub is an all-in-one platform to combine and deploy your backend services, websites, cron jobs, databases and everything your app needs in one place.'
subheading='KintoHub is an all-in-one platform to combine and deploy your backend services, websites, cron jobs, databases and everything your app needs in one place.'
image={
<Box mb='-100px' mr='-200px'>
<Image
@ -76,33 +76,33 @@ const Page = () => (
</Stack>
<HowItWorks
heading='How Kintohub works'
subhead='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
subheading='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
steps={[
{
heading: 'Model your editor',
image: <img width='500px' src='/kintohub/step1.svg' />,
subhead:
subheading:
"Model custom types to match your desired design. Create reusable fields and custom components (we call them Slices...you'll hear us talk about them a lot) to enable dynamic layouts and build the editor experience that you want",
},
{
heading:
'Hand over to your content team to start creating content',
image: <img width='500px' src='/kintohub/step2.svg' />,
subhead:
subheading:
"Once you've managed the initial setup, you can hand the management over to your content team so that editors can start filling content while you're choosing the framework. With Prismic, creating beautiful content becomes simple enough that even non-technical employees can handle it. ",
},
{
heading:
'Deploy on Zeit Now, Netlify, Heroku or your favorite hosting platform',
image: <img width='500px' src='/kintohub/step3.svg' />,
subhead:
subheading:
'We take care of hosting and scaling the publishing tools. All you have to do is host the website, but you can choose whichever hosting platform you prefer.',
},
]}
/>
<Feature
heading='Fully integrated to git'
subhead='Qovery is fully integrated to Github, Bitbucket and Gitlab. Once you have pushed your code, Qovery launches all the necessaries steps to make your application available online.'
subheading='Qovery is fully integrated to Github, Bitbucket and Gitlab. Once you have pushed your code, Qovery launches all the necessaries steps to make your application available online.'
image={<img src='/kintohub/feature1.svg' width='500px' />}
bg='#F8F8FF'
/>

+ 13
- 13
demos/src/pages/demos/prismic.tsx View File

@ -35,40 +35,40 @@ const Page = () => (
/>
<Hero
heading='Make your website editable for the whole team'
subhead='Choose your technology. Use the API to fetch content. Empower
subheading='Choose your technology. Use the API to fetch content. Empower
your content team.'
image={<img width='500px' src='/prismic/code.png' />}
cta={<Button>Test it out</Button>}
/>
<Feature
heading='Prismic is a Content Management System, a tool for editing online content'
subhead="Also known as a headless CMS, an API CMS, a content platform, a disruptive content-as-a-service digital experience...basically we've built a tool that lets you choose your technology, framework, and language and then easily manage your content."
subheading="Also known as a headless CMS, an API CMS, a content platform, a disruptive content-as-a-service digital experience...basically we've built a tool that lets you choose your technology, framework, and language and then easily manage your content."
image={<img src='/prismic/feature1.jpg' width='500px' />}
bg='gray.100'
flip
/>
<HowItWorks
heading='How Prismic works'
subhead='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
subheading='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
steps={[
{
heading: 'Model your editor',
image: <img width='500px' src='/prismic/step1.jpg' />,
subhead:
subheading:
"Model custom types to match your desired design. Create reusable fields and custom components (we call them Slices...you'll hear us talk about them a lot) to enable dynamic layouts and build the editor experience that you want",
},
{
heading:
'Hand over to your content team to start creating content',
image: <img width='500px' src='/prismic/step2.jpg' />,
subhead:
subheading:
"Once you've managed the initial setup, you can hand the management over to your content team so that editors can start filling content while you're choosing the framework. With Prismic, creating beautiful content becomes simple enough that even non-technical employees can handle it. ",
},
{
heading:
'Deploy on Zeit Now, Netlify, Heroku or your favorite hosting platform',
image: <img width='500px' src='/prismic/step3.png' />,
subhead:
subheading:
'We take care of hosting and scaling the publishing tools. All you have to do is host the website, but you can choose whichever hosting platform you prefer.',
},
]}
@ -81,7 +81,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4e288d2e-66cd-4209-9ada-fbfb6f1c19c1_api.svg?auto=compress,format' />
),
subhead:
subheading:
'Unlike a traditional CMS, an API-based approach is much simpler and more secure. This includes options for REST, GraphQL, and SDKs that help our users to make the most of Prismic.',
},
{
@ -89,7 +89,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4080f213-f9e0-47f1-ae57-1d26874f1a08_setup.svg?auto=compress,format' />
),
subhead:
subheading:
"We offer a high-level SLAs, scalability, and a global CDN. We'll make sure that everything is running smoothly in the background so that you can focus on your projects.",
},
{
@ -97,7 +97,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4268d459-cec4-4e46-856b-d2eaba8d71f8_ecosystem.svg?auto=compress,format' />
),
subhead:
subheading:
'Built by developers for developers - we actively engage with the community. Enjoy content that is created specifically for our community and join our Slack to discuss your Prismic projects.',
},
]}
@ -116,14 +116,14 @@ const Page = () => (
prices={[
{
heading: 'FREE',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: ['Unlimited', '1200', '2Gb', '2 Weeks'],
price: 'Free',
cta: <Link color='blue.600'>Get started</Link>,
},
{
heading: 'PLUS',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: [
'Unlimited',
'1200',
@ -137,7 +137,7 @@ const Page = () => (
},
{
heading: 'PRO',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: [
'Unlimited',
'1200',
@ -156,7 +156,7 @@ const Page = () => (
dark
bg='gray.800'
heading='Try Prismic Now!'
subhead='50% discount just for good fellows like you'
subheading='50% discount just for good fellows like you'
// image={<CurlyWire opacity={.5} stroke='red' />}
// cta={<Button>try it out</Button>}
cta={<EmailForm/>}

+ 9
- 9
demos/src/pages/demos/prismic_dark.tsx View File

@ -29,40 +29,40 @@ const Page = () => (
/>
<Hero
heading='Make your website editable for the whole team'
subhead='Choose your technology. Use the API to fetch content. Empower
subheading='Choose your technology. Use the API to fetch content. Empower
your content team.'
image={<img width='500px' src='/prismic/code.png' />}
cta={<Button>Test it out</Button>}
/>
<Feature
heading='Prismic is a Content Management System, a tool for editing online content'
subhead="Also known as a headless CMS, an API CMS, a content platform, a disruptive content-as-a-service digital experience...basically we've built a tool that lets you choose your technology, framework, and language and then easily manage your content."
subheading="Also known as a headless CMS, an API CMS, a content platform, a disruptive content-as-a-service digital experience...basically we've built a tool that lets you choose your technology, framework, and language and then easily manage your content."
image={<img src='/prismic/feature1.jpg' width='500px' />}
bg='gray.900'
flip
/>
<HowItWorks
heading='How Prismic works'
subhead='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
subheading='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
steps={[
{
heading: 'Model your editor',
image: <img width='500px' src='/prismic/step1.jpg' />,
subhead:
subheading:
"Model custom types to match your desired design. Create reusable fields and custom components (we call them Slices...you'll hear us talk about them a lot) to enable dynamic layouts and build the editor experience that you want",
},
{
heading:
'Hand over to your content team to start creating content',
image: <img width='500px' src='/prismic/step2.jpg' />,
subhead:
subheading:
"Once you've managed the initial setup, you can hand the management over to your content team so that editors can start filling content while you're choosing the framework. With Prismic, creating beautiful content becomes simple enough that even non-technical employees can handle it. ",
},
{
heading:
'Deploy on Zeit Now, Netlify, Heroku or your favorite hosting platform',
image: <img width='500px' src='/prismic/step3.png' />,
subhead:
subheading:
'We take care of hosting and scaling the publishing tools. All you have to do is host the website, but you can choose whichever hosting platform you prefer.',
},
]}
@ -75,7 +75,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4e288d2e-66cd-4209-9ada-fbfb6f1c19c1_api.svg?auto=compress,format' />
),
subhead:
subheading:
'Unlike a traditional CMS, an API-based approach is much simpler and more secure. This includes options for REST, GraphQL, and SDKs that help our users to make the most of Prismic.',
},
{
@ -83,7 +83,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4080f213-f9e0-47f1-ae57-1d26874f1a08_setup.svg?auto=compress,format' />
),
subhead:
subheading:
"We offer a high-level SLAs, scalability, and a global CDN. We'll make sure that everything is running smoothly in the background so that you can focus on your projects.",
},
{
@ -91,7 +91,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4268d459-cec4-4e46-856b-d2eaba8d71f8_ecosystem.svg?auto=compress,format' />
),
subhead:
subheading:
'Built by developers for developers - we actively engage with the community. Enjoy content that is created specifically for our community and join our Slack to discuss your Prismic projects.',
},
]}

+ 9
- 9
demos/src/pages/demos/quovery.tsx View File

@ -45,7 +45,7 @@ const Page = () => (
dark
bullet='SUPERPOWERS FOR DEVELOPER'
heading='Deploy complex application, seamlessly'
subhead='Just push your code, we handle the rest'
subheading='Just push your code, we handle the rest'
image={<img width='600px' src='/quovery/hero.png' />}
// cta={<Button>DEPLOY MY APPLICATION</Button>}
cta={<EmailForm />}
@ -64,31 +64,31 @@ const Page = () => (
</Stack>
<SectionTitle
heading='Deploy your application with ease'
subhead='Deploying an application with Qovery is as simple as pushing code with git'
subheading='Deploying an application with Qovery is as simple as pushing code with git'
image={null}
/>
<Feature
heading='Fully integrated to git'
subhead='Qovery is fully integrated to Github, Bitbucket and Gitlab. Once you have pushed your code, Qovery launches all the necessaries steps to make your application available online.'
subheading='Qovery is fully integrated to Github, Bitbucket and Gitlab. Once you have pushed your code, Qovery launches all the necessaries steps to make your application available online.'
image={<img src='/quovery/feature1.png' width='500px' />}
bg='#F8F8FF'
/>
<Feature
heading='1 branch = 1 environment'
subhead={`Every branch is an isolated environment. For instance, the "master\" branch is the production. Every new branch clones the services (databases, data, brokers..) and the apps from the source branch.`}
subheading={`Every branch is an isolated environment. For instance, the "master\" branch is the production. Every new branch clones the services (databases, data, brokers..) and the apps from the source branch.`}
image={<img src='/quovery/feature2.png' width='500px' />}
flip
/>
<Feature
heading='Designed for real world applications'
subhead={`We know that today's applications do not just have just one piece of code and a database, but multiple applications (micro-services) and multiple databases (SQL, NoSQL, Cache..). Qovery has been designed for these complex cases and manages it in an incredible way.`}
subheading={`We know that today's applications do not just have just one piece of code and a database, but multiple applications (micro-services) and multiple databases (SQL, NoSQL, Cache..). Qovery has been designed for these complex cases and manages it in an incredible way.`}
image={<img src='/quovery/feature3.png' width='500px' />}
bg='#F8F8FF'
/>
<FeaturesList
heading='Built for developers'
subhead='Designed by developers for developers for real world applications'
subheading='Designed by developers for developers for real world applications'
centerText
features={[
{
@ -96,7 +96,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4e288d2e-66cd-4209-9ada-fbfb6f1c19c1_api.svg?auto=compress,format' />
),
subhead:
subheading:
'We provide an amazing Command Line Interface (CLI) to manage all your services when needed. The interface has been designed to be instinctively usable.',
},
{
@ -104,7 +104,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4080f213-f9e0-47f1-ae57-1d26874f1a08_setup.svg?auto=compress,format' />
),
subhead:
subheading:
'Projects with multiple applications (micro-services) are supported natively by Qovery. We take care of all the plumbing for you (network, resiliency, deployment).',
},
{
@ -112,7 +112,7 @@ const Page = () => (
icon: (
<img src='https://images.prismic.io/prismic-website%2F4268d459-cec4-4e46-856b-d2eaba8d71f8_ecosystem.svg?auto=compress,format' />
),
subhead:
subheading:
'Qovery rely on the best services (Databases, VPC, Security..) provided by Amazon Web Services. But of course, we take care of all of the complexity of these services for you.',
},
]}

+ 3
- 3
demos/src/pages/demos/rocketchat.tsx View File

@ -44,7 +44,7 @@ const Page = () => (
dark
bullet='SUPERPOWERS FOR DEVELOPER'
heading='Workstream Collaboration & Omnichannel Customer Engagement'
subhead='Control your communication, manage your data and have your own collaboration platform to improve team productivity. Rocket.Chat is scalable and open source, replace email and improve your digital workflow.'
subheading='Control your communication, manage your data and have your own collaboration platform to improve team productivity. Rocket.Chat is scalable and open source, replace email and improve your digital workflow.'
image={<img width='600px' src='/rocketchat/hero.png' />}
// cta={<Button>Start cloud trial</Button>}
cta={<MailchimpForm url='https://gmail.us20.list-manage.com/subscribe/post?u=7a2ded8c33767b20e6fe824c0&amp;id=e774d6f31e' />}
@ -63,7 +63,7 @@ const Page = () => (
<Feature
heading='Replace Email'
flip
subhead='Open up the conversation and remove the need for CC/BCC by using Rocket.Chat Channels and Private Groups to speak to your team openly for greater transparency.'
subheading='Open up the conversation and remove the need for CC/BCC by using Rocket.Chat Channels and Private Groups to speak to your team openly for greater transparency.'
floatingElement={
<Image
minW='500px'
@ -77,7 +77,7 @@ const Page = () => (
/>
<Feature
heading='Team Chat'
subhead='Open up the conversation and remove the need for CC/BCC by using Rocket.Chat Channels and Private Groups to speak to your team openly for greater transparency.'
subheading='Open up the conversation and remove the need for CC/BCC by using Rocket.Chat Channels and Private Groups to speak to your team openly for greater transparency.'
floatingElement={
<Image
minW='700px'

+ 6
- 6
demos/src/pages/demos/spendesk.tsx View File

@ -33,7 +33,7 @@ const Page = () => (
/>
<Hero
heading='Smart spend management for modern businesses'
subhead='Spendesk combines powerful spend management software with corporate cards to help businesses take control of spending.'
subheading='Spendesk combines powerful spend management software with corporate cards to help businesses take control of spending.'
image={<img width='400px' src='/spendesk/hero.png' />}
cta={<Button>Book a demo</Button>}
floatingElement={<GradientCurtains mt='-600px' />}
@ -45,30 +45,30 @@ const Page = () => (
{
heading: 'Control',
icon: <img width='200px' src='/spendesk/step1.svg' />,
subhead:
subheading:
'Multi-level approvals and custom spending limits.',
},
{
heading: 'Pay',
icon: <img width='200px' src='/spendesk/step2.svg' />,
subhead:
subheading:
'Smart company cards, virtual cards, and invoice tracking.',
},
{
heading: 'Track',
icon: <img width='200px' src='/spendesk/step3.svg' />,
subhead: 'Real-time spending overview and receipt capture.',
subheading: 'Real-time spending overview and receipt capture.',
},
{
heading: 'Report',
icon: <img width='200px' src='/spendesk/step4.svg' />,
subhead: 'Simplified bookkeeping and budget analysis.',
subheading: 'Simplified bookkeeping and budget analysis.',
},
]}
/>
{/* <Feature
heading='Prismic is a Content Management System, a tool for editing online content'
subhead="Also known as a headless CMS, an API CMS, a content platform, a disruptive content-as-a-service digital experience...basically we've built a tool that lets you choose your technology, framework, and language and then easily manage your content."
subheading="Also known as a headless CMS, an API CMS, a content platform, a disruptive content-as-a-service digital experience...basically we've built a tool that lets you choose your technology, framework, and language and then easily manage your content."
image={<img src='/spendesk/feature1.png' width='500px' />}
flip
/> */}

+ 7
- 7
demos/src/pages/demos/testim.tsx View File

@ -32,7 +32,7 @@ const Page = () => (
/>
<Hero
heading='Tests that deliver'
subhead='Super-fast authoring. Amazingly stable tests.
subheading='Super-fast authoring. Amazingly stable tests.
Your waycoded, codeless, or both!'
image={
<video
@ -48,7 +48,7 @@ const Page = () => (
/>
<TestimonialsLogos
heading='Trusted by happy customers worldwide'
// subhead='Trusted by happy customers worldwide'
// subheading='Trusted by happy customers worldwide'
testimonials={[
<img src='/datocms/dropbox.svg' />,
<img src='/datocms/hashicorp.svg' />,
@ -65,33 +65,33 @@ const Page = () => (
{
heading: 'Expand test coverage',
icon: <img src='/testim/step1.svg' />,
subhead:
subheading:
'Fast authoring increases coverage and quality across your application..',
},
{
heading: 'Reduce maintenance',
icon: <img src='/testim/step2.svg' />,
subhead:
subheading:
'AI-based stabilizers eliminate flaky tests that consume resources.',
},
{
heading: 'Increase test agility',
icon: <img src='/testim/step3.svg' />,
subhead:
subheading:
'Code, record and manage tests your way with your tools for greater flexibility.',
},
]}
/>
<Feature
heading='Fit your process'
subhead='Testim integrates with the tools you already use so you can stay in your flow.'
subheading='Testim integrates with the tools you already use so you can stay in your flow.'
image={<img src='/testim/feature.png' width='700px' />}
bg='#1A2230'
py='0'
animate={false}
dark
/>
<SectionTitle heading='Start testing with testim' subhead='' cta={<Button>Start Free Trial</Button>} />
<SectionTitle heading='Start testing with testim' subheading='' cta={<Button>Start Free Trial</Button>} />
<Footer
businessName='Prismic'
columns={{

+ 1
- 1
demos/src/pages/docs/banner.mdx View File

@ -11,7 +11,7 @@ The following example recreates the datoCMS landing page
<Banner
// dark
heading='Try Prismic Now!'
subhead='50% discount just for good fellows like you'
subheading='50% discount just for good fellows like you'
image={<GradientCurtains />}
cta={<Button>try it out</Button>}
/>

+ 4
- 4
demos/src/pages/docs/feature.mdx View File

@ -10,7 +10,7 @@ The following example recreates the datoCMS landing page
<LandingProvider primary='#FF593D'>
<Feature
heading='Is content spread across endless different CMSs?'
subhead='How can you deliver a cohesive brand and message strategy if your company functions in silos and information is manually copy-pasted across tens of different platforms?'
subheading='How can you deliver a cohesive brand and message strategy if your company functions in silos and information is manually copy-pasted across tens of different platforms?'
image={<img src='/datocms/illustration1.svg' width='400px' />}
flip
/>
@ -25,7 +25,7 @@ The following example recreates the datoCMS landing page
<LandingProvider primary='#FF593D'>
<Feature
heading='Fully integrated to git'
subhead='Qovery is fully integrated to Github, Bitbucket and Gitlab. Once you have pushed your code, Qovery launches all the necessaries steps to make your application available online.'
subheading='Qovery is fully integrated to Github, Bitbucket and Gitlab. Once you have pushed your code, Qovery launches all the necessaries steps to make your application available online.'
image={<img src='/quovery/feature1.png' width='500px' />}
bg='#F8F8FF'
/>
@ -40,7 +40,7 @@ The following example recreates the datoCMS landing page
<LandingProvider primary='white'>
<Feature
heading='Fit your process'
subhead='Testim integrates with the tools you already use so you can stay in your flow.'
subheading='Testim integrates with the tools you already use so you can stay in your flow.'
image={<img src='/testim/feature.png' width='700px' />}
bg='#1A2230'
py='0'
@ -65,7 +65,7 @@ The following example recreates the datoCMS landing page
<Feature
dark
heading='Team Chat'
subhead='Open up the conversation and remove the need for CC/BCC by using Rocket.Chat Channels and Private Groups to speak to your team openly for greater transparency.'
subheading='Open up the conversation and remove the need for CC/BCC by using Rocket.Chat Channels and Private Groups to speak to your team openly for greater transparency.'
floatingElement={
<Image
minW='700px'

+ 13
- 13
demos/src/pages/docs/featuresGrid.mdx View File

@ -10,77 +10,77 @@ The following example recreates the datoCMS landing page
<LandingProvider primary='#FF593D'>
<FeaturesGrid
heading='Analysis features'
subhead='Make sense of interview notes, transcripts, survey responses, and more.'
subheading='Make sense of interview notes, transcripts, survey responses, and more.'
features={[
{
heading: 'Highlights',
subhead:
subheading:
'Select text and highlight paragraphs, sentences, or words to tag them.',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Charts',
subhead:
subheading:
'Visualize your tags with multiple charts including a bar chart, pie chart, radar plot, and more.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Tag management',
subhead:
subheading:
'asily modify your tags during analysis with controls like edit, copy, move, and merge.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Search',
subhead:
subheading:
'Search the full text of research data and insights across all projects in your workspace.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Highlights',
subhead:
subheading:
'Select text and highlight paragraphs, sentences, or words to tag them.',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Charts',
subhead:
subheading:
'Visualize your tags with multiple charts including a bar chart, pie chart, radar plot, and more.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Filtering',
subhead:
subheading:
'asily modify your tags during analysis with controls like edit, copy, move, and merge.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Search',
subhead:
subheading:
'Search the full text of research data and insights across all projects in your workspace.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Bulk Edit',
subhead:
subheading:
'Select text and highlight paragraphs, sentences, or words to tag them.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Project',
subhead:
subheading:
'Visualize your tags with multiple charts including a bar chart, pie chart, radar plot, and more.',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Tag management',
subhead:
subheading:
'asily modify your tags during analysis with controls like edit, copy, move, and merge.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
{
heading: 'Search',
subhead:
subheading:
'Search the full text of research data and insights across all projects in your workspace.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},

+ 12
- 12
demos/src/pages/docs/featuresList.mdx View File

@ -18,7 +18,7 @@ The following example recreates the datoCMS landing page
-79%
</Heading>
),
subhead: 'In operational cost',
subheading: 'In operational cost',
},
{
heading: (
@ -26,7 +26,7 @@ The following example recreates the datoCMS landing page
2x
</Heading>
),
subhead: 'Faster time to market',
subheading: 'Faster time to market',
},
{
heading: (
@ -34,7 +34,7 @@ The following example recreates the datoCMS landing page
8x
</Heading>
),
subhead: 'Faster loading times',
subheading: 'Faster loading times',
},
]}
bg='gray.100'
@ -56,7 +56,7 @@ The following is the Qovery landing page recreated using just a bunch of compone
icon: (
<img src='https://images.prismic.io/prismic-website%2F4e288d2e-66cd-4209-9ada-fbfb6f1c19c1_api.svg?auto=compress,format' />
),
subhead:
subheading:
'Unlike a traditional CMS, an API-based approach is much simpler and more secure. This includes options for REST, GraphQL, and SDKs that help our users to make the most of Prismic.',
},
{
@ -64,7 +64,7 @@ The following is the Qovery landing page recreated using just a bunch of compone
icon: (
<img src='https://images.prismic.io/prismic-website%2F4080f213-f9e0-47f1-ae57-1d26874f1a08_setup.svg?auto=compress,format' />
),
subhead:
subheading:
"We offer a high-level SLAs, scalability, and a global CDN. We'll make sure that everything is running smoothly in the background so that you can focus on your projects.",
},
{
@ -72,7 +72,7 @@ The following is the Qovery landing page recreated using just a bunch of compone
icon: (
<img src='https://images.prismic.io/prismic-website%2F4268d459-cec4-4e46-856b-d2eaba8d71f8_ecosystem.svg?auto=compress,format' />
),
subhead:
subheading:
'Built by developers for developers - we actively engage with the community. Enjoy content that is created specifically for our community and join our Slack to discuss your Prismic projects.',
},
]}
@ -95,19 +95,19 @@ The following example uses a sky background image
features={[
{
heading: 'Make sense of data',
subhead:
subheading:
'Dovetail is a powerful way to discover patterns across interviews, usability testing, survey responses, and more',
icon: <img width='60px' src='/dovetail/feature1.svg' />,
},
{
heading: 'Build your taxonomy',
subhead:
subheading:
'Organize tags into a hierarchy with intuitive controls like drag & drop, and extend your project with global tags.',
icon: <img width='60px' src='/dovetail/feature2.svg' />,
},
{
heading: 'Visualize your research',
subhead:
subheading:
'Turn qualitative data into quantitative data with highlights, and visualize your work with a variety of beautiful charts.',
icon: <img width='60px' src='/dovetail/feature3.svg' />,
},
@ -129,19 +129,19 @@ The following example uses a sky background image
{
heading: 'Expand test coverage',
icon: <img src='/testim/step1.svg' />,
subhead:
subheading:
'Fast authoring increases coverage and quality across your application..',
},
{
heading: 'Reduce maintenance',
icon: <img src='/testim/step2.svg' />,
subhead:
subheading:
'AI-based stabilizers eliminate flaky tests that consume resources.',
},
{
heading: 'Increase test agility',
icon: <img src='/testim/step3.svg' />,
subhead:
subheading:
'Code, record and manage tests your way with your tools for greater flexibility.',
},
]}

+ 8
- 8
demos/src/pages/docs/hero.mdx View File

@ -2,7 +2,7 @@ export const breadcrumbs = ['Components', 'Hero']
# Hero
The hero component is the most important component of every landing page, it is usually composed of an `heading`, `subheading`, an `image` and a `cta`, but sometimes you can also find some text under the cta buttons, this is called `fingerprint`.
The hero component is the most important component of every landing page, it is usually composed of an `heading`, `subheadinging`, an `image` and a `cta`, but sometimes you can also find some text under the cta buttons, this is called `fingerprint`.
Sometimes there is also a small text above the heading, this is what we call a `bullet`, here you can find information about a new product or feature like "new: discount of 50% only today" or something similar.
@ -13,7 +13,7 @@ here is how you can use the Hero component
```js
<Hero
heading='Some heading'
subhead='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
subheading='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
image={<img />}
cta={<Button>Try it now for free!</Button>}
floatingElement={<GradientRect maxW='pageContainer' distortion={0.3} />}
@ -46,7 +46,7 @@ The following example recreates the datoCMS landing page
The best companies are built on unified content
</Heading>
}
subhead='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
subheading='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
image={null}
cta={<Button>Try it now for free!</Button>}
floatingElement={<GradientRect maxW='pageContainer' distortion={0.3} />}
@ -83,7 +83,7 @@ The following is the Qovery landing page recreated using just a bunch of compone
dark
bullet='SUPERPOWERS FOR DEVELOPER'
heading='Deploy complex application, seamlessly'
subhead='Just push your code, we handle the rest'
subheading='Just push your code, we handle the rest'
image={<img width='600px' src='/quovery/hero.png' />}
cta={<Button>DEPLOY MY APPLICATION</Button>}
fingerprint='Qovery combines the power of Kubernetes, the reliability of AWS and the simplicity of Heroku to augment the developer experience. Give a try now !'
@ -129,7 +129,7 @@ The following example uses a sky background image
dark
bullet='SUPERPOWERS FOR DEVELOPER'
heading='Workstream Collaboration & Omnichannel Customer Engagement'
subhead='Control your communication, manage your data and have your own collaboration platform to improve team productivity. Rocket.Chat is scalable and open source, replace email and improve your digital workflow.'
subheading='Control your communication, manage your data and have your own collaboration platform to improve team productivity. Rocket.Chat is scalable and open source, replace email and improve your digital workflow.'
image={<img width='600px' src='/rocketchat/hero.png' />}
cta={<Button>Start cloud trial</Button>}
/>
@ -174,7 +174,7 @@ The following example uses a cool gradient bg
<Hero
dark
heading='Develop. Combine. Promote.'
subhead='KintoHub is an all-in-one platform to combine and deploy your backend services, websites, cron jobs, databases and everything your app needs in one place.'
subheading='KintoHub is an all-in-one platform to combine and deploy your backend services, websites, cron jobs, databases and everything your app needs in one place.'
image={
<Box mb='-100px' mr='-200px'>
<Image
@ -220,7 +220,7 @@ The following example uses a cool gradient bg
/>
<Hero
heading={'Make analysis enjoyable'}
subhead='Discover patterns across a variety of qualitative research methods and unstructured data. Dovetail is analysis software you’ll love to use.'
subheading='Discover patterns across a variety of qualitative research methods and unstructured data. Dovetail is analysis software you’ll love to use.'
image={<img src='/dovetail/hero.png' />}
cta={<Button>Try free for 7 days</Button>}
/>
@ -246,7 +246,7 @@ The following example uses a cool gradient bg
/>
<Hero
heading='Smart spend management for modern businesses'
subhead='Spendesk combines powerful spend management software with corporate cards to help businesses take control of spending.'
subheading='Spendesk combines powerful spend management software with corporate cards to help businesses take control of spending.'
image={<img width='400px' src='/spendesk/hero.png' />}
cta={<Button>Book a demo</Button>}
floatingElement={<GradientCurtains mt='-600px' />}

+ 4
- 4
demos/src/pages/docs/howItWorks.mdx View File

@ -10,26 +10,26 @@ The following example recreates the datoCMS landing page
<LandingProvider primary='#FF593D'>
<HowItWorks
heading='How Prismic works'
subhead='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
subheading='A tool built to allow your content, design, and development teams to produce a finished product that they can all be proud of.'
steps={[
{
heading: 'Model your editor',
image: <img width='500px' src='/prismic/step1.jpg' />,
subhead:
subheading:
"Model custom types to match your desired design. Create reusable fields and custom components (we call them Slices...you'll hear us talk about them a lot) to enable dynamic layouts and build the editor experience that you want",
},
{
heading:
'Hand over to your content team to start creating content',
image: <img width='500px' src='/prismic/step2.jpg' />,
subhead:
subheading:
"Once you've managed the initial setup, you can hand the management over to your content team so that editors can start filling content while you're choosing the framework. With Prismic, creating beautiful content becomes simple enough that even non-technical employees can handle it. ",
},
{
heading:
'Deploy on Zeit Now, Netlify, Heroku or your favorite hosting platform',
image: <img width='500px' src='/prismic/step3.png' />,
subhead:
subheading:
'We take care of hosting and scaling the publishing tools. All you have to do is host the website, but you can choose whichever hosting platform you prefer.',
},
]}

+ 3
- 3
demos/src/pages/docs/pricing.mdx View File

@ -20,14 +20,14 @@ The following example recreates the datoCMS landing page
prices={[
{
heading: 'FREE',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: ['Unlimited', '1200', '2Gb', '2 Weeks'],
price: 'Free',
cta: <Link color='blue.600'>Get started</Link>,
},
{
heading: 'PLUS',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: ['Unlimited', '1200', '2Gb', '2 Weeks', 'x'],
price: '$10',
background: '#D1F0FD',
@ -35,7 +35,7 @@ The following example recreates the datoCMS landing page
},
{
heading: 'PRO',
subhead: 'Essential Features',
subheading: 'Essential Features',
features: ['Unlimited', '1200', '2Gb', '2 Weeks', 'x', 'x'],
price: '$20',
background: '#FFEAB6',

+ 1
- 1
demos/src/pages/docs/sectionTitle.mdx View File

@ -18,7 +18,7 @@ The following example recreates the datoCMS landing page
Are you losing money because of legacy content infrastructure?
</Heading>
}
subhead='HERE’S 3 SYMPTOMS TO WATCH OUT'
subheading='HERE’S 3 SYMPTOMS TO WATCH OUT'
image={null}
floatingElement={
<GradientRect maxW='pageContainer' width='60%' distortion={-0.3} />

+ 2
- 2
demos/src/pages/docs/testimonialsTweets.mdx View File

@ -9,7 +9,7 @@ An example of using the `TestimonialsTweets` component is this
```js
<TestimonialsTweets
heading="Don't you trust me?"
subhead='Trust them'
subheading='Trust them'
tweets={[
'933354946111705097',
'1246480107604078592', // you can use an id or an url
@ -26,7 +26,7 @@ In the view below the tweets are in a single column but on wider screen they wra
<LandingProvider>
<TestimonialsTweets
heading="Don't you trust me?"
subhead='Trust them'
subheading='Trust them'
tweets={[
'933354946111705097',
'1246480107604078592', // you can use an id or an url

+ 7
- 7
demos/src/pages/index.tsx View File

@ -123,7 +123,7 @@ const Page = () => (
dark
bullet='SUPERPOWERS FOR DEVELOPER'
heading='Landing pages building blocks'
subhead='Build your landing page in miunutes using composable react components'
subheading='Build your landing page in miunutes using composable react components'
image={<img width='900px' src='/heroIllustration.svg' />}
cta={
<NextLink href='#demos'>
@ -147,7 +147,7 @@ const Page = () => (
as={FiGrid}
/>
),
subhead:
subheading:
'Multi-level approvals and custom spending limits.',
},
{
@ -159,7 +159,7 @@ const Page = () => (
as={FiLayers}
/>
),
subhead:
subheading:
'Smart company cards, virtual cards, and invoice tracking.',
},
{
@ -171,7 +171,7 @@ const Page = () => (
as={FiGlobe}
/>
),
subhead:
subheading:
'Real-time spending overview and receipt capture.',
},
{
@ -183,7 +183,7 @@ const Page = () => (
as={FiImage}
/>
),
subhead: 'Simplified bookkeeping and budget analysis.',
subheading: 'Simplified bookkeeping and budget analysis.',
},
]}
/>
@ -192,7 +192,7 @@ const Page = () => (
<SectionTitle
id='components'
heading='Deploy your application with ease'
subhead='Deploying an application with Qovery is as simple as pushing code with git'
subheading='Deploying an application with Qovery is as simple as pushing code with git'
image={null}
/>
<LaindgCardsLinks alignSelf='center' py='40px' />
@ -202,7 +202,7 @@ const Page = () => (
dark
py='100px'
heading='Explore the demos'
subhead='Deploying an application with Qovery is as simple as pushing code with git'
subheading='Deploying an application with Qovery is as simple as pushing code with git'
image={null}
cta={<LandingButton>Download The Demos Code</LandingButton>}
/>

+ 2
- 2
demos/tests/testPrintJsx.tsx View File

@ -36,7 +36,7 @@ describe('reactElementToJSXString react-element-to-jsx-string', () => {
The best companies are built on unified content
</Heading>
}
subhead='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
subheading='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
image={null}
cta={<Button>Try it now for free!</Button>}
/>
@ -86,7 +86,7 @@ describe('reactElementToJSXString react-element-to-jsx-string', () => {
The best companies are built on unified content
</Heading>
}
subhead='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
subheading='More than 4.000 businesses use DatoCMS to create their online content at scale from a central hub, and distribute it easily via API to websites and any other digital experience.'
image={null}
cta={<Button>Try it now for free!</Button>}
/>

+ 2
- 2
react-landing/src/Banner.tsx View File

@ -7,7 +7,7 @@ import { removeUndefined } from './support'
export function Banner({
heading = '',
subhead = '',
subheading = '',
cta = '' as ReactNode,
image = null as any,
flip = false,
@ -53,7 +53,7 @@ export function Banner({
fontWeight='normal'
fontSize='18px'
>
{subhead}
{subheading}
</SubHeading>
</Stack>
<Stack w='auto' justify='center'>

+ 2
- 2
react-landing/src/Faqs.tsx View File

@ -15,7 +15,7 @@ import { useFaded } from './hooks'
export function Faqs({
heading = '',
subhead = '',
subheading = '',
faqs,
animate = true,
...rest
@ -34,7 +34,7 @@ export function Faqs({
{/* <Bullett>{bullett}</Bullett> */}
<Heading fontSize='32px'>{heading}</Heading>
<SubHeading fontSize='18px' maxW='700px'>
{subhead}
{subheading}
</SubHeading>
<Accordion allowToggle minWidth='100%'>
{faqs.map((x) => (

+ 2
- 2
react-landing/src/Feature.tsx View File

@ -7,7 +7,7 @@ import { useFaded } from './hooks'
export function Feature({
heading,
subhead,
subheading,
image = null as any,
flip = false,
animate = true,
@ -39,7 +39,7 @@ export function Feature({
fontWeight='normal'
fontSize='18px'
>
{subhead}
{subheading}
</Text>
</Stack>

+ 4
- 4
react-landing/src/FeaturesGrid.tsx View File

@ -15,7 +15,7 @@ import { useFaded } from './hooks'
export function FeaturesGrid({
heading = '',
subhead = '',
subheading = '',
features,
centerText = false,
animate = true,
@ -34,7 +34,7 @@ export function FeaturesGrid({
<Heading lineHeight='50px' fontWeight='medium' fontSize='36px'>
{heading}
</Heading>
<SubHeading>{subhead}</SubHeading>
<SubHeading>{subheading}</SubHeading>
</Stack>
<SimpleGrid
// minChildWidth='200px'
@ -57,7 +57,7 @@ export function FeaturesGrid({
)
}
const Feature = ({ heading, subhead, icon, centerText, ...rest }) => {
const Feature = ({ heading, subheading, icon, centerText, ...rest }) => {
return (
<Stack
textAlign={centerText ? 'center' : 'left'}
@ -73,7 +73,7 @@ const Feature = ({ heading, subhead, icon, centerText, ...rest }) => {
{heading}
</Heading>
<Text m={0} fontSize='16px' opacity={0.8} lineHeight='24px'>
{subhead}
{subheading}
</Text>
</Stack>
)

+ 5
- 5
react-landing/src/FeaturesList.tsx View File

@ -9,7 +9,7 @@ import { useFaded } from './hooks'
export function FeaturesList({
heading = '',
subhead = '',
subheading = '',
features,
centerText = false,
animate = true,
@ -18,7 +18,7 @@ export function FeaturesList({
const { Faded } = useFaded({ animate })
return (
<PageContainer {...rest}>
{heading && subhead && (
{heading && subheading && (
<Stack
as={Faded}
spacing='40px'
@ -33,7 +33,7 @@ export function FeaturesList({
>
{heading}
</Heading>
<SubHeading>{subhead}</SubHeading>
<SubHeading>{subheading}</SubHeading>
</Stack>
)}
<Stack
@ -57,7 +57,7 @@ export function FeaturesList({
)
}
const Feature = ({ heading, subhead, icon, centerText, ...rest }) => {
const Feature = ({ heading, subheading, icon, centerText, ...rest }) => {
return (
<Stack
@ -77,7 +77,7 @@ const Feature = ({ heading, subhead, icon, centerText, ...rest }) => {
</Col>
<Heading fontSize='20px'>{heading}</Heading>
<Text m={0} fontSize='18px' opacity={0.6} lineHeight='30px'>
{subhead}
{subheading}
</Text>
</Stack>
)

+ 2
- 2
react-landing/src/Hero.tsx View File

@ -13,7 +13,7 @@ import { Bullet } from './Bullet'
export function Hero({
heading,
subhead,
subheading,
cta,
image,
bullet = '',
@ -46,7 +46,7 @@ export function Hero({
<Heading fontSize='46px'>{heading}</Heading>
</Col>
<SubHeading fontSize='22px' maxW='700px'>
{subhead}
{subheading}
</SubHeading>
<Stack align={['center', 'center', 'flex-start']}>
<Box>{clone(cta)}</Box>

+ 4
- 4
react-landing/src/HowItWorks.tsx View File

@ -9,7 +9,7 @@ import { useFaded } from './hooks'
export function HowItWorks({
heading,
subhead,
subheading,
steps,
animate = true,
...rest
@ -35,7 +35,7 @@ export function HowItWorks({
fontSize='16px'
maxW='500px'
>
{subhead}
{subheading}
</Text>
</Stack>
<Box mt='60px' />
@ -56,7 +56,7 @@ export function HowItWorks({
const Step = ({
heading,
subhead,
subheading,
number,
image,
flip = false,
@ -100,7 +100,7 @@ const Step = ({
opacity={0.7}
fontSize='16px'
>
{subhead}
{subheading}
</Text>
</Box>
</Stack>

+ 6
- 6
react-landing/src/Pricing.tsx View File

@ -38,7 +38,7 @@ const pricingNamesMinH = '60px'
export interface PricingProps {
heading?: ReactNode
subhead?: ReactNode
subheading?: ReactNode
animate?: boolean
features: string[]
prices: PriceColumnType[]
@ -47,7 +47,7 @@ export interface PricingProps {
export interface PriceColumnType {
background?: string
heading?: ReactNode
subhead?: ReactNode
subheading?: ReactNode
cta?: ReactNode
features: ReactNode[]
price: string
@ -55,7 +55,7 @@ export interface PriceColumnType {
export function Pricing({
heading = 'Simple Pricing',
subhead = 'Real value for your work life',
subheading = 'Real value for your work life',
features = [],