From 5e8036efe8cfbc1f72a7f3fdeda1b58e03604571 Mon Sep 17 00:00:00 2001
From: Eric <eashaw@sailsjs.com>
Date: Mon, 4 Aug 2025 17:52:13 -0500
Subject: [PATCH] Website: update sidebar on article pages (#31594)

Closes: #30707
Closes: https://github.com/fleetdm/fleet/issues/30710

Changes:
- Updated the sidebar on article pages to hide docs links on smaller
screens (<990px width), and added a "Share" heading above the social
share links.
---
 website/assets/styles/pages/articles/basic-article.less | 3 +++
 website/views/pages/articles/basic-article.ejs          | 3 ++-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/website/assets/styles/pages/articles/basic-article.less b/website/assets/styles/pages/articles/basic-article.less
index c10ba98e00..c4b3f08a71 100644
--- a/website/assets/styles/pages/articles/basic-article.less
+++ b/website/assets/styles/pages/articles/basic-article.less
@@ -834,6 +834,9 @@
     [purpose='article-title'] {
       padding-top: 60px;
     }
+    [purpose='docs-links'] {
+      display: none;
+    }
     [purpose='article-content'] {
       padding-bottom: 0px;
     }
diff --git a/website/views/pages/articles/basic-article.ejs b/website/views/pages/articles/basic-article.ejs
index c951994580..34e6488f53 100644
--- a/website/views/pages/articles/basic-article.ejs
+++ b/website/views/pages/articles/basic-article.ejs
@@ -46,6 +46,7 @@
       <div purpose="sidebar-container">
         <div purpose="right-sidebar" class="d-flex flex-column">
           <div purpose="social-share-buttons" class="d-flex flex-column order-lg-2 order-1">
+            <p><strong>Share</strong></p>
             <div class="d-flex flex-row">
               <a :href="`https://news.ycombinator.com/submitlink?u=https://fleetdm.com${encodeURIComponent(thisPage.url)}&t=${encodeURIComponent(thisPage.meta.articleTitle)}`"><img src="/images/social-share-icon-hacker-news-20x20@2x.png" alt="Share this article on Hacker News"></a>
               <a :href="`https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent('https://fleetdm.com'+thisPage.url)}`"><img src="/images/social-share-icon-linkedin-20x20@2x.png" alt="Share this article on LinkedIn"></a>
@@ -53,7 +54,7 @@
             </div>
           </div>
 
-          <div purpose="subtopics" id="subtopics" class="d-flex nav flex-column order-lg-1 order-2">
+          <div purpose="subtopics" id="subtopics" class="d-flex nav flex-column order-lg-1 order-2" v-if="subtopics.length > 0">
             <p><strong>On this page</strong></p>
             <a purpose="sidebar-link" v-for="topic in subtopics" :href="topic.url" class="nav-link p-0">{{topic.title}}</a>
           </div>