From 488de66b66fae974428bf9e4a53fb9a138835b19 Mon Sep 17 00:00:00 2001
From: Brandon Romano <BrandonRRomano@gmail.com>
Date: Wed, 6 May 2020 21:05:10 -0700
Subject: [PATCH] Stub other use case pages

---
 website/pages/home/index.jsx                  |  4 +-
 .../use-cases/multi-platform-service-mesh.jsx | 59 +++++++++++++++++++
 .../service-discovery-and-health-checking.jsx | 59 +++++++++++++++++++
 3 files changed, 120 insertions(+), 2 deletions(-)
 create mode 100644 website/pages/use-cases/multi-platform-service-mesh.jsx
 create mode 100644 website/pages/use-cases/service-discovery-and-health-checking.jsx

diff --git a/website/pages/home/index.jsx b/website/pages/home/index.jsx
index 66e47990d6..97eb71162b 100644
--- a/website/pages/home/index.jsx
+++ b/website/pages/home/index.jsx
@@ -130,7 +130,7 @@ export default function HomePage() {
               },
             },
             {
-              title: 'Service Discovery & Health Checks',
+              title: 'Service Discovery and Health Checking',
               description:
                 'Enable services to locate other services running in any environment and provide real-time health status.',
               image: {
@@ -139,7 +139,7 @@ export default function HomePage() {
               },
               link: {
                 title: 'Learn more',
-                url: '/use-cases/service-discovery-and-health-checks',
+                url: '/use-cases/service-discovery-and-health-checking',
               },
             },
           ]}
diff --git a/website/pages/use-cases/multi-platform-service-mesh.jsx b/website/pages/use-cases/multi-platform-service-mesh.jsx
new file mode 100644
index 0000000000..2dec3ac7bc
--- /dev/null
+++ b/website/pages/use-cases/multi-platform-service-mesh.jsx
@@ -0,0 +1,59 @@
+import UseCaseLayout from '../../layouts/use-cases'
+import TextSplitWithImage from '@hashicorp/react-text-split-with-image'
+
+export default function MultiPlatformServiceMeshPage() {
+  return (
+    <UseCaseLayout
+      title="Multi-Platform Service Mesh"
+      description="Establish a service mesh between multiple runtime and cloud environments. Create a consistent platform for application networking and security with identity based authorization, L7 traffic management, and service-to-service encryption."
+    >
+      <div className="with-border">
+        <TextSplitWithImage
+          textSplit={{
+            heading: 'Multi-region, multi-cloud',
+            content:
+              'Consul’s flexible architecture allows it to be deployed in any environment, in any region, on any cloud.',
+            textSide: 'left',
+            links: [
+              {
+                text: 'Learn More',
+                url:
+                  'https://learn.hashicorp.com/consul?track=datacenter-deploy#datacenter-deploy',
+                type: 'outbound',
+              },
+            ],
+          }}
+          image={{
+            url:
+              'https://www.datocms-assets.com/2885/1588822376-multi-region.png',
+            alt: '',
+          }}
+        />
+      </div>
+
+      <div className="with-border">
+        <TextSplitWithImage
+          textSplit={{
+            heading: 'Multi-region, multi-cloud',
+            content:
+              'Consul’s flexible architecture allows it to be deployed in any environment, in any region, on any cloud.',
+            textSide: 'right',
+            links: [
+              {
+                text: 'Learn More',
+                url:
+                  'https://learn.hashicorp.com/consul?track=datacenter-deploy#datacenter-deploy',
+                type: 'outbound',
+              },
+            ],
+          }}
+          image={{
+            url:
+              'https://www.datocms-assets.com/2885/1588822376-multi-region.png',
+            alt: '',
+          }}
+        />
+      </div>
+    </UseCaseLayout>
+  )
+}
diff --git a/website/pages/use-cases/service-discovery-and-health-checking.jsx b/website/pages/use-cases/service-discovery-and-health-checking.jsx
new file mode 100644
index 0000000000..240251ab65
--- /dev/null
+++ b/website/pages/use-cases/service-discovery-and-health-checking.jsx
@@ -0,0 +1,59 @@
+import UseCaseLayout from '../../layouts/use-cases'
+import TextSplitWithImage from '@hashicorp/react-text-split-with-image'
+
+export default function ServiceDiscoveryAndHealthCheckingPage() {
+  return (
+    <UseCaseLayout
+      title="Service Discovery and Health Checking"
+      description="Service registry, integrated health checks, and DNS and HTTP interfaces enable any service to discover and be discovered by other services"
+    >
+      <div className="with-border">
+        <TextSplitWithImage
+          textSplit={{
+            heading: 'Multi-region, multi-cloud',
+            content:
+              'Consul’s flexible architecture allows it to be deployed in any environment, in any region, on any cloud.',
+            textSide: 'left',
+            links: [
+              {
+                text: 'Learn More',
+                url:
+                  'https://learn.hashicorp.com/consul?track=datacenter-deploy#datacenter-deploy',
+                type: 'outbound',
+              },
+            ],
+          }}
+          image={{
+            url:
+              'https://www.datocms-assets.com/2885/1588822376-multi-region.png',
+            alt: '',
+          }}
+        />
+      </div>
+
+      <div className="with-border">
+        <TextSplitWithImage
+          textSplit={{
+            heading: 'Multi-region, multi-cloud',
+            content:
+              'Consul’s flexible architecture allows it to be deployed in any environment, in any region, on any cloud.',
+            textSide: 'right',
+            links: [
+              {
+                text: 'Learn More',
+                url:
+                  'https://learn.hashicorp.com/consul?track=datacenter-deploy#datacenter-deploy',
+                type: 'outbound',
+              },
+            ],
+          }}
+          image={{
+            url:
+              'https://www.datocms-assets.com/2885/1588822376-multi-region.png',
+            alt: '',
+          }}
+        />
+      </div>
+    </UseCaseLayout>
+  )
+}