From 5ae9790e75fadc92aaf81275891a01f37af5e577 Mon Sep 17 00:00:00 2001 From: Milana Cap Date: Fri, 22 May 2026 20:14:54 +0200 Subject: [PATCH] Modified header and footer to add project's links. Created a couple of pages: About, Get involved.. Modified color scheme, icons and text on home page. Signed-off-by: Milana Cap --- docs/docs/about/index.mdx | 7 +++ docs/docs/contributing/index.mdx | 7 +++ docs/docs/intro.mdx | 2 +- docs/docusaurus.config.js | 58 ++++++++++++------- docs/src/components/HomepageFeatures/index.js | 28 ++++----- .../HomepageFeatures/styles.module.css | 8 ++- docs/src/css/custom.css | 28 ++++----- docs/src/pages/about/index.md | 7 +++ docs/src/pages/index.js | 8 +-- docs/static/img/globe.svg | 1 + docs/static/img/key.svg | 1 + docs/static/img/networking.svg | 1 + docs/static/img/rest-api.svg | 1 + docs/static/img/shield.svg | 1 + docs/static/img/superhero.svg | 1 + 15 files changed, 103 insertions(+), 56 deletions(-) create mode 100644 docs/docs/about/index.mdx create mode 100644 docs/docs/contributing/index.mdx create mode 100644 docs/src/pages/about/index.md create mode 100644 docs/static/img/globe.svg create mode 100644 docs/static/img/key.svg create mode 100644 docs/static/img/networking.svg create mode 100644 docs/static/img/rest-api.svg create mode 100644 docs/static/img/shield.svg create mode 100644 docs/static/img/superhero.svg diff --git a/docs/docs/about/index.mdx b/docs/docs/about/index.mdx new file mode 100644 index 0000000..088d27d --- /dev/null +++ b/docs/docs/about/index.mdx @@ -0,0 +1,7 @@ +--- +sidebar_position: 10 +--- + +# About FAIR project + +This page is about the project and inside docs, so it has sidebar. \ No newline at end of file diff --git a/docs/docs/contributing/index.mdx b/docs/docs/contributing/index.mdx new file mode 100644 index 0000000..86e7f1c --- /dev/null +++ b/docs/docs/contributing/index.mdx @@ -0,0 +1,7 @@ +--- +sidebar_position: 100 +--- + +# Contributing to FAIR project + +This is the page about contributing to the project. diff --git a/docs/docs/intro.mdx b/docs/docs/intro.mdx index 88f9571..5083eda 100644 --- a/docs/docs/intro.mdx +++ b/docs/docs/intro.mdx @@ -1,5 +1,5 @@ --- -sidebar_position: 1 +sidebar_position: 50 --- # Tutorial Intro diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index 6a869b3..0852664 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -11,8 +11,8 @@ import {themes as prismThemes} from 'prism-react-renderer'; /** @type {import('@docusaurus/types').Config} */ const config = { title: 'FAIR Documentation', - tagline: 'Docs are way too cool!!', - favicon: 'img/favicon.ico', + tagline: 'Welcome to the FAIR Package Manager Project documentation.', + // favicon: 'img/favicon.ico', // Future flags, see https://docusaurus.io/docs/api/docusaurus-config#future future: { @@ -75,24 +75,38 @@ const config = { respectPrefersColorScheme: true, }, navbar: { - title: 'My Site', - logo: { - alt: 'My Site Logo', - src: 'img/logo.svg', - }, + title: 'FAIR Documentation', + // logo: { + // alt: 'My Site Logo', + // src: 'img/logo.svg', + // }, items: [ { type: 'docSidebar', sidebarId: 'tutorialSidebar', position: 'left', - label: 'Tutorial', + label: 'Docs', + }, + { + to: '/blog', + label: 'Blog', + position: 'left' + }, + { + to: 'docs/contributing', + label: 'Get involved', + position: 'left' }, - {to: '/blog', label: 'Blog', position: 'left'}, { href: 'https://github.com/fairpm/docs', label: 'GitHub', position: 'right', }, + { + href: 'https://fair.pm/', + label: 'fair.pm', + position: 'right', + }, ], }, footer: { @@ -102,8 +116,12 @@ const config = { title: 'Docs', items: [ { - label: 'Tutorial', - to: '/', + label: 'About this documentation', + to: 'about', + }, + { + label: 'Docs GitHub repo', + href: 'https://github.com/fairpm/docs', }, ], }, @@ -111,16 +129,16 @@ const config = { title: 'Community', items: [ { - label: 'Stack Overflow', - href: 'https://stackoverflow.com/questions/tagged/docusaurus', + label: 'Slack instance', + href: 'https://chat.fair.pm/', }, { - label: 'Discord', - href: 'https://discordapp.com/invite/docusaurus', + label: 'Join meetings', + href: 'https://zoom-lfx.platform.linuxfoundation.org/meetings/fair-package-manager?view=month', }, { - label: 'X', - href: 'https://x.com/docusaurus', + label: 'GitHub organisation', + href: 'https://github.com/fairpm', }, ], }, @@ -132,13 +150,13 @@ const config = { to: '/blog', }, { - label: 'GitHub', - href: 'https://github.com/fairpm/docs', + label: 'fair.pm', + href: 'https://fair.pm/', }, ], }, ], - copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`, + copyright: `Copyright © ${new Date().getFullYear()} FAIR. Built with Docusaurus.`, }, prism: { theme: prismThemes.github, diff --git a/docs/src/components/HomepageFeatures/index.js b/docs/src/components/HomepageFeatures/index.js index acc7621..de541e6 100644 --- a/docs/src/components/HomepageFeatures/index.js +++ b/docs/src/components/HomepageFeatures/index.js @@ -4,32 +4,32 @@ import styles from './styles.module.css'; const FeatureList = [ { - title: 'Easy to Use', - Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default, + title: 'FAIR', + Svg: require('@site/static/img/globe.svg').default, description: ( <> - Docusaurus was designed from the ground up to be easily installed and - used to get your website up and running quickly. +

