docs: add older version links on our doc

SAP · Nov 29, 2023 · c1bc616 · c1bc616
1 parent a10dbcd
commit c1bc616
Show file tree

Hide file tree

Showing 5 changed files with 27 additions and 55 deletions.
diff --git a/packages/configuration/src/lib/previous-versions.ts b/packages/configuration/src/lib/previous-versions.ts
@@ -1,25 +1,7 @@
 export const previousVersions = [
-    {url: 'https://62321868e020b7000831b1da--fundamental-styles.netlify.app/', version: '0.23.0'},
-    {url: 'https://621e9a049d3b7e0007e126fc--fundamental-styles.netlify.app/', version: '0.22.0'},
-    {url: 'https://61fdb7b2e3ac3b0007ebc881--fundamental-styles.netlify.app/', version: '0.21.0'},
-    {url: 'https://614cc4d4c6af78000818ba73--fundamental-styles.netlify.app/', version: '0.20.0'},
-    {url: 'https://60f9800f4fb67b0008a97ea0--fundamental-styles.netlify.app/', version: '0.19.0'},
-    {url: 'https://609826151395f40007885f93--fundamental-styles.netlify.app/', version: '0.18.0'},
-    {url: 'https://607633b343132f0007464ae1--fundamental-styles.netlify.app/', version: '0.17.0'},
-    {url: 'https://602bf5d7dd16b900088c552b--fundamental-styles.netlify.app/', version: '0.16.0'},
-    {url: 'https://6008fb92ed3e9800075ccebf--fundamental-styles.netlify.app/', version: '0.15.0'},
-    {url: 'https://5fd8e4fa3ae9310007a50a95--fundamental-styles.netlify.app/', version: '0.14.0'},
-    {url: 'https://5faeed7b83c6e80007c04169--fundamental-styles.netlify.app/', version: '0.13.0'},
-    {url: 'https://5f6c89c9a7251000070cdb71--fundamental-styles.netlify.app/', version: '0.12.0'},
-    {url: 'https://5f11dbb81a6ddd0008f53092--fundamental-styles.netlify.app/', version: '0.11.0'},
-    {url: 'https://5ed2fffa23eade00070a6f6b--fundamental-styles.netlify.app/', version: '0.10.0'},
-    {url: 'https://5eb302782a840f0006441d86--fundamental-styles.netlify.app/', version: '0.9.0'},
-    {url: 'https://5e837ac25f756000062f5f62--fundamental-styles.netlify.app/', version: '0.8.0'},
-    {url: 'https://5e5c13d168cb4f000889e205--fundamental-styles.netlify.app/', version: '0.7.0'},
-    {url: 'https://5e4ac76ec546110007a7b412--fundamental-styles.netlify.app/', version: '0.6.0'},
-    {url: 'https://5e25d5e41fd5ab000c943a90--fundamental-styles.netlify.app/', version: '0.5.0'},
-    {url: 'https://5dfd5952d351450008f6dde6--fundamental-styles.netlify.app/', version: '0.4.0'},
-    {url: 'https://5da8f3cdba52e90007ac4ea0--fundamental-styles.netlify.app/', version: '0.3.0'},
-    {url: 'https://5d72a7bf51b2230008a46f1b--fundamental-styles.netlify.app/', version: '0.2.0'},
-    {url: 'https://5cf969ef3ca9be000d6bc0f3--fundamental-styles.netlify.app/', version: '0.1.0'},
+    {url: 'https://docs-0-28--fundamental-styles.netlify.app/', version: '0.28'},
+    {url: 'https://docs-0-29--fundamental-styles.netlify.app/', version: '0.29'},
+    {url: 'https://docs-0-30--fundamental-styles.netlify.app/', version: '0.30'},
+    {url: 'https://docs-0-31--fundamental-styles.netlify.app/', version: '0.31'},
+    {url: 'https://docs-0-32--fundamental-styles.netlify.app/', version: '0.32'},
 ]
