github
/
consul
mirror of https://github.com/hashicorp/consul
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Plug in proper content for when enterprise component

pull/7883/head
Brandon Romano 2020-05-06 17:50:26 -07:00
parent fff8331189
commit ab097190a7
5 changed files with 69 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
website/components/consul-enterprise-comparison/img/consul-enterprise.svg Normal file
View File

@ -0,0 +1,26 @@
<svg width="160" height="96" viewBox="0 0 160 96" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="90" cy="6" r="6" fill="#BDBEC2"/>
<circle cx="70" cy="6" r="6" fill="#CA2171"/>
<circle cx="70" cy="26" r="6" fill="#CA2171"/>
<circle cx="90" cy="26" r="6" fill="#CA2171"/>
<circle cx="154" cy="6" r="6" fill="#CA2171"/>
<circle cx="134" cy="6" r="6" fill="#CA2171"/>
<circle cx="134" cy="26" r="6" fill="#CA2171"/>
<circle cx="154" cy="26" r="6" fill="#CA2171"/>
<circle cx="90" cy="70" r="6" fill="#CA2171"/>
<circle cx="70" cy="70" r="6" fill="#CA2171"/>
<circle cx="70" cy="90" r="6" fill="#BDBEC2"/>
<circle cx="90" cy="90" r="6" fill="#BDBEC2"/>
<circle cx="154" cy="70" r="6" fill="#CA2171"/>
<circle cx="134" cy="70" r="6" fill="#CA2171"/>
<circle cx="134" cy="90" r="6" fill="#CA2171"/>
<circle cx="154" cy="90" r="6" fill="#BDBEC2"/>
<circle cx="26" cy="6" r="6" fill="#CA2171"/>
<circle cx="6" cy="6" r="6" fill="#CA2171"/>
<circle cx="6" cy="26" r="6" fill="#CA2171"/>
<circle cx="26" cy="26" r="6" fill="#BDBEC2"/>
<circle cx="26" cy="70" r="6" fill="#BDBEC2"/>
<circle cx="6" cy="70" r="6" fill="#BDBEC2"/>
<circle cx="6" cy="90" r="6" fill="#BDBEC2"/>
<circle cx="26" cy="90" r="6" fill="#BDBEC2"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

10
website/components/consul-enterprise-comparison/img/consul-oss.svg Normal file
View File

@ -0,0 +1,10 @@
<svg width="32" height="96" viewBox="0 0 32 96" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="26" cy="6" r="6" fill="#CA2171"/>
<circle cx="6" cy="6" r="6" fill="#CA2171"/>
<circle cx="6" cy="26" r="6" fill="#CA2171"/>
<circle cx="26" cy="26" r="6" fill="#BDBEC2"/>
<circle cx="26" cy="70" r="6" fill="#BDBEC2"/>
<circle cx="6" cy="70" r="6" fill="#BDBEC2"/>
<circle cx="6" cy="90" r="6" fill="#BDBEC2"/>
<circle cx="26" cy="90" r="6" fill="#BDBEC2"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 472 B

56
website/components/consul-enterprise-comparison/index.jsx
View File

@ -1,39 +1,33 @@
import EnterpriseComparison from '../enterprise-comparison'
const technicalComplexity = {
title: 'Technical Complexity',
label: 'Open Source',
imageUrl:
'https://www.datocms-assets.com/2885/1579883486-complexity-basic.png',
description:
'Consul open source enables individuals to discover services and securely manage connections between them across cloud, on-premise, and hybrid environments.',
link: {
text: 'View Open Source Features',
url: 'https://www.hashicorp.com/products/consul/pricing/',
type: 'outbound',
},
}
const organizationalComplexity = {
title: 'Organizational Complexity',
label: 'Enterprise',
imageUrl:
'https://www.datocms-assets.com/2885/1579883488-complexity-advanced.png',
description:
'Consul Enterprise provides the foundation for organizations to build and govern an enterprise-ready service networking environment for multiple teams across multiple clouds',
link: {
text: 'View Enterprise Features',
url: 'https://www.hashicorp.com/products/consul/pricing/',
type: 'outbound',
},
}
export default function NomadEnterpriseInfo() {
export default function ConsulEnterpriseComparison() {
return (
<EnterpriseComparison
title="When to consider Consul Enterprise"
itemOne={technicalComplexity}
itemTwo={organizationalComplexity}
itemOne={{
title: 'Technical Complexity',
label: 'Open Source',
imageUrl: require('./img/consul-oss.svg?url'),
description:
'Consul open source enables individuals to discover services and securely manage connections between them across cloud, on-premise, and hybrid environments.',
link: {
text: 'View Open Source Features',
url: 'https://www.hashicorp.com/products/consul/pricing/',
type: 'outbound',
},
}}
itemTwo={{
title: 'Organizational Complexity',
label: 'Enterprise',
imageUrl: require('./img/consul-enterprise.svg?url'),
description:
'Consul Enterprise provides the foundation for organizations to build an enterprise-ready service networking environment for multiple teams by enabling governance capabilities.',
link: {
text: 'View Enterprise Features',
url: 'https://www.hashicorp.com/products/consul/pricing/',
type: 'outbound',
},
}}
brand="consul"
/>
)

7
website/components/enterprise-comparison/index.jsx
View File

@ -3,7 +3,12 @@ import Button from '@hashicorp/react-button'
import InlineSvg from '@hashicorp/react-inline-svg'
import ArrowIcon from './img/arrow.svg?include'
export default function EnterpriseInfo({ title, itemOne, itemTwo, brand }) {
export default function EnterpriseComparison({
title,
itemOne,
itemTwo,
brand,
}) {
return (
<div className="g-enterprise-comparison">
<div className="g-grid-container">

4
website/pages/home/index.jsx
View File

@ -216,8 +216,6 @@ export default function HomePage() {
/>
</div>
<ConsulEnterpriseComparison />
<LearnCallout
headline="Learn the latest Consul skills"
brand="consul"
@ -241,6 +239,8 @@ export default function HomePage() {
]}
/>
<ConsulEnterpriseComparison />
<CallToAction
heading="Ready to get started?"
content="Consul open source addresses the technical complexity of managing production services by providing a way to discover, secure, automate and connect applications and networking configurations across distributed infrastructure and clouds."