FAIR is an acronym for Federated And Independent Repositories.

+

The FAIR Package Manager is an open-source initiative of The FAIR Web Foundation, a Linux Foundation project.

), }, { - title: 'Focus on What Matters', - Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default, + title: 'Technology', + Svg: require('@site/static/img/networking.svg').default, description: ( <> - Docusaurus lets you focus on your docs, and we'll do the chores. Go - ahead and move your docs into the docs directory. +

Decentralized alternative for distributing your project dependencies.

+

Everything is package if you're FAIR enough.

), }, { - title: 'Powered by React', - Svg: require('@site/static/img/undraw_docusaurus_react.svg').default, + title: 'Security, Privacy & GDPR', + Svg: require('@site/static/img/superhero.svg').default, description: ( <> - Extend or customize your website layout by reusing React. Docusaurus can - be extended while reusing the same header and footer. +

FAIR is designed to improve user privacy by reducing unnecessary tracking and central data collection.

+

Using signing and authentication, FAIR mitigates unapproved takeovers or nulling of your website dependencies, restoring trust in deliverables.

), }, @@ -41,9 +41,9 @@ function Feature({Svg, title, description}) {
-
+
{title} -

{description}

+
{description}
); diff --git a/docs/src/components/HomepageFeatures/styles.module.css b/docs/src/components/HomepageFeatures/styles.module.css index b248eb2..cf3de6c 100644 --- a/docs/src/components/HomepageFeatures/styles.module.css +++ b/docs/src/components/HomepageFeatures/styles.module.css @@ -1,11 +1,13 @@ .features { display: flex; align-items: center; - padding: 2rem 0; + padding: 4rem 0; width: 100%; } .featureSvg { - height: 200px; - width: 200px; + height: 120px; + width: 120px; + margin-bottom: 2rem; + position: relative; } diff --git a/docs/src/css/custom.css b/docs/src/css/custom.css index 2bc6a4c..7f8fc00 100644 --- a/docs/src/css/custom.css +++ b/docs/src/css/custom.css @@ -6,25 +6,25 @@ /* You can override the default Infima variables here. */ :root { - --ifm-color-primary: #2e8555; - --ifm-color-primary-dark: #29784c; - --ifm-color-primary-darker: #277148; - --ifm-color-primary-darkest: #205d3b; - --ifm-color-primary-light: #33925d; - --ifm-color-primary-lighter: #359962; - --ifm-color-primary-lightest: #3cad6e; + --ifm-color-primary: #234570; + --ifm-color-primary-dark: #203e65; + --ifm-color-primary-darker: #1e3b5f; + --ifm-color-primary-darkest: #18304e; + --ifm-color-primary-light: #274c7b; + --ifm-color-primary-lighter: #284f81; + --ifm-color-primary-lightest: #2e5a92; --ifm-code-font-size: 95%; --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1); } /* For readability concerns, you should choose a lighter palette in dark mode. */ [data-theme='dark'] { - --ifm-color-primary: #25c2a0; - --ifm-color-primary-dark: #21af90; - --ifm-color-primary-darker: #1fa588; - --ifm-color-primary-darkest: #1a8870; - --ifm-color-primary-light: #29d5b0; - --ifm-color-primary-lighter: #32d8b4; - --ifm-color-primary-lightest: #4fddbf; + --ifm-color-primary: #94c2ff; + --ifm-color-primary-dark: #6cabff; + --ifm-color-primary-darker: #58a0ff; + --ifm-color-primary-darkest: #1b7dff; + --ifm-color-primary-light: #498feb; + --ifm-color-primary-lighter: #5697ec; + --ifm-color-primary-lightest: #7caef0; --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3); } diff --git a/docs/src/pages/about/index.md b/docs/src/pages/about/index.md new file mode 100644 index 0000000..c537639 --- /dev/null +++ b/docs/src/pages/about/index.md @@ -0,0 +1,7 @@ +--- +title: About FAIR documentation +--- + +# About this documentation + +This page is about the documentation itself and standalone. \ No newline at end of file diff --git a/docs/src/pages/index.js b/docs/src/pages/index.js index a8c61f2..6da7cbb 100644 --- a/docs/src/pages/index.js +++ b/docs/src/pages/index.js @@ -16,13 +16,13 @@ function HomepageHeader() { {siteConfig.title}

{siteConfig.tagline}

-
+ {/*
Docusaurus Tutorial - 5min ⏱️ -
+
*/} ); @@ -32,8 +32,8 @@ export default function Home() { const {siteConfig} = useDocusaurusContext(); return ( + title={`Welcome to ${siteConfig.title}`} + description="Documentation for FAIR project.">
diff --git a/docs/static/img/globe.svg b/docs/static/img/globe.svg new file mode 100644 index 0000000..1c25662 --- /dev/null +++ b/docs/static/img/globe.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/key.svg b/docs/static/img/key.svg new file mode 100644 index 0000000..0a8ba2a --- /dev/null +++ b/docs/static/img/key.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/networking.svg b/docs/static/img/networking.svg new file mode 100644 index 0000000..f15adae --- /dev/null +++ b/docs/static/img/networking.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/rest-api.svg b/docs/static/img/rest-api.svg new file mode 100644 index 0000000..32251ce --- /dev/null +++ b/docs/static/img/rest-api.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/shield.svg b/docs/static/img/shield.svg new file mode 100644 index 0000000..da0cdd6 --- /dev/null +++ b/docs/static/img/shield.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/superhero.svg b/docs/static/img/superhero.svg new file mode 100644 index 0000000..3dfd294 --- /dev/null +++ b/docs/static/img/superhero.svg @@ -0,0 +1 @@ + \ No newline at end of file