Add language about our services (#298)

* Add language about our services

* Address comments

* Title sizes

assets/scss/base/_typography.scss

@@ -86,11 +86,6 @@ body.dark {
     text-decoration-color: white;
   }
 
-  .container.logos, #who-logos {
-    background-color: white;
-    border-radius: .5rem;
-  }
-
   .btn {
     color: white;
   }

assets/scss/base/_utilities.scss

@@ -11,4 +11,17 @@
 // This lets you do alternating left/right layouts
 .reverse-markdown-row div.row {
   flex-direction: row-reverse;
+}
+
+/**
+ * Image utilities
+ */
+/* Desaturates the image completely */
+.greyscale {
+  filter: grayscale(100%);
+}
+
+/* In dark mode, invert the greyscale so that it shows up */
+body.dark .greyscale {
+  filter: grayscale(100%) invert(88.1%) hue-rotate(90deg);
 }

config/_default/menus.toml

@@ -4,7 +4,7 @@
 #   The weight parameter defines the order that the links will appear in.
 
 [[main]]
-  name = "Cloud platform"
+  name = "Hub platform"
   url = "platform/"
   weight = 10
 

content/_index.md

@@ -20,7 +20,7 @@ sections:
         #icon: download
       # Optionally, add an alternative CTA link
       cta_alt:
-        label: Join us
+        label: Join our network
         url: /join
       # Optionally, add a note under the Call-To-Action button
       # cta_note:
@@ -47,7 +47,9 @@ sections:
 
         {{< servicetech >}}
 
-        We serve **over 90 communities across the globe** with **over 7000 active users** that are dedicated to creating and sharing knowledge. See [our community impact stories](/communities) for inspiration.
+        2i2c's [community hub platform and consultancy services](/platform) ensure your community makes the best use of open infrastructure for interactive computing in the cloud.
+
+        We serve **over 90 communities across the globe** with **over 7000 active users** dedicated to creating and sharing knowledge. See [our community impact stories](/communities) for inspiration.
 
         <style>
           #who-logos {
@@ -59,13 +61,9 @@ sections:
           .list-inline-item {
             flex: 1
           }
-
-          .list-inline-item img {
-            filter: grayscale(100%); /* Desaturates the image completely */
-          }
         </style>
 
-        <ul id="who-logos" class="list-inline">
+        <ul id="who-logos" class="list-inline greyscale">
             <li class="list-inline-item"><a href="https://nasa.gov" target="_blank"><img src="/images/logos/community/nasa.svg" alt="Nasa logo"></a></li>
             <li class="list-inline-item"><a href="https://www.si.edu/" target="_blank"><img src="/images/logos/community/smithsonian.svg" alt="Smithsonian logo"></a></li>
             <li class="list-inline-item"><a href="https://www.hhmi.org/" target="_blank"><img src="/images/logos/community/howard-hughes-medical-institute.svg" alt="Howard Hughes Medical Institute logo"></a></li>
@@ -75,6 +73,7 @@ sections:
             <li class="list-inline-item"><a href="https://columbia.edu/" target="_blank"><img src="/images/logos/community/columbia-university.png" alt="Columbia University logo"></a></li>
         </ul>
 
+        {{< cta cta_text="Join our network of community hubs" cta_link="/join" cta_new_tab="false" >}}
 
   - block: markdown
     id: jupyterhub
@@ -204,24 +203,24 @@ sections:
           description: ""
 
   - block: markdown
-    id: learnmore
-    design:
-        columns: 2
+    id: learnplatform
     content:
-      title: Learn more about our organization.
+      title: Learn more about our platform.
       subtitle: 
       text: |
 
-        {{% about-hubs %}}
+        {{< cta cta_text="Learn about our interactive computing platform" cta_link="/platform" cta_new_tab="false" >}}
 
   - block: markdown
-    id: learnplatform
+    id: learnmore
+    design:
+        columns: 2
     content:
-      title: Learn more about our platform.
+      title: Learn more about our organization.
       subtitle: 
       text: |
 
-        {{< cta cta_text="Learn about our interactive computing platform" cta_link="/platform" cta_new_tab="false" >}}
+        {{% about-hubs %}}
 
 ---
 

content/platform/_index.md

@@ -1,18 +1,60 @@
 ---
 # Page title
-title: Cloud platform
+title: Hub service
 # Page type - we want a landing page (such as a homepage)
 type: landing
 aliases:
   - /hub-services/
+  - /service/
 
 sections:
 
   - block: markdown
     id: hub-services-intro
+    design:
+      css_class: "bigtitle"
     content:
       title: Your hub, the way you want it
-      subtitle: This page outlines our standard hub configuration options, which can be usually be **deployed in 1 day or less**. Should your community require a more customized approach, don't hesitate to [contact us](../join/_index.md) to discuss your specific requirements.
+      subtitle: Our cloud platform empowers communities to create their own digital hub to create and share knowledge with open infrastructure. Our services help you along the way.
+      text: |
+        <style>
+        /* This makes the titles on the page a bit bigger to differentiate section titles */
+        .bigtitle h1 {
+          font-size: 2.2em;
+        }
+        </style>
+
+        <div class="row row-cols-3">
+          <div class="card col">
+            <div class="card-body">
+              <h5 class="card-title">Management</h5>
+              <p class="card-text px-0">Our cloud infrastructure team deploys and manages your hub infrastructure so that you can focus on your work.</p>
+            </div>
+          </div>
+          <div class="card col">
+            <div class="card-body">
+              <h5 class="card-title">Development</h5>
+              <p class="card-text px-0">Our infrastructure team actively contributes to the open source community, ensuring our hubs, and your service, always benefit from the latest developments.</p>
+            </div>
+          </div>
+          <div class="card col">
+            <div class="card-body">
+              <h5 class="card-title">Guidance</h5>
+              <p class="card-text px-0">Our cloud workflows team helps community leaders and their users learn how to make the most of your hub for impact.</p>
+            </div>
+          </div>
+        </div>
+
+        {{< cta cta_text="Join our network of community hubs" cta_link="/join" cta_new_tab="false" >}}
+
+
+  - block: markdown
+    id: hub-service-intro
+    design:
+      css_class: "bigtitle"
+    content:
+      title: Standard hub features
+      subtitle: Below we outline our standard hub configuration options, which can be usually be **deployed in 1 day or less**. Should your community require a more customized approach, don't hesitate to [contact us](../join/_index.md) to discuss your specific requirements.
 
   - block: markdown
     content:

layouts/shortcodes/softwarestacklogos.html

@@ -1,5 +1,5 @@
-<div class="container logos">
-    <div class="row justify-content-center">
+<div class="container logos greyscale">
+    <div class="row justify-content-center align-items-center">
       <a href="https://pangeo-data.github.io/pangeo-stacks/images.html" class="col-3">
         <img class="logo" src="/images/logos/community/pangeo.svg" alt="Pangeo logo">
       </a>