diff --git a/packages/doc-ui/src/components/DocsPage/DocsPage.tsx b/packages/doc-ui/src/components/DocsPage/DocsPage.tsx
@@ -3,7 +3,6 @@ import {useContext} from 'react';
 import './DocsPage.scss';
 import {useThemedStoryContainers} from '../../hooks/useThemedStoryContainers';
 import Community from '../Community';
-import Versions from '../Versions';
 import Description from '../Description';
 import Footer from '../Footer';
 import Header from '../Header';
@@ -36,7 +35,6 @@ const DocsPage = () => {
 
             <Stories title={"Examples"}/>
             <Community/>
-            <Versions/>
             <Footer/>
         </>
     );

diff --git a/packages/doc-ui/src/components/DocsPage/custom.scss b/packages/doc-ui/src/components/DocsPage/custom.scss
@@ -106,7 +106,7 @@ $heading-toc-spacer: $docs-hd-tp + $docs-hd-bp + $docs-hd-ch + $docs-tm;
 /* header */
 .fddocs-header {
   box-sizing: border-box;
-  padding: $docs-hd-tp 0 $docs-hd-bp 0;
+  padding: 0;
   position: fixed;
   top: 0;
   left: 0;
@@ -191,21 +191,16 @@ $heading-toc-spacer: $docs-hd-tp + $docs-hd-bp + $docs-hd-ch + $docs-tm;
 }
 
 /* older versions links */
-.fddocs-versions {
+ul.fddocs-versions {
   display: flex;
-  flex-direction: row;
-
-  h4 {
-    font-weight: normal;
-    font-size: 16px;
-  }
+  margin: 6px 0 0 0;
+  list-style-type: none;
+  padding-left: 0;
+  flex-wrap: wrap;
+  gap: 20px;
 
-  ul {
-    list-style-type: none;
-    padding-left: 0;
-    display: flex;
-    flex-wrap: wrap;
-    gap: 20px;
+  li {
+    margin: 0;
   }
 }
 

diff --git a/packages/doc-ui/src/components/Header.tsx b/packages/doc-ui/src/components/Header.tsx
@@ -1,6 +1,7 @@
 import DirectionalitySelect from './DirectionalitySelect';
 import ThemeSelect from './ThemeSelect';
 import GithubLink from './GithubLink';
+import Versions from './Versions';
 import { IfBlock } from './IfBlock';
 import { useContext } from 'react';
 import { SAPContext } from '../contexts/SAPContext';
@@ -21,6 +22,7 @@ const Header = () => {
 
     return (
         <header className="fddocs-header">
+            <Versions/>
             <IfBlock condition={!isVisualStory}>
                 <HeaderSectionButton><DirectionalitySelect /></HeaderSectionButton>
                 <HeaderSectionButton><ContentDensitySelect /></HeaderSectionButton>

diff --git a/packages/doc-ui/src/components/Versions.tsx b/packages/doc-ui/src/components/Versions.tsx
@@ -2,22 +2,17 @@ import {previousVersions} from "fundamental-styles/configuration";
 
 const Versions = () => {
     return (
-        <div className='fddocs-versions'>
-            <section>
-                <h4>Previous Versions</h4>
-                <ul>
-                    {
-                        previousVersions.map(
-                            ({url, version}, index) => <li key={index}>
-                                <a href={url} target='_blank' rel="noreferrer">
-                                    <strong>{version}</strong>
-                                </a>
-                            </li>
-                        )
-                    }
-                </ul>
-            </section>
-        </div>
+        <ul className='fddocs-versions'>
+            {
+                previousVersions.map(
+                    ({url, version}, index) => <li key={index}>
+                        <a href={url} target='_blank' rel="noreferrer">
+                            <strong>{version}</strong>
+                        </a>
+                    </li>
+                )
+            }
+        </ul>
     )
 }