Merge pull request #234 from ably/edx-343-meganav

[EDX-343]: Update Meganav with new pages
ably · Nov 16, 2022 · 475e448 · 475e448
2 parents 354fdf3 + d084fb0
commit 475e448
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 20 deletions.
diff --git a/preview/app/controllers/components_controller.rb b/preview/app/controllers/components_controller.rb
@@ -118,6 +118,7 @@ def icon
       icon-display-servers
       icon-display-shopping-cart
       icon-display-sla
+      icon-display-chat-col
       icon-display-soc2-type2
       icon-display-tech-account-comms
       icon-display-tutorials-demos-col

diff --git a/src/core/MeganavContentDevelopers/component.html.erb b/src/core/MeganavContentDevelopers/component.html.erb
@@ -16,11 +16,11 @@
           <% end %>
         </li>
         <li>
-          <%= link_to abs_url("/docs/key-concepts"), class: "ui-meganav-media-with-image group" do %>
-            <%= render(AblyUi::Core::Icon.new(name: "icon-display-lightbulb-col", size: "2.5rem")) %>
+          <%= link_to abs_url("/integrations"), class: "ui-meganav-media-with-image group" do %>
+            <%= render(AblyUi::Core::Icon.new(name: "icon-display-integrations-col", size: "2.5rem")) %>
             <div class="flex flex-col justify-center">
-              <p class="ui-meganav-media-heading">Concepts</p>
-              <p class="ui-meganav-media-copy">Read about core Ably platform concepts.</p>
+              <p class="ui-meganav-media-heading">Integrations</p>
+              <p class="ui-meganav-media-copy">Find out more about Ably integrations. </p>
             </div>
           <% end %>
         </li>
@@ -57,11 +57,11 @@
           <% end %>
         </li>
         <li>
-          <%= link_to abs_url("/integrations"), class: "ui-meganav-media-with-image group" do %>
-            <%= render(AblyUi::Core::Icon.new(name: "icon-display-integrations-col", size: "2.5rem")) %>
+          <%= link_to abs_url("/reference-guide-chat"), class: "ui-meganav-media-with-image group" do %>
+            <%= render(AblyUi::Core::Icon.new(name: "icon-display-chat-col", size: "2.5rem")) %>
             <div class="flex flex-col justify-center">
-              <p class="ui-meganav-media-heading">Integrations</p>
-              <p class="ui-meganav-media-copy">Find out more about Ably integrations. </p>
+              <p class="ui-meganav-media-heading">Chat apps reference guide</p>
+              <p class="ui-meganav-media-copy">Learn how to build chat apps with Ably.</p>
             </div>
           <% end %>
         </li>

diff --git a/src/core/MeganavContentDevelopers/component.jsx b/src/core/MeganavContentDevelopers/component.jsx
@@ -22,20 +22,20 @@ const MeganavContentDevelopers = ({ absUrl }) => (
             </a>
           </li>
           <li>
-            <a href={absUrl("/docs/key-concepts")} className="ui-meganav-media-with-image group">
-              <Icon name="icon-display-lightbulb-col" size="2.5rem" />
+            <a href={absUrl("/docs/quick-start-guide")} className="ui-meganav-media-with-image group">
+              <Icon name="icon-display-quickstart-guides-col" size="2.5rem" />
               <div className="flex flex-col justify-center">
-                <p className="ui-meganav-media-heading">Concepts</p>
-                <p className="ui-meganav-media-copy">Read about core Ably platform concepts.</p>
+                <p className="ui-meganav-media-heading">Quickstart guides</p>
+                <p className="ui-meganav-media-copy">Documentation to help you get started quickly.</p>
               </div>
             </a>
           </li>
           <li>
-            <a href={absUrl("/docs/quick-start-guide")} className="ui-meganav-media-with-image group">
-              <Icon name="icon-display-quickstart-guides-col" size="2.5rem" />
+            <a href={absUrl("/integrations")} className="ui-meganav-media-with-image group">
+              <Icon name="icon-display-integrations-col" size="2.5rem" />
               <div className="flex flex-col justify-center">
-                <p className="ui-meganav-media-heading">Quickstart guides</p>
-                <p className="ui-meganav-media-copy">Documentation to help you get started quickly.</p>
+                <p className="ui-meganav-media-heading">Integrations</p>
+                <p className="ui-meganav-media-copy">Find out more about Ably integrations. </p>
               </div>
             </a>
           </li>
@@ -63,11 +63,11 @@ const MeganavContentDevelopers = ({ absUrl }) => (
             </a>
           </li>
           <li>
-            <a href={absUrl("/integrations")} className="ui-meganav-media-with-image group">
-              <Icon name="icon-display-integrations-col" size="2.5rem" />
+            <a href={absUrl("/reference-guide-chat")} className="ui-meganav-media-with-image group">
+              <Icon name="icon-display-chat-col" size="2.5rem" />
               <div className="flex flex-col justify-center">
-                <p className="ui-meganav-media-heading">Integrations</p>
-                <p className="ui-meganav-media-copy">Find out more about Ably integrations. </p>
+                <p className="ui-meganav-media-heading">Chat apps reference guide</p>
+                <p className="ui-meganav-media-copy">Learn how to build chat apps with Ably.</p>
               </div>
             </a>
           </li>

diff --git a/src/core/icons/icon-display-chat-col.svg b/src/core/icons/icon-display-chat-col.svg