From daad1a1f1c91c753d2d656ac3c1970018f2af011 Mon Sep 17 00:00:00 2001 From: Eka Date: Fri, 12 Jan 2024 13:06:59 +0400 Subject: [PATCH] CORE-docs: update structure --- data/benefits.yml | 2 +- data/membership.yml | 54 ++--- data/openAccess.yml | 2 +- pages/documentation/data-providers-guide.jsx | 53 +++++ .../membership-documentation.jsx | 53 +++++ pages/documentations/index.jsx | 125 ----------- pages/documentations/styles.module.scss | 58 ----- .../data-providers-guide/index.jsx} | 34 ++- .../data-providers-guide/styles.module.scss | 203 ++++++++++++++++++ .../membership-documentation}/index.jsx | 37 +++- .../styles.module.scss | 203 ++++++++++++++++++ templates/documentations/styles.module.scss | 120 ----------- 12 files changed, 606 insertions(+), 338 deletions(-) create mode 100644 pages/documentation/data-providers-guide.jsx create mode 100644 pages/documentation/membership-documentation.jsx delete mode 100644 pages/documentations/index.jsx delete mode 100644 pages/documentations/styles.module.scss rename templates/{documentations/dataProviderDocs.jsx => documentation/data-providers-guide/index.jsx} (61%) create mode 100644 templates/documentation/data-providers-guide/styles.module.scss rename templates/{documentations => documentation/membership-documentation}/index.jsx (59%) create mode 100644 templates/documentation/membership-documentation/styles.module.scss delete mode 100644 templates/documentations/styles.module.scss diff --git a/data/benefits.yml b/data/benefits.yml index e0bce6049..19e0670f2 100644 --- a/data/benefits.yml +++ b/data/benefits.yml @@ -182,7 +182,7 @@ HowTo: picture: /images/benefits/join-arrow.svg action: title: Data provider’s guide - url: /documentations + url: /data-providers-guide join: title: Join CORE as a data provider and contribute to the creation of a mutually beneficial ecosystem. diff --git a/data/membership.yml b/data/membership.yml index 5e22119d0..4315b4609 100644 --- a/data/membership.yml +++ b/data/membership.yml @@ -27,7 +27,7 @@ content: id: 1 title: CORE Repository Dashboard descriptionCardCard: | - [Monitor, manage and access](~services/repository-dashboard) statistics about how your metadata are exposed across the open access research network. [read more](~documentations#dashboard) + [Monitor, manage and access](~services/repository-dashboard) statistics about how your metadata are exposed across the open access research network. [read more](~membership-documentation#dashboard) descriptionCardTable: | Monitor, manage and access statistics about how your metadata are exposed across the open access research network. plans: [Starting, Supporting, Sustaining] @@ -35,7 +35,7 @@ content: id: 2 title: CORE Discovery descriptionCardCard: | - Benefit from our [plugin](~services/discovery) which turns metadata only pages in repositories to pages with full text links, whenever an open access version of the document is available anywhere across the open research network. [read more](~documentations#discovery) + Benefit from our [plugin](~services/discovery) which turns metadata only pages in repositories to pages with full text links, whenever an open access version of the document is available anywhere across the open research network. [read more](~membership-documentation#discovery) descriptionCardTable: | Benefit from our plugin which turns metadata only pages in repositories to pages with full text links, whenever an open access version of the document is available anywhere across the open research network. plans: [Starting, Supporting, Sustaining] @@ -43,7 +43,7 @@ content: id: 3 title: CORE Search descriptionCardCard: | - Your organisation's research visible and discoverable by over 30 million monthly active users who rely on CORE. [read more](~documentations#search) + Your organisation's research visible and discoverable by over 30 million monthly active users who rely on CORE. [read more](~membership-documentation#search) descriptionCardTable: | Your organisation's research visible and discoverable by over 30 million monthly active users who rely on CORE. plans: [Starting, Supporting, Sustaining] @@ -51,7 +51,7 @@ content: id: 4 title: CORE Recommender descriptionCardCard: | - Install our [recommender plugin](~services/recommender) to help your users find related content within your own repository and from across the global open research network. [read more](~documentations#recommender) + Install our [recommender plugin](~services/recommender) to help your users find related content within your own repository and from across the global open research network. [read more](~membership-documentation#recommender) descriptionCardTable: | Install our recommender plugin to help your users find related content within your own repository and from across the global open research network. plans: [Starting, Supporting, Sustaining] @@ -59,7 +59,7 @@ content: id: 5 title: General support descriptionCardCard: | - Our enthusiastic open access team ready to answer general queries about CORE. [read more](~documentations#general-support) + Our enthusiastic open access team ready to answer general queries about CORE. [read more](~membership-documentation#general-support) descriptionCardTable: | Our enthusiastic open access team ready to answer general queries about CORE. plans: [Starting, Supporting, Sustaining] @@ -67,7 +67,7 @@ content: id: 6 title: Download statistics descriptionCardCard: | - Access statistics about how many times papers from your organisation were downloaded (from CORE and directly from your repository - IRUS tracker integration required for the latter). [read more](~documentations#download-statistics) + Access statistics about how many times papers from your organisation were downloaded (from CORE and directly from your repository - IRUS tracker integration required for the latter). [read more](~membership-documentation#download-statistics) descriptionCardTable: | Access statistics about how many times papers from your organisation were downloaded (from CORE and directly from your repository - IRUS tracker integration required for the latter). plans: [Starting, Supporting, Sustaining] @@ -81,7 +81,7 @@ content: – Recommended across the repositories network descriptionCardCard: |- - – Increases the discoverability of your content. Open access full texts from your repository promoted to PubMed Central via their Link Out service. [read more](~documentations#repository-discovery-boost) + – Increases the discoverability of your content. Open access full texts from your repository promoted to PubMed Central via their Link Out service. [read more](~membership-documentation#repository-discovery-boost) descriptionCardTable: |- – Increases the discoverability of your content. Open access full texts from your repository promoted to PubMed Central via their Link Out service. plans: [Starting, Supporting, Sustaining] @@ -89,7 +89,7 @@ content: title: Get your OAI identifiers resolved to your repository id: 8 descriptionCardCard: | - Make [OAI identifiers](https://oai.core.ac.uk) originating from your repository resolve directly to your repository in the OAI Resolver. [read more](~documentations#OAI-identifiers) + Make [OAI identifiers](https://oai.core.ac.uk) originating from your repository resolve directly to your repository in the OAI Resolver. [read more](~membership-documentation#OAI-identifiers) descriptionCardTable: | Make OAI identifiers originating from your repository resolve directly to your repository in the OAI Resolver. plans: [ Starting, Supporting, Sustaining ] @@ -97,7 +97,7 @@ content: id: 9 title: Logos for your papers descriptionCardCard: | - Associate your research papers in CORE with your official organisational logo. This will be visible in CORE Search, CORE Recommender, CORE Discovery and from across the CORE Portal. Your logo can be uploaded from the CORE Repository Dashboard. [read more](~documentations#logos-papers) + Associate your research papers in CORE with your official organisational logo. This will be visible in CORE Search, CORE Recommender, CORE Discovery and from across the CORE Portal. Your logo can be uploaded from the CORE Repository Dashboard. [read more](~membership-documentation#logos-papers) descriptionCardTable: | Associate your research papers in CORE with your official organisational logo. This will be visible in CORE Search, CORE Recommender, CORE Discovery and from across the CORE Portal. Your logo can be uploaded from the CORE Repository Dashboard. plans: [Supporting, Sustaining] @@ -105,7 +105,7 @@ content: id: 10 title: Logo banner descriptionCardCard: | - We highly value the generous support of our Supporting and Sustaining members. We proudly display banners acknowledging your sponsorship and support to the open access and open science mission. [read more](~documentations#logo-banner) + We highly value the generous support of our Supporting and Sustaining members. We proudly display banners acknowledging your sponsorship and support to the open access and open science mission. [read more](~membership-documentation#logo-banner) descriptionCardTable: | We highly value the generous support of our Supporting and Sustaining members. We proudly display banners acknowledging your sponsorship and support to the open access and open science mission. plans: [Supporting, Sustaining] @@ -113,7 +113,7 @@ content: id: 11 title: Personalised banner descriptionCardCard: | - Promote your research conferences, events, academic jobs and other mission-aligned communications on the CORE website. [read more](~documentations#personalised-banner) + Promote your research conferences, events, academic jobs and other mission-aligned communications on the CORE website. [read more](~membership-documentation#personalised-banner) descriptionCardTable: | Promote your research conferences, events, academic jobs and other mission-aligned communications on the CORE website. plans: [Sustaining] @@ -121,7 +121,7 @@ content: id: 12 title: Board of Supporters (1 vote) descriptionCardCard: | - Help shape our development roadmap by having a say on our [Board of Supporters](~governance/supporters). [read more](~documentations#board-supporters) + Help shape our development roadmap by having a say on our [Board of Supporters](~governance/supporters). [read more](~membership-documentation#board-supporters) descriptionCardTable: | Help shape our development roadmap by having a say on our Board of Supporters. plans: [Supporting, Sustaining] @@ -129,7 +129,7 @@ content: id: 13 title: Board of Supporters (2 votes) descriptionCardCard: | - Help shape our development roadmap by having a say on our Board of Supporters. [read more](~documentations#board-supporters) + Help shape our development roadmap by having a say on our Board of Supporters. [read more](~membership-documentation#board-supporters) descriptionCardTable: | Help shape our development roadmap by having a say on our Board of Supporters. plans: [Supporting, Sustaining] @@ -137,7 +137,7 @@ content: id: 14 title: Board of Supporters descriptionCardCard: | - Help shape our development roadmap by having a say on our [Board of Supporters](~governance/supporters). [read more](~documentations#board-supporters) + Help shape our development roadmap by having a say on our [Board of Supporters](~governance/supporters). [read more](~membership-documentation#board-supporters) descriptionCardTable: | Help shape our development roadmap by having a say on our Board of Supporters. plans: [Supporting, Sustaining] @@ -150,7 +150,7 @@ content: id: 15 title: Technical support (≤5) descriptionCardCard: | - Guaranteed technical support of up to 5 technical queries per year. [read more](~documentations#technical-support) + Guaranteed technical support of up to 5 technical queries per year. [read more](~membership-documentation#technical-support) descriptionCardTable: | Guaranteed technical support of up to 5 technical queries per year. plans: [Supporting, Sustaining] @@ -158,7 +158,7 @@ content: id: 16 title: Unlimited and prioritised support descriptionCardCard: | - Get unlimited technical support and your questions prioritised on top to get your answers sooner. [read more](~documentations#unlimited-support) + Get unlimited technical support and your questions prioritised on top to get your answers sooner. [read more](~membership-documentation#unlimited-support) descriptionCardTable: | Get unlimited technical support and your questions prioritised on top to get your answers sooner. plans: [Sustaining] @@ -166,7 +166,7 @@ content: id: 17 title: CORE OA Compliance dashboard descriptionCardCard: | - Tools for Open Access compliance monitoring and metadata enrichments. [read more](/documentations#compliance-dashboard) + Tools for Open Access compliance monitoring and metadata enrichments. [read more](/membership-documentation#compliance-dashboard) descriptionCardTable: | Tools for Open Access compliance monitoring and metadata enrichments. plans: [Sustaining] @@ -174,7 +174,7 @@ content: id: 18 title: АPI use for your university descriptionCardCard: | - Use of the [CORE API](~services/api) for your organisation, including for non-research purposes (except for commercial purposes), subject to our T&Cs. [read more](~documentations#АPI-organisation) + Use of the [CORE API](~services/api) for your organisation, including for non-research purposes (except for commercial purposes), subject to our T&Cs. [read more](~membership-documentation#АPI-organisation) descriptionCardTable: | Use of the CORE API for your organisation, including for non-research purposes (except for commercial purposes), subject to our T&Cs. plans: [Supporting, Sustaining] @@ -182,7 +182,7 @@ content: id: 19 title: Dataset use for your university descriptionCardCard: | - Use of the [CORE Dataset](~services/dataset) for your organisation, including for non-research purposes (except for commercial purposes), subject to our T&Cs. [read more](~documentations#dataset-university) + Use of the [CORE Dataset](~services/dataset) for your organisation, including for non-research purposes (except for commercial purposes), subject to our T&Cs. [read more](~membership-documentation#dataset-university) descriptionCardTable: | Use of the CORE Dataset for your organisation, including for non-research purposes (except for commercial purposes), subject to our T&Cs. plans: [Sustaining] @@ -190,7 +190,7 @@ content: id: 20 title: Repository health check descriptionCardCard: | - Possibility of a data-driven metadata quality assessment consultation for your institution. We assess current level of metadata quality (including in relation to FAIRness) and provide guidance on how to improve it. (1 consultation per year included). [read more](~documentations#repository-health-check) + Possibility of a data-driven metadata quality assessment consultation for your institution. We assess current level of metadata quality (including in relation to FAIRness) and provide guidance on how to improve it. (1 consultation per year included). [read more](~membership-documentation#repository-health-check) descriptionCardTable: | Possibility of a data-driven metadata quality assessment consultation for your institution. We assess current level of metadata quality (including in relation to FAIRness) and provide guidance on how to improve it. (1 consultation per year included). plans: [Sustaining] @@ -198,7 +198,7 @@ content: id: 21 title: Promoted / spotlight / featured articles descriptionCardCard: | - When research papers from your organisation would appear on pages 2-4 of CORE Search results, your paper gets promoted to the front of the first page and is highlighted as a featured article. [read more](~documentations#promoted-articles) + When research papers from your organisation would appear on pages 2-4 of CORE Search results, your paper gets promoted to the front of the first page and is highlighted as a featured article. [read more](~membership-documentation#promoted-articles) descriptionCardTable: | When research papers from your organisation would appear on pages 2-4 of CORE Search results, your paper gets promoted to the front of the first page and is highlighted as a featured article. plans: [Sustaining] @@ -206,7 +206,7 @@ content: id: 22 title: Hosted or interview style blog post on mission-aligned activities descriptionCardCard: | - We are keen to provide a hosted or interview style blog post about open access, open science and other relevant mission-oriented activities your organisation is conducting on the CORE blog. (T&Cs apply) [read more](~documentations#hosted-activities) + We are keen to provide a hosted or interview style blog post about open access, open science and other relevant mission-oriented activities your organisation is conducting on the CORE blog. (T&Cs apply) [read more](~membership-documentation#hosted-activities) descriptionCardTable: | We are keen to provide a hosted or interview style blog post about open access, open science and other relevant mission-oriented activities your organisation is conducting on the CORE blog. (T&Cs apply) plans: [Sustaining] @@ -214,7 +214,7 @@ content: id: 23 title: RIOXX metadata validator descriptionCardCard: | - Aligning with established metadata practices is key for the interoperability of your repository with external systems and for meeting FAIR principles. Funders increasingly mandate the use of established metadata profiles. The RIOXX metadata validator is a tool that helps you validate compliance of individual metadata records with RIOXX, a widely used metadata standard for repositories. [read more](~documentations#rioxx-validator) + Aligning with established metadata practices is key for the interoperability of your repository with external systems and for meeting FAIR principles. Funders increasingly mandate the use of established metadata profiles. The RIOXX metadata validator is a tool that helps you validate compliance of individual metadata records with RIOXX, a widely used metadata standard for repositories. [read more](~membership-documentation#rioxx-validator) descriptionCardTable: | Aligning with established metadata practices is key for the interoperability of your repository with external systems and for meeting FAIR principles. Funders increasingly mandate the use of established metadata profiles. The RIOXX metadata validator is a tool that helps you validate compliance of individual metadata records with RIOXX , a widely used metadata standard for repositories. plans: [Starting, Supporting, Sustaining] @@ -222,7 +222,7 @@ content: id: 24 title: Versions and duplicates detection descriptionCardCard: | - Our technology searches your repository to identify different versions of your articles and potential duplicates within your repository. This can help you in managing and curating your repository content. We periodically detect near-duplicate records and versions and allow you to compare them side by side. This can help you improve your repository metadata and keep the repository clean. [read more](~documentations#versions-duplicates) + Our technology searches your repository to identify different versions of your articles and potential duplicates within your repository. This can help you in managing and curating your repository content. We periodically detect near-duplicate records and versions and allow you to compare them side by side. This can help you improve your repository metadata and keep the repository clean. [read more](~membership-documentation#versions-duplicates) descriptionCardTable: | Our technology searches your repository to identify different versions of your articles and potential duplicates within your repository. This can help you in managing and curating your repository content. We periodically detect near-duplicate records and versions and allow you to compare them side by side. This can help you improve your repository metadata and keep the repository clean. plans: [Supporting, Sustaining] @@ -230,7 +230,7 @@ content: id: 25 title: Monitor RIOXX compliance descriptionCardCard: | - Aligning with established metadata practices is key for the interoperability of your repository with external systems and for meeting FAIR principles. Funders increasingly mandate the use of established metadata profiles. The Monitor RIOXX Compliance feature constantly monitors metadata records in your repository, helping you to keep your repository FAIR. [read more](~documentations#rioxx-compliance) + Aligning with established metadata practices is key for the interoperability of your repository with external systems and for meeting FAIR principles. Funders increasingly mandate the use of established metadata profiles. The Monitor RIOXX Compliance feature constantly monitors metadata records in your repository, helping you to keep your repository FAIR. [read more](~membership-documentation#rioxx-compliance) descriptionCardTable: | Aligning with established metadata practices is key for the interoperability of your repository with external systems and for meeting FAIR principles. Funders increasingly mandate the use of established metadata profiles. The Monitor RIOXX Compliance feature constantly monitors metadata records in your repository, helping you to keep your repository FAIR. plans: [Supporting, Sustaining] @@ -246,7 +246,7 @@ plans: content: Organisations who want to be widely recognised for their open research. In addition to all the STARTING benefits, this membership also comes with extra visibility for your organisation in the OA network, additional technical support, [CORE API](~services/api) access for your researchers, and a seat on our [Board of Supporters](~governance/supporters). - title: | SUSTAINING for: - content: Organisations who want to be seen as open research champions. In addition to all the SUPPORTING benefits, this membership comes with additional tools to help stay compliant with [OA policies](/documentations/?r=compliance-dashboard) and FAIR, unlimited technical support, [CORE Dataset](https://core.ac.uk/services/dataset) access for your researchers for text and data mining, and two seats on our Board of Supporters + content: Organisations who want to be seen as open research champions. In addition to all the SUPPORTING benefits, this membership comes with additional tools to help stay compliant with [OA policies](/membership-documentation/?r=compliance-dashboard) and FAIR, unlimited technical support, [CORE Dataset](https://core.ac.uk/services/dataset) access for your researchers for text and data mining, and two seats on our Board of Supporters cards: - title: Starting caption: Free @@ -345,7 +345,7 @@ how-it-works: active: Comparison table - action: caption: Access documentation - url: /documentations + url: /membership-documentation comparison-table: title: Features’ details and comparison diff --git a/data/openAccess.yml b/data/openAccess.yml index 2e83463e9..4b6521f79 100644 --- a/data/openAccess.yml +++ b/data/openAccess.yml @@ -10,4 +10,4 @@ services: description: The guide aims to assist institutions and repository managers in configuring their repositories in way that enables CORE to correctly index them. action: - title: Find out more - url: documentations + url: data-providers-guide diff --git a/pages/documentation/data-providers-guide.jsx b/pages/documentation/data-providers-guide.jsx new file mode 100644 index 000000000..8bd9f1172 --- /dev/null +++ b/pages/documentation/data-providers-guide.jsx @@ -0,0 +1,53 @@ +import React from 'react' + +import { Page } from '../../components' +import DataProviderDocs from '../../templates/documentation/data-providers-guide' + +import retrieveContent from 'content' + +const ASSETS_BASE_URL = 'https://oacore.github.io/content/' + +const setAssetsUrl = (object) => + Object.entries(object).forEach(([, value]) => { + delete value.membership + if (value.images) { + Object.entries(value.images).forEach(([, item]) => { + item.file = ASSETS_BASE_URL + item.file + }) + } + }) + +const getProviderSections = async ({ ref } = {}) => { + const content = await retrieveContent('docs-dataProvider', { + ref, + transform: 'object', + }) + + Object.values(content).forEach((section) => { + if (section.items) setAssetsUrl(section.items) + }) + return content +} + +export async function getStaticProps({ previewData }) { + const ref = previewData?.ref + const sectionProvider = await getProviderSections({ ref }) + + const dataProvider = { + ...sectionProvider, + } + + return { + props: { + dataProvider, + }, + } +} + +const DocumentationPage = ({ dataProvider }) => ( + + + +) + +export default DocumentationPage diff --git a/pages/documentation/membership-documentation.jsx b/pages/documentation/membership-documentation.jsx new file mode 100644 index 000000000..a97d4f566 --- /dev/null +++ b/pages/documentation/membership-documentation.jsx @@ -0,0 +1,53 @@ +import React from 'react' + +import { Page } from '../../components' +import DocumentationPageTemplate from '../../templates/documentation/membership-documentation' + +import retrieveContent from 'content' + +const ASSETS_BASE_URL = 'https://oacore.github.io/content/' + +const setAssetsUrl = (object) => + Object.entries(object).forEach(([, value]) => { + delete value.membership + if (value.images) { + Object.entries(value.images).forEach(([, item]) => { + item.file = ASSETS_BASE_URL + item.file + }) + } + }) + +const getSections = async ({ ref } = {}) => { + const content = await retrieveContent('docs-membership', { + ref, + transform: 'object', + }) + + delete content.headerDashboard + Object.values(content).forEach((section) => { + if (section.items) setAssetsUrl(section.items) + }) + return content +} + +export async function getStaticProps({ previewData }) { + const ref = previewData?.ref + const sections = await getSections({ ref }) + const data = { + ...sections, + } + + return { + props: { + data, + }, + } +} + +const DocumentationPage = ({ data }) => ( + + + +) + +export default DocumentationPage diff --git a/pages/documentations/index.jsx b/pages/documentations/index.jsx deleted file mode 100644 index 3069aea35..000000000 --- a/pages/documentations/index.jsx +++ /dev/null @@ -1,125 +0,0 @@ -import React, { useState } from 'react' -import { Button } from '@oacore/design/lib/elements' -import { classNames } from '@oacore/design/lib/utils' - -import styles from './styles.module.scss' -import DocumentationPageTemplate from '../../templates/documentations' -import { Page } from '../../components' -import DataProviderDocs from '../../templates/documentations/dataProviderDocs' - -import text from 'data/membership.yml' -import retrieveContent from 'content' - -const ASSETS_BASE_URL = 'https://oacore.github.io/content/' - -const setAssetsUrl = (object) => - Object.entries(object).forEach(([, value]) => { - delete value.membership - if (value.images) { - Object.entries(value.images).forEach(([, item]) => { - item.file = ASSETS_BASE_URL + item.file - }) - } - }) - -const getSections = async ({ ref } = {}) => { - const content = await retrieveContent('docs-membership', { - ref, - transform: 'object', - }) - - delete content.headerDashboard - Object.values(content).forEach((section) => { - if (section.items) setAssetsUrl(section.items) - }) - return content -} - -const getProviderSections = async ({ ref } = {}) => { - const content = await retrieveContent('docs-dataProvider', { - ref, - transform: 'object', - }) - - Object.values(content).forEach((section) => { - if (section.items) setAssetsUrl(section.items) - }) - return content -} - -export async function getStaticProps({ previewData }) { - const ref = previewData?.ref - const sections = await getSections({ ref }) - const sectionProvider = await getProviderSections({ ref }) - const data = { - ...sections, - } - const dataProvider = { - ...sectionProvider, - } - - return { - props: { - data, - dataProvider, - }, - } -} - -const TABS = { - dataProvider: 'dataProvider', - membership: 'membership', -} - -const DocumentationPage = ({ data, dataProvider }) => { - const [activeTab, setActiveTab] = useState(TABS.dataProvider) - - const handleTabChange = (tab) => { - setActiveTab(tab) - } - - return ( - -
-
- - -
-
- {activeTab === TABS.dataProvider && ( - - )} - {activeTab === TABS.membership && } - - ) -} - -export default DocumentationPage diff --git a/pages/documentations/styles.module.scss b/pages/documentations/styles.module.scss deleted file mode 100644 index 7d579d38a..000000000 --- a/pages/documentations/styles.module.scss +++ /dev/null @@ -1,58 +0,0 @@ -.tab-wrapper { - padding: 0 var(--page-padding-x); - .btn-wrapper { - padding: 3rem 0 1.5rem 0; - display: flex; - justify-content: center; - gap: 20px; - border-bottom: 2px solid #b75400; - .tab { - display: flex; - width: 50%; - font-size: 20px; - font-style: normal; - font-weight: 500; - line-height: 24px; - color: #000; - letter-spacing: 0.0015em; - cursor: pointer; - background: #f5f5f5; - filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15)); - border-top-left-radius: 15px; - border-top-right-radius: 15px; - .tab-header { - color: #b75400; - font-size: 24px; - font-style: normal; - font-weight: 500; - line-height: 130%; - text-align: left; - margin-bottom: 14px; - text-transform: initial; - } - .tab-description { - color: #212121; - font-size: 16px; - font-style: normal; - font-weight: 400; - line-height: 20px; - letter-spacing: 0.04px; - text-align: left; - text-transform: initial; - } - .tab:last-child { - margin-left: 10px; - } - } - .active-tab { - color: #fff; - background: #b75400; - .tab-header { - color: #fff; - } - .tab-description { - color: #fff; - } - } - } -} diff --git a/templates/documentations/dataProviderDocs.jsx b/templates/documentation/data-providers-guide/index.jsx similarity index 61% rename from templates/documentations/dataProviderDocs.jsx rename to templates/documentation/data-providers-guide/index.jsx index c60a5719b..fc17de91c 100644 --- a/templates/documentations/dataProviderDocs.jsx +++ b/templates/documentation/data-providers-guide/index.jsx @@ -4,10 +4,12 @@ import { DocumentationMembershipNav, } from '@oacore/design/lib/modules' import { useRouter } from 'next/router' +import { Button } from '@oacore/design/lib/elements' -import { Layout } from '../../design-v2/components' -import textData from '../../data/dataProviders.yml' +import { Layout } from '../../../design-v2/components' +import textData from '../../../data/dataProviders.yml' import styles from './styles.module.scss' +import text from '../../../data/membership.yml' function normalizeHref(str) { const test = str.replace('#', '') @@ -47,8 +49,36 @@ const DataProviderDocs = ({ dataProviderDocs }) => { } }, []) + const handleButtonClick = () => { + route.push('membership-documentation') + } + return ( +
+
+ + +
+
{ useEffect(() => { const id = route.query?.r if (id) { - const n = textData.navItems.findIndex( + const n = text.navItems.findIndex( (item) => normalizeHref(item.href) === id ) setNavActiveIndex(n) } }, []) + const handleButtonClick = () => { + route.push('data-providers-guide') + } + return ( +
+
+ + +
+
{ } diff --git a/templates/documentation/membership-documentation/styles.module.scss b/templates/documentation/membership-documentation/styles.module.scss new file mode 100644 index 000000000..1716fc19f --- /dev/null +++ b/templates/documentation/membership-documentation/styles.module.scss @@ -0,0 +1,203 @@ +.docs-layout { + padding: 9px var(--page-padding-x); +} + +.documentation-wrapper { + margin: 15px 0; +} + +.documentation-inner-wrapper { + width: calc(100% - 370px); + overflow-y: scroll; +} + +.documentation-header { + font-size: 24px; + font-style: normal; + font-weight: 500; + line-height: 24px; + color: #212121; +} + +.documentation-sub-title { + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 24px; + color: #212121; +} + +.placement { + display: flex; + justify-content: space-between; + max-height: 1472px; + overflow-y: scroll; + padding-top: 24px; + border-top: 2px solid #b75400; +} + +.documentation-item { + padding: 8px 0; + border-bottom: 2px dashed #eee; + p { + margin-top: 24px; + line-height: 24px; + } +} + +.documentation-item ul { + margin-left: 1.5rem; +} + +.documentation-item li { + line-height: 2rem; + list-style-type: disc; +} + +.documentation-item-title { + margin-bottom: 10px; + font-size: 18px; + font-style: normal; + font-weight: 700; + line-height: 24px; + color: #212121; +} + +.documentation-text { + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 24px; + color: #212121; +} + +.membership { + display: flex; + align-items: center; + justify-content: center; + width: max-content; + height: 24px; + padding: 8px; + font-size: 14px; + font-style: normal; + font-weight: 400; + text-transform: capitalize; + border-radius: 2px; +} + +.image { + width: 100%; + margin-bottom: 24px; + object-fit: contain; +} + +.logo-banner { + width: 50%; +} + +.logo-personalised { + width: 50%; +} + +.type-wrapper { + display: flex; + align-items: center; + gap: 4px; +} + +.enabled { + color: #212121; + background: #fae2d2; +} + +.disabled { + color: #bdbdbd; + background: #f5f5f5; +} + +.highlighted { + color: #b75400; +} + +.tab-wrapper { + .btn-wrapper { + padding: 3rem 0 1.5rem 0; + display: flex; + justify-content: center; + gap: 20px; + border-bottom: 2px solid #b75400; + .tab { + display: flex; + width: 50%; + font-size: 20px; + font-style: normal; + font-weight: 500; + line-height: 24px; + color: #000; + letter-spacing: 0.0015em; + cursor: pointer; + background: #f5f5f5; + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15)); + border-top-left-radius: 15px; + border-top-right-radius: 15px; + .tab-header { + color: #b75400; + font-size: 24px; + font-style: normal; + font-weight: 500; + line-height: 130%; + text-align: left; + margin-bottom: 14px; + text-transform: initial; + } + .tab-description { + color: #212121; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 20px; + letter-spacing: 0.04px; + text-align: left; + text-transform: initial; + } + .tab:last-child { + margin-left: 10px; + } + } + .active-tab { + display: flex; + width: 50%; + font-size: 20px; + font-style: normal; + font-weight: 500; + line-height: 24px; + color: #fff; + letter-spacing: 0.0015em; + cursor: pointer; + background: #b75400; + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15)); + border-top-left-radius: 15px; + border-top-right-radius: 15px; + .tab-header { + color: #fff; + font-size: 24px; + font-style: normal; + font-weight: 500; + line-height: 130%; + text-align: left; + margin-bottom: 14px; + text-transform: initial; + } + .tab-description { + color: #fff; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 20px; + letter-spacing: 0.04px; + text-align: left; + text-transform: initial; + } + } + } +} diff --git a/templates/documentations/styles.module.scss b/templates/documentations/styles.module.scss deleted file mode 100644 index 96d5fd41a..000000000 --- a/templates/documentations/styles.module.scss +++ /dev/null @@ -1,120 +0,0 @@ -.docs-layout { - padding: 9px var(--page-padding-x); -} - -.documentation-wrapper { - margin: 15px 0; -} - -.documentation-inner-wrapper { - width: calc(100% - 370px); - overflow-y: scroll; -} - -.documentation-header { - font-size: 24px; - font-style: normal; - font-weight: 500; - line-height: 24px; - color: #212121; -} - -.documentation-sub-title { - font-size: 16px; - font-style: normal; - font-weight: 400; - line-height: 24px; - color: #212121; -} - -.placement { - display: flex; - justify-content: space-between; - max-height: 1472px; - overflow-y: scroll; - padding-top: 24px; - border-top: 2px solid #b75400; -} - -.documentation-item { - padding: 8px 0; - border-bottom: 2px dashed #eee; - p { - margin-top: 24px; - line-height: 24px; - } -} - -.documentation-item ul { - margin-left: 1.5rem; -} - -.documentation-item li { - line-height: 2rem; - list-style-type: disc; -} - -.documentation-item-title { - margin-bottom: 10px; - font-size: 18px; - font-style: normal; - font-weight: 700; - line-height: 24px; - color: #212121; -} - -.documentation-text { - font-size: 16px; - font-style: normal; - font-weight: 400; - line-height: 24px; - color: #212121; -} - -.membership { - display: flex; - align-items: center; - justify-content: center; - width: max-content; - height: 24px; - padding: 8px; - font-size: 14px; - font-style: normal; - font-weight: 400; - text-transform: capitalize; - border-radius: 2px; -} - -.image { - width: 100%; - margin-bottom: 24px; - object-fit: contain; -} - -.logo-banner { - width: 50%; -} - -.logo-personalised { - width: 50%; -} - -.type-wrapper { - display: flex; - align-items: center; - gap: 4px; -} - -.enabled { - color: #212121; - background: #fae2d2; -} - -.disabled { - color: #bdbdbd; - background: #f5f5f5; -} - -.highlighted { - color: #b75400; -}