From 374de36ef251a638d276eae301774ce9de017f5c Mon Sep 17 00:00:00 2001 From: Johannes Liermann Date: Tue, 7 May 2024 13:56:53 +0200 Subject: [PATCH 1/5] chore: component directory structure --- .../10_choose_repository.mdx | 4 +- src/components/{ => repos}/DecisionTree.js | 0 .../{ => repos}/DecisionTree.module.css | 18 +- src/css/custom.css | 842 +++++++++--------- 4 files changed, 432 insertions(+), 432 deletions(-) rename src/components/{ => repos}/DecisionTree.js (100%) rename src/components/{ => repos}/DecisionTree.module.css (77%) diff --git a/docs/50_data_publication/20_choose_repository/10_choose_repository.mdx b/docs/50_data_publication/20_choose_repository/10_choose_repository.mdx index 011bef97..fd735eaa 100644 --- a/docs/50_data_publication/20_choose_repository/10_choose_repository.mdx +++ b/docs/50_data_publication/20_choose_repository/10_choose_repository.mdx @@ -4,13 +4,13 @@ slug: "/choose_repository" --- import useBaseUrl from "@docusaurus/useBaseUrl"; -import DecisionTree from "@site/src/components/DecisionTree"; +import DecisionTree from "@site/src/components/repos/DecisionTree"; # Choose a Repository The NFDI4Chem aims to support researchers in collecting, storing, processing, analysing, publishing, and reusing research data. Based on the [NFDI4Chem Community Survey](https://doi.org/10.1002/zaac.202000339), a list of the most [common data types and formats](/docs/pub_data_types_formats) of the community has been compiled to suggests suitable trusted chemistry-friendly repositories. -This decision tree will guide users to quickly select a suitable repository for publishing their research data! +This decision tree will guide users to quickly select a suitable repository for publishing their research data. Click on the repositories to learn more! diff --git a/src/components/DecisionTree.js b/src/components/repos/DecisionTree.js similarity index 100% rename from src/components/DecisionTree.js rename to src/components/repos/DecisionTree.js diff --git a/src/components/DecisionTree.module.css b/src/components/repos/DecisionTree.module.css similarity index 77% rename from src/components/DecisionTree.module.css rename to src/components/repos/DecisionTree.module.css index c25a89ea..b3364f84 100644 --- a/src/components/DecisionTree.module.css +++ b/src/components/repos/DecisionTree.module.css @@ -2,11 +2,11 @@ .cls1, .cls2 { - fill: #f2f2f2; + fill: var(--repo-data-box); } .cls3 { - fill: #000; + fill: black; font-size: 18px; } @@ -40,12 +40,12 @@ .cls9, .cls11, .cls4 { - fill: #fff; + fill: white; } .cls5, .cls10 { - fill: #00617c; + fill: var(--ifm-color-primary); } .cls12 { @@ -61,7 +61,7 @@ } .cls11 { - stroke: #7f7f7f; + stroke: var(--repo-line); } .cls14 { @@ -83,16 +83,16 @@ .cls6, .cls17 { - fill: #00617c; + fill: var(--ifm-color-primary); } .cls7 { - fill: #f0f0f0; + fill: var(--repo-data-box); } .svglink:hover > * { - fill: #e30613; - transition-duration: 0.5s; + fill: var(--ifm-color-danger); + transition-duration: 0.4s; } .svglink:hover > text { diff --git a/src/css/custom.css b/src/css/custom.css index 1c70b11f..e75fe2c5 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -11,110 +11,110 @@ /* @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,600;1,400;1,600&display=swap'); */ - @import "@fontsource/ibm-plex-sans/400.css"; @import "@fontsource/ibm-plex-sans/600.css"; @import "@fontsource/ibm-plex-sans/400-italic.css"; @import "@fontsource/ibm-plex-sans/600-italic.css"; - /********** Global variables ************/ :root { - --ifm-color-primary: #00617c; - --ifm-color-primary-dark: var(--ifm-color-primary); - --ifm-color-primary-darker: var(--ifm-color-primary); - --ifm-color-primary-darkest: var(--ifm-color-primary); - --ifm-color-primary-light: #009cbc; - --ifm-color-primary-lighter: var(--ifm-color-primary); - --ifm-color-primary-lightest: var(--ifm-color-primary); - --ifm-code-font-size: 95%; - --ifm-font-family-base: 'IBM Plex Sans', sans-serif; - --ifm-heading-color: var(--ifm-color-primary); - --ifm-color-secondary: #873593; - --ifm-color-secondary-dark: var(--ifm-color-secondary); - --ifm-color-secondary-darker: var(--ifm-color-secondary); - --ifm-color-secondary-darkest: var(--ifm-color-secondary); - --ifm-color-secondary-light: var(--ifm-color-secondary); - --ifm-color-secondary-lighter: var(--ifm-color-secondary); - --ifm-color-secondary-lightest: var(--ifm-color-secondary); - --ifm-color-danger: #E30613; - --ifm-color-danger-dark: var(--ifm-color-danger); - --ifm-color-danger-darker: var(--ifm-color-danger); - --ifm-color-danger-darkest: var(--ifm-color-danger); - --ifm-color-danger-light: var(--ifm-color-danger); - --ifm-color-danger-lighter: var(--ifm-color-danger); - --ifm-color-danger-lightest: var(--ifm-color-danger); - --ifm-color-success: var(--ifm-color-secondary); - --ifm-color-success-dark: var(--ifm-color-success); - --ifm-color-success-darker: var(--ifm-color-success); - --ifm-color-success-darkest: var(--ifm-color-success); - --ifm-color-success-light: var(--ifm-color-success); - --ifm-color-success-lighter: var(--ifm-color-success); - --ifm-color-success-lightest: var(--ifm-color-success); - --ifm-color-info: #009cbc; - --ifm-color-info-dark: var(--ifm-color-info); - --ifm-color-info-darker: var(--ifm-color-info); - --ifm-color-info-darkest: var(--ifm-color-info); - --ifm-color-info-light: var(--ifm-color-info); - --ifm-color-info-lighter: var(--ifm-color-info); - --ifm-color-info-lightest: var(--ifm-color-info); - --ifm-color-caution: #f1de1e; - --ifm-color-caution-dark: var(--ifm-color-caution); - --ifm-color-caution-darker: var(--ifm-color-caution); - --ifm-color-caution-darkest: var(--ifm-color-caution); - --ifm-color-caution-light: var(--ifm-color-caution); - --ifm-color-caution-lighter: var(--ifm-color-caution); - --ifm-color-caution-lightest: var(--ifm-color-caution); - --ifm-global-shadow-lw: 0 3px 4px 0 rgba(0, 0, 0, 0.3); - --ifm-link-color: var(--ifm-color-primary); - --ifm-link-decoration: bold; - --ifm-link-hover-color: var(--ifm-link-color); - --ifm-link-hover-decoration: underline; - --ifm-footer-link-hover-color: var(--ifm-color-danger); - - --ifm-table-border-width: 0; - --ifm-table-head-background: var(--ifm-color-primary); - --ifm-table-head-color: white; - - --ifm-hero-text-color: white; - - --ifm-navbar-search-input-placeholder-color: var(--ifm-color-emphasis-800); - - --ifm-font-size-base: 13pt; - - --ifm-button-border-radius: 0; - - --ifm-navbar-height: 5rem; - --ifm-navbar-shadow: transparent; - --n4c-navbar-border: #e0e0e0; - - --ifm-alert-border-left-width: 1pt; - --ifm-alert-border-width: 1pt; - --ifm-alert-border-radius: 0; - --ifm-alert-shadow: transparent; - - --n4c-col-width: 250px; - - --n4c-button-width: 280px; - --n4c-button-height: 240px; - - --n4c-button-secondary-width: 300px; - - --n4c-button-vpad: 10px; - --n4c-button-hpad: 5px; - - --n4c-hover-scale: 105%; - --n4c-transform-time: 175ms; - -/* Lead by example */ - - --lbe-hover-scale: 104%; - --lbe-transform-time: 175ms; - + --ifm-color-primary: #00617c; + --ifm-color-primary-dark: var(--ifm-color-primary); + --ifm-color-primary-darker: var(--ifm-color-primary); + --ifm-color-primary-darkest: var(--ifm-color-primary); + --ifm-color-primary-light: #009cbc; + --ifm-color-primary-lighter: var(--ifm-color-primary); + --ifm-color-primary-lightest: var(--ifm-color-primary); + --ifm-code-font-size: 95%; + --ifm-font-family-base: "IBM Plex Sans", sans-serif; + --ifm-heading-color: var(--ifm-color-primary); + --ifm-color-secondary: #873593; + --ifm-color-secondary-dark: var(--ifm-color-secondary); + --ifm-color-secondary-darker: var(--ifm-color-secondary); + --ifm-color-secondary-darkest: var(--ifm-color-secondary); + --ifm-color-secondary-light: var(--ifm-color-secondary); + --ifm-color-secondary-lighter: var(--ifm-color-secondary); + --ifm-color-secondary-lightest: var(--ifm-color-secondary); + --ifm-color-danger: #e30613; + --ifm-color-danger-dark: var(--ifm-color-danger); + --ifm-color-danger-darker: var(--ifm-color-danger); + --ifm-color-danger-darkest: var(--ifm-color-danger); + --ifm-color-danger-light: var(--ifm-color-danger); + --ifm-color-danger-lighter: var(--ifm-color-danger); + --ifm-color-danger-lightest: var(--ifm-color-danger); + --ifm-color-success: var(--ifm-color-secondary); + --ifm-color-success-dark: var(--ifm-color-success); + --ifm-color-success-darker: var(--ifm-color-success); + --ifm-color-success-darkest: var(--ifm-color-success); + --ifm-color-success-light: var(--ifm-color-success); + --ifm-color-success-lighter: var(--ifm-color-success); + --ifm-color-success-lightest: var(--ifm-color-success); + --ifm-color-info: #009cbc; + --ifm-color-info-dark: var(--ifm-color-info); + --ifm-color-info-darker: var(--ifm-color-info); + --ifm-color-info-darkest: var(--ifm-color-info); + --ifm-color-info-light: var(--ifm-color-info); + --ifm-color-info-lighter: var(--ifm-color-info); + --ifm-color-info-lightest: var(--ifm-color-info); + --ifm-color-caution: #f1de1e; + --ifm-color-caution-dark: var(--ifm-color-caution); + --ifm-color-caution-darker: var(--ifm-color-caution); + --ifm-color-caution-darkest: var(--ifm-color-caution); + --ifm-color-caution-light: var(--ifm-color-caution); + --ifm-color-caution-lighter: var(--ifm-color-caution); + --ifm-color-caution-lightest: var(--ifm-color-caution); + --ifm-global-shadow-lw: 0 3px 4px 0 rgba(0, 0, 0, 0.3); + --ifm-link-color: var(--ifm-color-primary); + --ifm-link-decoration: bold; + --ifm-link-hover-color: var(--ifm-link-color); + --ifm-link-hover-decoration: underline; + --ifm-footer-link-hover-color: var(--ifm-color-danger); + + --ifm-table-border-width: 0; + --ifm-table-head-background: var(--ifm-color-primary); + --ifm-table-head-color: white; + + --ifm-hero-text-color: white; + + --ifm-navbar-search-input-placeholder-color: var(--ifm-color-emphasis-800); + + --ifm-font-size-base: 13pt; + + --ifm-button-border-radius: 0; + + --ifm-navbar-height: 5rem; + --ifm-navbar-shadow: transparent; + --n4c-navbar-border: #e0e0e0; + + --ifm-alert-border-left-width: 1pt; + --ifm-alert-border-width: 1pt; + --ifm-alert-border-radius: 0; + --ifm-alert-shadow: transparent; + + --n4c-col-width: 250px; + + --n4c-button-width: 280px; + --n4c-button-height: 240px; + + --n4c-button-secondary-width: 300px; + + --n4c-button-vpad: 10px; + --n4c-button-hpad: 5px; + + --n4c-hover-scale: 105%; + --n4c-transform-time: 175ms; + + /* Lead by example */ + + --lbe-hover-scale: 104%; + --lbe-transform-time: 175ms; + + /* Repos */ + --repo-data-box: #f0f0f0; + --repo-line: #7f7f7f; } - /********** General and Landing page ************/ /* div[class^='announcementBar_'] { @@ -129,197 +129,196 @@ ); } */ -div[class^='announcementBar_'] { - --site-announcement-bar-stripe-color1: rgba(227, 6, 19, 0.15); - --site-announcement-bar-stripe-color2: white; - background: repeating-linear-gradient( - -35deg, - var(--site-announcement-bar-stripe-color1), - var(--site-announcement-bar-stripe-color1) 20px, - var(--site-announcement-bar-stripe-color2) 10px, - var(--site-announcement-bar-stripe-color2) 40px - ); +div[class^="announcementBar_"] { + --site-announcement-bar-stripe-color1: rgba(227, 6, 19, 0.15); + --site-announcement-bar-stripe-color2: white; + background: repeating-linear-gradient( + -35deg, + var(--site-announcement-bar-stripe-color1), + var(--site-announcement-bar-stripe-color1) 20px, + var(--site-announcement-bar-stripe-color2) 10px, + var(--site-announcement-bar-stripe-color2) 40px + ); } .navbar__logo img { - margin-bottom: 0%; - height: 110%; - margin-top: -6px; + margin-bottom: 0%; + height: 110%; + margin-top: -6px; } .navbar { - border-bottom: 1px solid var(--n4c-navbar-border); + border-bottom: 1px solid var(--n4c-navbar-border); } .main-wrapper { - display: flex; + display: flex; } .hero { - display: flex; - flex-grow: 1; - padding: 2rem 0; - text-align: center; - width: 100%; - overflow: hidden; - --ifm-hero-background-color: var(--ifm-color-primary); - --ifm-hero-text-color: var(--ifm-color-white); - background-image: url('/img/Background.png'), url('/img/Background_right.png'); - background-repeat: no-repeat; - background-position: left top, right top; + display: flex; + flex-grow: 1; + padding: 2rem 0; + text-align: center; + width: 100%; + overflow: hidden; + --ifm-hero-background-color: var(--ifm-color-primary); + --ifm-hero-text-color: var(--ifm-color-white); + background-image: url("/img/Background.png"), + url("/img/Background_right.png"); + background-repeat: no-repeat; + background-position: left top, right top; } @media screen and (max-width: 966px) { - .hero { - padding: 2rem; - background-image: url('/img/Background.png'); - background-repeat: no-repeat; - background-position: left top, right top; - } + .hero { + padding: 2rem; + background-image: url("/img/Background.png"); + background-repeat: no-repeat; + background-position: left top, right top; + } } .hero__container { - position: center; - width: 100%; + position: center; + width: 100%; } .hero__title { - color: var(--ifm-hero-text-color); - text-align: left; - font-size: 2.5rem; + color: var(--ifm-hero-text-color); + text-align: left; + font-size: 2.5rem; } .hero__subtitle { - font-size: 1.2rem; + font-size: 1.2rem; } .footer__link-item { - color: var(--ifm-footer-link-color); - line-height: 2; - font-weight: unset; + color: var(--ifm-footer-link-color); + line-height: 2; + font-weight: unset; } .footer--dark { - --ifm-footer-background-color: var(--ifm-color-primary); - --ifm-footer-color: var(--ifm-footer-link-color); - --ifm-footer-link-color: var(--ifm-color-white); - --ifm-footer-title-color: var(--ifm-color-white); - font-weight: unset; - border-top: 1px solid white; + --ifm-footer-background-color: var(--ifm-color-primary); + --ifm-footer-color: var(--ifm-footer-link-color); + --ifm-footer-link-color: var(--ifm-color-white); + --ifm-footer-title-color: var(--ifm-color-white); + font-weight: unset; + border-top: 1px solid white; } .footer__title { -color: var(--ifm-footer-title-color); -font: bold var(--ifm-h3-font-size)/var(--ifm-heading-line-height) var(--ifm-font-family-base); -margin-bottom: var(--ifm-heading-margin-bottom); + color: var(--ifm-footer-title-color); + font: bold var(--ifm-h3-font-size) / var(--ifm-heading-line-height) + var(--ifm-font-family-base); + margin-bottom: var(--ifm-heading-margin-bottom); } /* N4C Feature styles */ .features { - align-items: center; - padding: 2px; - width: 100%; + align-items: center; + padding: 2px; + width: 100%; } .featureSvg { - padding: 2px; - width: 110px; - height: 110px; - margin-top: 5px; + padding: 2px; + width: 110px; + height: 110px; + margin-top: 5px; } .feature__col { - display: flex; - width: var(--n4c-col-width); - /* height: var(--n4c-button-height); */ - padding: var(--n4c-button-vpad) var(--n4c-button-hpad); - align-items: center; - justify-content: center; + display: flex; + width: var(--n4c-col-width); + /* height: var(--n4c-button-height); */ + padding: var(--n4c-button-vpad) var(--n4c-button-hpad); + align-items: center; + justify-content: center; } .intro__col { - display: flex; - width: var(--n4c-col-width); - /* height: var(--n4c-button-height); */ - padding: var(--n4c-button-vpad) var(--n4c-button-hpad); - align-items: center; - justify-content: left; + display: flex; + width: var(--n4c-col-width); + /* height: var(--n4c-button-height); */ + padding: var(--n4c-button-vpad) var(--n4c-button-hpad); + align-items: center; + justify-content: left; } .feature__button { - background-color: unset; - border: none; - width: var(--n4c-button-width); - padding: var(--n4c-button-vpad) var(--n4c-button-hpad); - font-size: 1.1rem; + background-color: unset; + border: none; + width: var(--n4c-button-width); + padding: var(--n4c-button-vpad) var(--n4c-button-hpad); + font-size: 1.1rem; } .feature__button--secondary { - display: flex; - flex-direction: column; - align-items: center; - width: var(--n4c-button-secondary-width); - font-size: 13pt; + display: flex; + flex-direction: column; + align-items: center; + width: var(--n4c-button-secondary-width); + font-size: 13pt; } .feature__button--secondary > * { - text-align: center; - word-wrap: break-word; + text-align: center; + word-wrap: break-word; } .buttons { - display: flex; - align-items: center; - justify-content: center; + display: flex; + align-items: center; + justify-content: center; } .heroBanner { - padding: 2rem 0; - text-align: center; - position: center; - overflow: hidden; - --ifm-hero-background-color: var(--ifm-color-primary); - --ifm-hero-text-color: var(--ifm-color-white); + padding: 2rem 0; + text-align: center; + position: center; + overflow: hidden; + --ifm-hero-background-color: var(--ifm-color-primary); + --ifm-hero-text-color: var(--ifm-color-white); } @media screen and (max-width: 966px) { - .heroBanner { - padding: 2rem; - } + .heroBanner { + padding: 2rem; + } } .buttons { - display: flex; - align-items: center; - justify-content: center; + display: flex; + align-items: center; + justify-content: center; } /* .button--primary { --ifm-button-border-color: white; } */ - - .button--primary:hover { - /* --ifm-button-background-color: var(--ifm-color-danger); */ - /* --ifm-button-border-color: white; */ - transform: scale(var(--n4c-hover-scale)); - transition: transform var(--n4c-transform-time) ease-in-out; + /* --ifm-button-background-color: var(--ifm-color-danger); */ + /* --ifm-button-border-color: white; */ + transform: scale(var(--n4c-hover-scale)); + transition: transform var(--n4c-transform-time) ease-in-out; } .button.button--secondary { - color: var(--ifm-color-primary); - --ifm-button-background-color: white; - --ifm-button-border-color: var(--ifm-color-primary); + color: var(--ifm-color-primary); + --ifm-button-background-color: white; + --ifm-button-border-color: var(--ifm-color-primary); } .button--secondary:hover { - /* --ifm-button-background-color: var(--ifm-color-danger); */ + /* --ifm-button-background-color: var(--ifm-color-danger); */ transform: scale(var(--n4c-hover-scale)); transition: transform var(--n4c-transform-time) ease-in-out; } - .button.button--secondary h1, .button.button--secondary h2, @@ -328,24 +327,23 @@ margin-bottom: var(--ifm-heading-margin-bottom); .button.button--secondary h5, .button.button--secondary h6, .button.button--secondary a { - color: var(--ifm-color-primary); - text-align: left; - white-space: normal; - word-wrap: break-word; + color: var(--ifm-color-primary); + text-align: left; + white-space: normal; + word-wrap: break-word; } .button.button--secondary li, -.button.button--secondary em - { - color: var(--ifm-color-primary); - text-align: left; - font-weight: 400; - white-space: normal; - word-wrap: break-word; +.button.button--secondary em { + color: var(--ifm-color-primary); + text-align: left; + font-weight: 400; + white-space: normal; + word-wrap: break-word; } .button.button--primary { - color: var(--ifm-color-white); + color: var(--ifm-color-white); } .button.button--primary h1, @@ -354,34 +352,32 @@ margin-bottom: var(--ifm-heading-margin-bottom); .button.button--primary h4, .button.button--primary h5, .button.button--primary h6 { - color: white; - text-align: left; - white-space: normal; - word-wrap: break-word; + color: white; + text-align: left; + white-space: normal; + word-wrap: break-word; } .button.button--primary li, -.button.button--primary em - { - color: var(--ifm-color-white); - text-align: left; - font-weight: 400; - white-space: normal; - word-wrap: break-word; +.button.button--primary em { + color: var(--ifm-color-white); + text-align: left; + font-weight: 400; + white-space: normal; + word-wrap: break-word; } - .button--negative { - --ifm-button-background-color: var(--ifm-color-white); - border-radius: 10px; - color: var(--ifm-color-primary); - font-weight: 400; + --ifm-button-background-color: var(--ifm-color-white); + border-radius: 10px; + color: var(--ifm-color-primary); + font-weight: 400; } .button--negative:hover { -/* --ifm-button-background-color: var(--ifm-color-danger); */ - transform: scale(var(--n4c-hover-scale)); - transition: transform var(--n4c-transform-time) ease-in-out; + /* --ifm-button-background-color: var(--ifm-color-danger); */ + transform: scale(var(--n4c-hover-scale)); + transition: transform var(--n4c-transform-time) ease-in-out; } .button.button--negative h1, @@ -391,36 +387,32 @@ margin-bottom: var(--ifm-heading-margin-bottom); .button.button--negative h5, .button.button--negative h6, .button.button--negative a { - color: var(--ifm-color-primary); - text-align: left; - white-space: normal; - word-wrap: break-word; + color: var(--ifm-color-primary); + text-align: left; + white-space: normal; + word-wrap: break-word; } .n4c-logo { - margin-top: -5; - padding: 0 ; + margin-top: -5; + padding: 0; } - /********** Links ************/ - a { - font-weight: bold; + font-weight: bold; } - - a.button.button--primary:not(.button--outline):hover { - color: white; - text-decoration: unset; + color: white; + text-decoration: unset; } a.button.button--secondary:not(.button--outline):hover, a.button.button--negative:not(.button--outline):hover { - color: var(--ifm-color-primary); - text-decoration: unset; + color: var(--ifm-color-primary); + text-decoration: unset; } a:not([href]) { @@ -428,361 +420,369 @@ a:not([href]) { } p, -.markdown>p, -.markdown>pre, -.markdown>ul { - margin-bottom:var(--ifm-leading); - text-align: justify; +.markdown > p, +.markdown > pre, +.markdown > ul { + margin-bottom: var(--ifm-leading); + text-align: justify; } .menu__link { - font-weight: unset; + font-weight: unset; } .pagination-nav__link { - border: none; - border-radius: var(--ifm-pagination-nav-border-radius); - padding: var(--ifm-global-spacing); - transition: background-color var(--ifm-button-transition-duration) var(--ifm-transition-timing-default); + border: none; + border-radius: var(--ifm-pagination-nav-border-radius); + padding: var(--ifm-global-spacing); + transition: background-color var(--ifm-button-transition-duration) + var(--ifm-transition-timing-default); } .pagination-nav__link:hover { - background-color: var(--ifm-menu-color-background-hover); + background-color: var(--ifm-menu-color-background-hover); } .table-of-contents__link { - color: black; - font-weight: unset; - } + color: black; + font-weight: unset; +} .table-of-contents__link--active, .table-of-contents__link--active code, .table-of-contents__link:hover, .table-of-contents__link:hover code { - color:var(--ifm-color-primary); - text-decoration:none + color: var(--ifm-color-primary); + text-decoration: none; } /********** Search tool ************/ .searchResultItem_18XW a, .searchResultItem_18XW h2 { -/* color: unset;*/ - color: var(--ifm-color-primary); - font-size: unset; + /* color: unset;*/ + color: var(--ifm-color-primary); + font-size: unset; } mark { - color: white; - background: var(--ifm-color-danger); -/* background: var(--ifm-color-primary);*/ + color: white; + background: var(--ifm-color-danger); + /* background: var(--ifm-color-primary);*/ } /********** Bullets ************/ ul { - list-style-type: '\2B22\ '; -} + list-style-type: "\2B22\ "; +} ul li::marker { - position: absolute; - font-size: 0.9em; - color: var(--ifm-color-primary); + position: absolute; + font-size: 0.9em; + color: var(--ifm-color-primary); } .button li::marker { - color: unset; + color: unset; } ul ul { - list-style-type: '\2B21\ '; -} + list-style-type: "\2B21\ "; +} /********** Alerts ************/ .alert { - color: black; - --ifm-alert-foreground-color: black; - --ifm-alert-background-color: white; - border-style: dashed; - text-align: justify; + color: black; + --ifm-alert-foreground-color: black; + --ifm-alert-background-color: white; + border-style: dashed; + text-align: justify; } .alert a { - color: var(--ifm-color-primary); - text-decoration: none; + color: var(--ifm-color-primary); + text-decoration: none; } .alert a:hover { - color: var(--ifm-color-primary); - text-decoration: var(--ifm-link-decoration); + color: var(--ifm-color-primary); + text-decoration: var(--ifm-link-decoration); } /********** Tables ************/ table { - border: .5px solid var(--ifm-color-primary); + border: 0.5px solid var(--ifm-color-primary); } table thead tr { - border-bottom: 1px solid var(--ifm-color-primary); + border-bottom: 1px solid var(--ifm-color-primary); } - /********** Methods Table ************/ - .methods__searchfilter { - padding: 10px; - margin: 15px 0px; - border: 1px dashed var(--ifm-color-primary); - display: flex; + padding: 10px; + margin: 15px 0px; + border: 1px dashed var(--ifm-color-primary); + display: flex; } - .methods__searchfilter__row { - align-items: center; - flex-wrap: wrap; + align-items: center; + flex-wrap: wrap; } .methods__searchfilter__filter { - width: calc(8/12*100%); - padding: 0 var(--ifm-spacing-horizontal); + width: calc(8 / 12 * 100%); + padding: 0 var(--ifm-spacing-horizontal); } .methods__searchfilter__search { - width: calc(4/12*100%); - padding: 0var(--ifm-spacing-horizontal); + width: calc(4 / 12 * 100%); + padding: 0var (--ifm-spacing-horizontal); } - @media screen and (max-width: 1350px) { - .methods__searchfilter__filter { - width: unset; - padding: 0 var(--ifm-spacing-horizontal); - } - - .methods__searchfilter__search { - width: unset; - padding: var(--ifm-spacing-horizontal); - } + .methods__searchfilter__filter { + width: unset; + padding: 0 var(--ifm-spacing-horizontal); + } + + .methods__searchfilter__search { + width: unset; + padding: var(--ifm-spacing-horizontal); + } } /********** Lead by Example ************/ .lbe-intro { - margin: 1rem 0; + margin: 1rem 0; } .lbe { - display: flex; - flex-direction: row-reverse; + display: flex; + flex-direction: row-reverse; } /* Search / Filter section */ .lbe__searchfilter { - padding-left: 0.5rem; - width: 35%; + padding-left: 0.5rem; + width: 35%; } .lbe__searchfilter__container { - padding: 0.75rem; - border: 1px dashed var(--ifm-color-primary); - margin-bottom: 0.75rem; + padding: 0.75rem; + border: 1px dashed var(--ifm-color-primary); + margin-bottom: 0.75rem; } .lbe__searchfilter__section p { - margin: unset; + margin: unset; } .lbe__searchfilter__section h4 { - margin: 0.5rem 0; + margin: 0.5rem 0; } .lbe__body { - padding-right: 0.5rem; - width: 65%; + padding-right: 0.5rem; + width: 65%; } @media screen and (max-width: 1200px) { -.lbe { - display: flex; - flex-direction: column; -} + .lbe { + display: flex; + flex-direction: column; + } -.lbe__searchfilter { - padding: 0; - width: 100%; -} - -.lbe__body { - padding: 0; - width: 100%; -}} + .lbe__searchfilter { + padding: 0; + width: 100%; + } + .lbe__body { + padding: 0; + width: 100%; + } +} .lbe__searchfilter input:focus { - width: calc(5/12*100%); + width: calc(5 / 12 * 100%); } .lbe__searchfilter__search { - padding: .5rem 0; + padding: 0.5rem 0; } .lbe__searchfilter__search > em { - color: var(--ifm-color-primary); + color: var(--ifm-color-primary); } /* Filter buttons */ .lbe__filterbutton { - border-radius: var(--ifm-breadcrumb-border-radius); - color: white; - display: inline-block; - font-size: calc(0.6rem * var(--ifm-breadcrumb-size-multiplier)); - font-weight: 600; - padding: calc( var(--ifm-breadcrumb-padding-vertical) * var(--ifm-breadcrumb-size-multiplier) ) calc( var(--ifm-breadcrumb-padding-horizontal) * var(--ifm-breadcrumb-size-multiplier) ); - border: none; - margin: 0.2em; - background: var(--ifm-color-primary); + border-radius: var(--ifm-breadcrumb-border-radius); + color: white; + display: inline-block; + font-size: calc(0.6rem * var(--ifm-breadcrumb-size-multiplier)); + font-weight: 600; + padding: calc( + var(--ifm-breadcrumb-padding-vertical) * + var(--ifm-breadcrumb-size-multiplier) + ) + calc( + var(--ifm-breadcrumb-padding-horizontal) * + var(--ifm-breadcrumb-size-multiplier) + ); + border: none; + margin: 0.2em; + background: var(--ifm-color-primary); } .lbe__filterbutton.lbe__filterbutton_secondary { - background: var(--ifm-breadcrumb-item-background-active); - color: var(--ifm-color-primary); + background: var(--ifm-breadcrumb-item-background-active); + color: var(--ifm-color-primary); } .lbe__filterbutton.lbe__chip { - background: var(--ifm-breadcrumb-item-background-active); - color: var(--ifm-color-primary); - font-size: calc(0.8rem * var(--ifm-breadcrumb-size-multiplier)); - font-weight: 300; - justify-self: left; - margin-bottom: 1rem; + background: var(--ifm-breadcrumb-item-background-active); + color: var(--ifm-color-primary); + font-size: calc(0.8rem * var(--ifm-breadcrumb-size-multiplier)); + font-weight: 300; + justify-self: left; + margin-bottom: 1rem; } .lbe__filterbutton.lbe__filterbutton--active { - background: var(--ifm-color-danger); - color: white; + background: var(--ifm-color-danger); + color: white; } -.lbe__filterbutton:hover, .lbe__filterbutton--active:hover { - transform: scale(var(--lbe-hover-scale)); - transition: transform var(--lbe-transform-time) ease-in-out; +.lbe__filterbutton:hover, +.lbe__filterbutton--active:hover { + cursor: pointer; + transform: scale(var(--lbe-hover-scale)); + transition: transform var(--lbe-transform-time) ease-in-out; } - /* LBE blocks */ -.lbe__block { - padding: 0.75rem; - border: 1px dashed var(--ifm-color-primary); - margin-bottom: 0.75rem; - transition: all var(--n4c-transform-time) ease-in-out; +.lbe__block { + padding: 0.75rem; + border: 1px dashed var(--ifm-color-primary); + margin-bottom: 0.75rem; + transition: all var(--n4c-transform-time) ease-in-out; } .lbe__block__header { - display: flex; - align-items: center; + display: flex; + align-items: center; } .lbe__block__header__title { - width: 85%; - padding: 0.3rem; - display: flex; - align-items: center; + width: 85%; + padding: 0.3rem; + display: flex; + align-items: center; } .lbe__block__author-trigger { - border: none; - background: none; - scale: 90%; - color: var(--ifm-color-primary); - padding: 0 0.5em; - margin: 0; + border: none; + background: none; + scale: 90%; + color: var(--ifm-color-primary); + padding: 0 0.5em; + margin: 0; } .lbe__block__header__link { - width: 15%; - display: flex; - justify-content: right; + width: 15%; + display: flex; + justify-content: right; } .lbe__block > p { - padding: 0 0.3rem; + padding: 0 0.3rem; } -.lbe__block p:nth-of-type(-n+2), .lbe__block__header__title h3 { - margin-bottom: calc(0.5*var(--ifm-leading)); - text-align: left; +.lbe__block p:nth-of-type(-n + 2), +.lbe__block__header__title h3 { + margin-bottom: calc(0.5 * var(--ifm-leading)); + text-align: left; } -@media screen and (max-width: 966px) { .lbe__block__header { - display: flex; - flex-wrap: wrap-reverse; -} +@media screen and (max-width: 966px) { + .lbe__block__header { + display: flex; + flex-wrap: wrap-reverse; + } - .lbe__block__header__title, .lbe__block__header__link { - width: 100%; - justify-content: left; - } + .lbe__block__header__title, + .lbe__block__header__link { + width: 100%; + justify-content: left; + } } .lbe__details { - display: flex; - overflow: hidden; - border: 1px solid var(--ifm-color-primary); - padding: 1rem; - transition: all var(--n4c-transform-time) ease-in-out; + display: flex; + overflow: hidden; + border: 1px solid var(--ifm-color-primary); + padding: 1rem; + transition: all var(--n4c-transform-time) ease-in-out; } .lbe__details h4 { - color: var(--ifm-color-primary); - padding-top: 15px; - transition: all var(--n4c-transform-time) ease-in-out; + color: var(--ifm-color-primary); + padding-top: 15px; + transition: all var(--n4c-transform-time) ease-in-out; } .lbe__details[open] summary { - padding-bottom: 15px; - border-bottom: 1px solid var(--ifm-color-primary); + padding-bottom: 15px; + border-bottom: 1px solid var(--ifm-color-primary); } .lbe__details summary::marker { - color: var(--ifm-color-primary); + color: var(--ifm-color-primary); } .lbe__block__link { - border: 0.5px solid var(--ifm-color-primary); - padding: 0.5em; - border-radius: 5px; - margin: 0.2em; - font-size: 11pt; - background: none; + border: 0.5px solid var(--ifm-color-primary); + padding: 0.5em; + border-radius: 5px; + margin: 0.2em; + font-size: 11pt; + background: none; } .lbe__block__link:hover { - transform: scale(var(--lbe-hover-scale)); - transition: all var(--lbe-transform-time) ease-in-out; + transform: scale(var(--lbe-hover-scale)); + transition: all var(--lbe-transform-time) ease-in-out; } .lbe__block__link a:hover { - text-decoration: none; + text-decoration: none; } /********** Tag Cloud ************/ .tag-cloud { - text-align: center; - color: var(--ifm-color-primary); + text-align: center; + color: var(--ifm-color-primary); } .tag-cloud-tag { - padding: .2em; + padding: 0.2em; } .tag-cloud-tag:hover { - transform: scale(1.1); - color: var(--ifm-color-danger); - transition: all var(--lbe-transform-time) ease-in-out; -} \ No newline at end of file + transform: scale(1.1); + color: var(--ifm-color-danger); + transition: all var(--lbe-transform-time) ease-in-out; +} From 49db643aa087916a9a6a9fd6d54233e2c91b556a Mon Sep 17 00:00:00 2001 From: Johannes Liermann Date: Tue, 7 May 2024 13:57:08 +0200 Subject: [PATCH 2/5] feat: repo button for ext. link --- src/components/repos/RepoButton.js | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) create mode 100644 src/components/repos/RepoButton.js diff --git a/src/components/repos/RepoButton.js b/src/components/repos/RepoButton.js new file mode 100644 index 00000000..1093b8c2 --- /dev/null +++ b/src/components/repos/RepoButton.js @@ -0,0 +1,19 @@ +import React from "react"; +import Link from "@docusaurus/Link"; + +import IconExternalLink from "@theme/Icon/ExternalLink"; + +function RepoButton(props) { + return ( + + + + + + ); +} + +export default RepoButton; From 1ce2036309aea381f7e58fac87c6ff8b49c9eec0 Mon Sep 17 00:00:00 2001 From: Johannes Liermann Date: Tue, 7 May 2024 13:57:19 +0200 Subject: [PATCH 3/5] refactor: styling of repo pages --- .../30_chemotion_repo.mdx | 30 +++++++++++----- .../20_choose_repository/40_massbank_eu.mdx | 22 ++++++++---- .../20_choose_repository/50_nmrxiv.mdx | 35 +++++++++++++------ .../20_choose_repository/60_nomad.mdx | 22 ++++++++---- .../20_choose_repository/60_radar4chem.mdx | 32 +++++++++++------ .../20_choose_repository/70_strenda_db.mdx | 32 +++++++++++------ .../20_choose_repository/80_suprabank.mdx | 26 ++++++++------ .../20_choose_repository/90_csd_icsd.mdx | 20 ++++++++--- 8 files changed, 152 insertions(+), 67 deletions(-) diff --git a/docs/50_data_publication/20_choose_repository/30_chemotion_repo.mdx b/docs/50_data_publication/20_choose_repository/30_chemotion_repo.mdx index 2f0a97a4..6bde55d4 100644 --- a/docs/50_data_publication/20_choose_repository/30_chemotion_repo.mdx +++ b/docs/50_data_publication/20_choose_repository/30_chemotion_repo.mdx @@ -3,13 +3,27 @@ title: "Chemotion Repository" slug: /chemotion_repository --- -# Chemotion Repository – Repository for Samples, Reactions and Research data - -:::info Note: -Link to [Chemotion Repository](https://www.chemotion-repository.net/), Link to [FAIRsharing](https://doi.org/10.25504/FAIRsharing.iagXcR), Link to [re3data](http://doi.org/10.17616/R34P5T). -::: - -## Quick facts +import RepoButton from "@site/src/components/repos/RepoButton"; + +_Repository for Samples, Reactions and Research data_ + + + + + +:::info Quick facts - **Accepted data types:** - Mass spectrometry: mzML, mzXML, JCAMP-DX, vendor formats such as Thermo RAW are accepted and converted to mzML with Proteowizard's msconvert. @@ -22,7 +36,7 @@ Link to [Chemotion Repository](https://www.chemotion-repository.net/), Link to [ - **Data deposition condition:** open - **Recommended by Journals/Societies:** Recommended by [Angewandte Chemie](https://onlinelibrary.wiley.com/page/journal/15213773/homepage/notice-to-authors#sectFDataDeposition) and further Wiley journals. -## Details +::: Chemotion Repository is a **field-specific** repository and covers research data that is assigned to molecules, their properties and characterisation as well as reactions and experimental investigations. It is hosted at Karlsruhe Institute for Technology (KIT). Scientists in the domains of **molecular** and **synthetic chemistry** are supported in their efforts to handle data in a **FAIR** manner: the data is stored according to the common practices of scientists assigned to molecules and reactions and the system provides the required [Digital Object Identifiers](https://www.doi.org/) (DOIs) without additional effort for the scientist. The given metadata is supported by the implementation of ontology terms. The **findability** of the data is achieved by text, structure, and identifier search options and the submitted samples and their structure are referenced in PubChem to gain higher visibility of the work for the scientists. The repository is interoperable with the **Chemotion ELN** which means that data can be transferred from ELN to the repository. Data is curated by [automatic checks](https://www.chemotion-repository.net/home/howto/c40fdb44-8854-46bf-88b3-cc9d6adc3543) and a peer review process. The integration of data stored in the repository in publications was shown with several examples and its usage is currently recommended by [Chemistry—Methods](https://chemistry-europe.onlinelibrary.wiley.com/journal/26289725). Authors can be referenced by their [ORCID iDs](https://orcid.org/). Chemists and materials scientists can publish data for open access (data view) and registered access (dataset contribution and download). Stored data can be searched by chemical structure, author, dataset type, status, identifier, and DOI. The **current AAI solution** is based on an internal user administration (administrator, anonymous and registered user, curator). **Metadata** according to **DataCite** is compliant with the [Open Archives Initiative Protocol for Metadata Harvesting](http://www.openarchives.org/pmh/) **(OAI-PMH)** scheme. The Chemotion Repository offers an internal substance register, spectra viewers (ChemSpectra and NMRium), a structure editor (Ketcher), and their own data converter. diff --git a/docs/50_data_publication/20_choose_repository/40_massbank_eu.mdx b/docs/50_data_publication/20_choose_repository/40_massbank_eu.mdx index 2c55040d..589fec4b 100644 --- a/docs/50_data_publication/20_choose_repository/40_massbank_eu.mdx +++ b/docs/50_data_publication/20_choose_repository/40_massbank_eu.mdx @@ -3,22 +3,30 @@ title: "MassBank EU" slug: "/massbank_eu" --- -import useBaseUrl from "@docusaurus/useBaseUrl"; +import RepoButton from "@site/src/components/repos/RepoButton"; -# MassBank EU – High Quality Mass Spectrometry Reference Database +_High Quality Mass Spectrometry Reference Database_ -:::info Note: -Link to [MassBank EU](https://massbank.eu/) and [RMassBank](https://bioconductor.org/packages/release/bioc/html/RMassBank.html), Link to [FAIRsharing](https://doi.org/10.25504/FAIRsharing.dk451a), Link to [re3data](http://doi.org/10.17616/R3K05Z). -::: + + + -## Quick facts +:::info Quick facts - **Accepted data types:** MassBank format, see [RMassBank](https://bioconductor.org/packages/release/bioc/html/RMassBank.html). - **Used standards/ontologies:** [MassBank Record Format](https://github.com/MassBank/MassBank-web/blob/main/Documentation/MassBankRecordFormat.md) - **Data deposition condition:** open - **Recommended by Journals/Societies:** Official database of the [Mass Spectrometry Society of Japan](https://www.mssj.jp/index_en.html) -## Details +::: MassBank EU is a **field-specific** and the first public repository of **mass spectrometry reference spectra**. Their target user groups in the domains of **chemistry** and **life sciences** are analytical chemists, metabolomics, biochemists, and bioinformaticians. Datasets from community users and projects are **openly accessible** and represent the official database of the [Mass Spectroscopy Society of Japan](https://www.mssj.jp/index_en.html). diff --git a/docs/50_data_publication/20_choose_repository/50_nmrxiv.mdx b/docs/50_data_publication/20_choose_repository/50_nmrxiv.mdx index 038650ae..7564b1b6 100644 --- a/docs/50_data_publication/20_choose_repository/50_nmrxiv.mdx +++ b/docs/50_data_publication/20_choose_repository/50_nmrxiv.mdx @@ -1,40 +1,53 @@ --- +title: "nmrXiv" slug: "/nmrxiv" --- -import useBaseUrl from "@docusaurus/useBaseUrl"; +_Open, FAIR and Consensus-Driven NMR spectroscopy data repository and analysis platform_ -# nmrXiv +import RepoButton from "@site/src/components/repos/RepoButton"; -:::info Note: -Link to [nmrXiv](https://nmrxiv.org/), Link to [FAIRsharing](https://doi.org/10.25504/FAIRsharing.052828), Link to [re3data](http://doi.org/10.17616/R31NJNGJ). -::: + + + -## Quick facts +:::info Quick facts - **Accepted data types:** all major NMR data formats – NMReData, Bruker - **Used standards/ontologies:** [ontologies used](https://docs.nmrxiv.org/introduction/data/ontologies.html) - **Data deposition condition:** open - **Recommended by Journals/Societies:** The repository is recommended by [The Journal of Natural Products](https://pubs.acs.org/doi/10.1021/acs.jnatprod.3c00281) and by [Angewandte Chemie](https://onlinelibrary.wiley.com/page/journal/15213773/homepage/notice-to-authors) -## Details +::: + +### General Information -**General Information** nmrXiv (pronounced nm-archive) is a FAIR and Open, Consensus-Driven Nuclear Magnetic Resonance (NMR) Data Repository and Computational platform. It is currently being developed with the ultimate goal of accelerating broader coordination and data sharing among researchers by creating a platform for managing, sharing, and analyzing raw and processed NMR spectral data. The immediate goal of nmrXiv is to integrate and execute the following objectives by establishing nmrXiv as a consensus-driven resource designed to serve global chemistry research and adjacent natural products / metabolomics communities. -**Software Development** +### Software Development + To develop nmrXiv based on a voluntarily FAIR, cloud-based infrastructure that uses freely shared source code and deployment methods. Apply industry-grade development practices to ensure platform reliability, safety, and efficacy. Use Continuous Improvement principles will ensure an always-on user experience and high reliability. Release the codebase and infrastructure details (including the development, documentation, and usage practices) through MIT Open Source License for openness. More details about the platform architecture and related topics – [here](https://docs.nmrxiv.org/developer-guides/architecture.html) -**Submission, Curation, and Analysis** +### Submission, Curation, and Analysis + Enable the FAIR sharing of raw NMR data to enhance the quality of chemical research and dissemination. Also, to develop non-prescriptivist curation and analysis standards for data and metadata. Build standards with input and contributions from the community and make them compatible with existing and potential newly developed formats and approaches. More details about the data standards and related topics – [here](https://docs.nmrxiv.org/category/data.html) -**Workshops and Training** +### Workshops and Training + To engage analytical chemistry researchers and adjacent communities through webinars, workshops, tutorials, and community calls to ensure that nmrXiv meets the researchers’ needs and implements adequate incentive mechanisms for data contributions and curation. This documentation site comprises detailed walk-through explanations from basic to more complex functionalities for developers (Developer Guides), submitters (Submission Guides) and users (Search and API) of nmrXiv. All the adopted core concepts, such as Data Schemas, NMR File Formats, tools & Converters, Ontologies, FAIR best practices, etc., are documented to ensure a clear scaffolding for developers to revisit previously developed parts and continue building upon them. This documentation-first approach allows developers and users to discuss proposed features and ensure that the implementations reflect the actual use cases. diff --git a/docs/50_data_publication/20_choose_repository/60_nomad.mdx b/docs/50_data_publication/20_choose_repository/60_nomad.mdx index 0ad6975b..b252e513 100644 --- a/docs/50_data_publication/20_choose_repository/60_nomad.mdx +++ b/docs/50_data_publication/20_choose_repository/60_nomad.mdx @@ -3,22 +3,30 @@ title: "NOMAD" slug: "/nomad" --- -import useBaseUrl from "@docusaurus/useBaseUrl"; +import RepoButton from "@site/src/components/repos/RepoButton"; -# NOMAD – NOvel MAterials Discovery +_NOvel MAterials Discovery_ -:::info Note: -Link to [NOMAD](https://nomad-lab.eu/), Link to [FAIRsharing](https://doi.org/10.25504/FAIRsharing.aq20qn), Link to [re3data](http://doi.org/10.17616/R32K89). -::: + + + -## Quick facts +:::info Quick facts - **Accepted data types:** [50 supported codes](https://nomad-lab.eu/prod/v1/gui/about/information) - **Used standards/ontologies:** DataCite; no ontology at the moment (planned to create ontologies for specific parts of the data) - **Data deposition condition:** open - **Recommended by Journals/Societies:** The repository is recommended by [Scientific Data](https://www.nature.com/sdata/policies/repositories#materials), recommended by [Angewandte Chemie](https://onlinelibrary.wiley.com/page/journal/15213773/homepage/notice-to-authors#sectFDataDeposition) and further Wiley journals. -## Details +::: Nomad is a public repository operating since 2015 that is hosted at the MPCDF (Max Planck Computing and Data Facility) in Garching, Munich. It contains over 12 million datasets **(simulations)** generated from over 500 users, 98% of which is published. DOIs are attributed to almost half of them. Their target audience are solid state physicists and theoretical chemists. Data on **computational** materials science, computational **chemistry**, and molecular physics are those typically contained in the repository. There is a simulation data recognition process during upload and the repository supports the input/output formats of 50 different codes. NOMAD offers an API for data import and export. The repository is recommended by [Scientific Data](https://www.nature.com/sdata/policies/repositories#materials) of the Nature publishing group. diff --git a/docs/50_data_publication/20_choose_repository/60_radar4chem.mdx b/docs/50_data_publication/20_choose_repository/60_radar4chem.mdx index a8960c71..dd0c3c6c 100644 --- a/docs/50_data_publication/20_choose_repository/60_radar4chem.mdx +++ b/docs/50_data_publication/20_choose_repository/60_radar4chem.mdx @@ -3,22 +3,34 @@ title: "RADAR4Chem" slug: "/radar4chem" --- -import useBaseUrl from "@docusaurus/useBaseUrl"; - -# RADAR4Chem – Research Data Repository for Chemistry - -:::info Note: -Link to [RADAR4Chem](https://radar4chem.radar-service.eu/), Link to [FAIRsharing](https://doi.org/10.25504/FAIRsharing.3b3157), Link to [re3data](http://doi.org/10.17616/R31NJNAY). -::: - -## Quick facts +import RepoButton from "@site/src/components/repos/RepoButton"; + +_Research Data Repository for Chemistry_ + + + + + +:::info Quick facts - **Accepted data types:** All data types/formats ([format recommendations](https://radar.products.fiz-karlsruhe.de/en/radarabout/dateiformate) exist) - **Used standards/ontologies:** [RADAR Metadata Schema](https://radar.products.fiz-karlsruhe.de/en/radarfeatures/radar-metadatenschema) (based on DataCite Metadata Schema 4.0), Dublin Core, schema.org - **Data deposition condition:** controlled - **Recommended by Journals/Societies:** Recommended by [Angewandte Chemie](https://onlinelibrary.wiley.com/page/journal/15213773/homepage/notice-to-authors#sectFDataDeposition) and further Wiley journals. -## Details +::: RADAR4Chem is a **multidisciplinary** repository for the publication of research data from **all disciplines** of **chemistry**. It was created in 2022 and is hosted at FIZ Karlsruhe (Leibniz Institute for Information Infrastructure). RADAR4Chem is based on the established research data repository **RADAR Cloud**. RADAR Cloud is primarily used by academic institutions for institutional research data management (data archiving and publication). The use of **RADAR Cloud** is subject to a **fee** and requires the stipulation of a **contract**. **RADAR4Chem**, on the other hand, is exclusively directed to researchers in the field of chemistry at publicly funded research institutions and universities in Germany. **No contract** is required and **no fees** are charged. RADAR4Chem allows discipline- and format-independent publication and storage (**at least 25 years**) of **research data** from all disciplines of chemistry. It complements the already existing portfolio of discipline specific repositories and is e.g. ideally suited for cross-disciplinary data or datasets with a multitude of different data formats. RADAR4Chem is easy and low-threshold to use. The researchers are responsible for the upload, organisation, annotation, and curation of research data as well as the peer-review process (as an optional step) and finally their publication. Using the service requires [advising from FIZ Karlsruhe](https://www.nfdi4chem.de/index.php/2650-2/), registration to RADAR4Chem, and consent to the [RADAR4Chem license and usage instructions](https://radar.products.fiz-karlsruhe.de/sites/default/files/radar/docs/terms/License_and_User_Instructions_for_Data_Providers_RADAR4Chem.pdf). Authentication is supported after self-registration and via [DFN-AAI](https://doku.tid.dfn.de/en:dfnaai:start) ([Shibboleth](https://www.incommon.org/software/shibboleth/). **Metadata** are recorded using the internal [RADAR Metadata Schema](https://radar.products.fiz-karlsruhe.de/en/radarfeatures/radar-metadatenschema) (based on [DataCite Metadata Schema 4.0](https://schema.datacite.org/)), which supports 10 **mandatory** and 13 **optional metadata fields**. Annotation can be made on the dataset level and on the individual files and folders level. A [user license](https://radar.products.fiz-karlsruhe.de/en/radarfeatures/lizenzen-fuer-forschungsdaten) which indicates re-use rules for the data, must be defined for each dataset. Each published dataset receives a **DOI** which is registered with [DataCite](https://datacite.org/). RADAR Metadata uses a combination of controlled lists and free text entries. Author identification is ensured by ORCID iD and funder identification by [CrossRef Open Funder Registry](https://www.crossref.org/pdfs/about-funder-registry.pdf) (more interfacing options will be implemented in the future). Datasets can be easily linked with other digital resources (e.g. text publications) via a **“related identifier”**. To maximise data dissemination and discoverability, the metadata of published datasets are indexed in various formats (e.g. RADAR and DataCite) and offered for public metadata harvesting e.g. via an [OAI-provider](https://radar.products.fiz-karlsruhe.de/en/radarfeatures/radar-oai-provider). The **research data** is **stored permanently** on magnetic tapes redundantly in three copies at different locations at the Steinbuch Centre for Computing (SCC) of the Karlsruhe Institute of Technology (KIT, 2 copies) and at the Centre for Information Services and High Performance Computing (ZIH) of the TU Dresden (1 copy). diff --git a/docs/50_data_publication/20_choose_repository/70_strenda_db.mdx b/docs/50_data_publication/20_choose_repository/70_strenda_db.mdx index 00d88f86..c5b3b30c 100644 --- a/docs/50_data_publication/20_choose_repository/70_strenda_db.mdx +++ b/docs/50_data_publication/20_choose_repository/70_strenda_db.mdx @@ -3,22 +3,34 @@ title: "Strenda DB" slug: "/strenda_db" --- -import useBaseUrl from "@docusaurus/useBaseUrl"; - -# STRENDA DB – Repository for Reporting Enzymology Data - -:::info Note: -Link to [STRENDA DB](https://www.beilstein-strenda-db.org/), Link to [FAIRsharing](https://doi.org/10.25504/FAIRsharing.ekj9zx), Link to [re3data](http://doi.org/10.17616/R3536N). -::: - -## Quick facts +import RepoButton from "@site/src/components/repos/RepoButton"; + +_Repository for Reporting Enzymology Data_ + + + + + +:::info Quick facts - **Accepted data types:** Currently none, EnzymeML (in development) - **Used standards/ontologies:** DataCite, InChI, [EnzymeML (in development)](https://enzymeml.org/) - **Data deposition condition:** open - **Recommended by Journals/Societies:** [Archives in Biochemistry and Biophysics](https://www.sciencedirect.com/journal/archives-of-biochemistry-and-biophysics), [Beilstein Journal of Organic Chemistry](https://www.beilstein-journals.org/bjoc/home), [eLife](https://elifesciences.org/), [Molecular Catalysis](https://www.sciencedirect.com/journal/molecular-catalysis), [Nature](https://www.nature.com/) (including Biotechnology, Chemistry, Microbiology, Pharmacology, Systems Biology), [PLoS](https://plos.org/) (relevant journals, e.g. One, Biology, Computational Biology, Medicine), [Scientific Data](https://www.nature.com/sdata/), [The Journal of Biological Chemistry](https://www.jbc.org/), recommended by [Angewandte Chemie](https://onlinelibrary.wiley.com/page/journal/15213773/homepage/notice-to-authors#sectFDataDeposition) and further Wiley journals. -## Details +::: STRENDA DB is a **field-specific** repository for **enzymology** data operated since 2016 and hosted at Beilstein Institute (BI) Frankfurt. It ensures that datasets are complete and valid before scientists submit them as part of a publication. Their target audience is biochemists, systems biologists, biocatalysts in the fields of life sciences, biological, molecular, and food chemists. The typical data contained in this repository consists of **functional enzymology data** (kinetic and experimental data) from manuscripts and publications. Data entered in the STRENDA DB are automatically checked (according to STRENDA Guidelines and a PDF fact sheet with submittable input data), allowing users to receive notifications for necessary but missing information. Currently, more than [55 international biochemistry journals](https://www.beilstein-institut.de/en/projects/strenda/journals/) already include the STRENDA guidelines in their instructions for authors. **DOI** is used as the identification system for citations and ORCID iD as the identification system for authors. Data viewing is possible via open access and data contribution is possible after a required registration where the current **AAI** is provided through an internal user administration (user, administrator). diff --git a/docs/50_data_publication/20_choose_repository/80_suprabank.mdx b/docs/50_data_publication/20_choose_repository/80_suprabank.mdx index 58652db7..0fb0bcad 100644 --- a/docs/50_data_publication/20_choose_repository/80_suprabank.mdx +++ b/docs/50_data_publication/20_choose_repository/80_suprabank.mdx @@ -3,22 +3,28 @@ title: "SupraBank" slug: "/suprabank" --- -import useBaseUrl from "@docusaurus/useBaseUrl"; - -# SupraBank - -:::info Note: -Link to [SupraBank](https://suprabank.org/), Link to [FAIRsharing](https://doi.org/10.25504/FAIRsharing.vjWUT7), Link to [re3data](http://doi.org/10.17616/R31NJMQ9). -::: - -## Quick facts +import RepoButton from "@site/src/components/repos/RepoButton"; + + + + + +:::info Quick facts - **Accepted data types:** JSON (DataCite), CDX (for 2D/3D molecule structure), PNG, proprietary formats - **Used standards/ontologies:** DataCite 4.0, Dublin Core for metadata tags - **Data deposition condition:** open - **Recommended by Journals/Societies:** Recommended by [Angewandte Chemie](https://onlinelibrary.wiley.com/page/journal/15213773/homepage/notice-to-authors#sectFDataDeposition) and further Wiley journals. -## Details +::: SupraBank is hosted at KIT (Karlsruhe) since 2019 and is a curated database that provides project data on **intermolecular interactions of molecular systems** and **supramolecular interactions** which are not available in other repositories or databases. SupraBank is mainly aimed at supramolecular and physical chemists or biologists in the domain of organic chemistry who deal with binding, assembly, and interaction phenomena. Molecular properties are retrieved from PubChem, allowing the correlation of intermolecular interactions parameters to molecular properties of the interacting components. All molecules, solvents, and additives are searchable by their chemical identifiers. At present, SupraBank stores more than 3500 curated datasets of intermolecular interaction parameters. The data has open access for viewing and registered access for data download and contribution. It can be searched for experiments and related components, molecule interactions, and publications while being curated by non-judgemental plausibility checks. The current implementation of AAI consists of internal user administration (anonymous and non-anonymous user, data provider, administrator). DOI is used as the identification system for citations and ORCID iD as the identification system for authors. Its web interface offers file format compatibility with CSV, JSON, BibTex, RIS, and Endnote and its tool suite contains molecule representations as pictures, a structure editor, and a simulation modell tool. diff --git a/docs/50_data_publication/20_choose_repository/90_csd_icsd.mdx b/docs/50_data_publication/20_choose_repository/90_csd_icsd.mdx index af9d8a72..9df23b82 100644 --- a/docs/50_data_publication/20_choose_repository/90_csd_icsd.mdx +++ b/docs/50_data_publication/20_choose_repository/90_csd_icsd.mdx @@ -1,11 +1,23 @@ --- -title: "CSD/ICSD" +title: "CSD / ICSD" slug: "/csd_icsd" --- -import useBaseUrl from "@docusaurus/useBaseUrl"; - -# CSD, ICSD – Joint CCDC/FIZ access structures service +import RepoButton from "@site/src/components/repos/RepoButton"; + +_Joint CCDC/FIZ access structures service_ + + + + :::info Note: Link to [CSD](https://www.ccdc.cam.ac.uk/solutions/software/webcsd/) (requires license) [ICSD](https://icsd.fiz-karlsruhe.de/) (requires license) and [Joint CCDC/FIZ Access Structure](https://www.ccdc.cam.ac.uk/structures/) that provides open access to the CSD Structure Depot, but not all CSD data. From bc41e1eb212c1aeade25be802e5b4235df53d7da Mon Sep 17 00:00:00 2001 From: Johannes Liermann Date: Tue, 7 May 2024 17:01:21 +0200 Subject: [PATCH 4/5] chore: remove heading --- src/components/repos/DecisionTree.js | 38 +++++++++++----------------- 1 file changed, 15 insertions(+), 23 deletions(-) diff --git a/src/components/repos/DecisionTree.js b/src/components/repos/DecisionTree.js index b178aecb..c8608c00 100644 --- a/src/components/repos/DecisionTree.js +++ b/src/components/repos/DecisionTree.js @@ -11,7 +11,7 @@ const DecisionTree = () => { data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" version="1.1" - viewBox="0 0 1280 584" + viewBox="0 85 1280 500" > @@ -169,10 +169,10 @@ const DecisionTree = () => { transform="translate(562.8 229.2)" > - crystal structures of{" "} + crystal structures of - molecular organic and{" "} + molecular organic and inorganic compounds @@ -189,7 +189,7 @@ const DecisionTree = () => { /> - inorganic crystal{" "} + inorganic crystal structures @@ -202,16 +202,16 @@ const DecisionTree = () => { /> - molecules and their{" "} + molecules and their - properties,{" "} + properties, - identification, reactions{" "} + identification, reactions - and experimental{" "} + and experimental investigations @@ -244,7 +244,7 @@ const DecisionTree = () => { /> - nuclear magnetic{" "} + nuclear magnetic resonance (NMR) @@ -276,27 +276,19 @@ const DecisionTree = () => { transform="translate(32.9 218.4)" > - intermolecular and{" "} + intermolecular and - supramolecular{" "} + supramolecular - interactions of{" "} + interactions of molecular systems - - - Deposit your data in a repository - - { transform="translate(697.1 387.6)" > - mass spectrometry{" "} + mass spectrometry reference spectra @@ -346,7 +338,7 @@ const DecisionTree = () => { transform="translate(184.3 531.7)" > - STRENDA{" "} + STRENDA DB @@ -448,7 +440,7 @@ const DecisionTree = () => { transform="translate(1003.9 531.7)" > - Chemotion{" "} + Chemotion Repository From dd2a4dc983c06278948442c7a63013378926b30a Mon Sep 17 00:00:00 2001 From: Johannes Liermann Date: Tue, 7 May 2024 18:02:18 +0200 Subject: [PATCH 5/5] feat: improved interactivity, cleaned up styling --- src/components/repos/DecisionTree.js | 703 +++++++++---------- src/components/repos/DecisionTree.module.css | 100 +-- 2 files changed, 369 insertions(+), 434 deletions(-) diff --git a/src/components/repos/DecisionTree.js b/src/components/repos/DecisionTree.js index c8608c00..768a43c8 100644 --- a/src/components/repos/DecisionTree.js +++ b/src/components/repos/DecisionTree.js @@ -7,272 +7,40 @@ const DecisionTree = () => { return ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - What type of data do you have? - - - - - - - - - - - - - - - simulations - - - - - - - - - - - - - - crystal structures of - - - molecular organic and - - - inorganic compounds - - - - - - - - - - inorganic crystal - - - structures - - - - - - molecules and their - - - properties, - - - identification, reactions - - - and experimental - - - investigations - - - - - - - - - - enzyme kinetics data - - - - - - - - - - nuclear magnetic - - - resonance (NMR) - - - + - SupraBank + What type of data do you have? - - + + + + @@ -288,181 +56,384 @@ const DecisionTree = () => { molecular systems - - - + - - - - - multidisciplinary - - - - - + + + SupraBank + + + - - - - mass spectrometry - - - reference spectra - - - + + + + - STRENDA - - - DB + enzyme kinetics data - - + + + + + STRENDA + + + DB + + + + + + + - RADAR4Chem + multidisciplinary - - + + + + + RADAR4Chem + + + + + + + + + - NOMAD + simulations - - + + + + + + NOMAD + + + + + + + + + - CSD + crystal structures of + + + molecular organic and + + + inorganic compounds - - + + + + + + CSD + + + + + + + + - MassBank EU + inorganic crystal + + + structures - - + + + + + ICSD + + + + + + + - ICSD + molecules and their + + + properties, + + + identification, reactions + + + and experimental + + + investigations - - + + + + - Chemotion + nuclear magnetic - - Repository + + resonance (NMR) - - + + + + + + Chemotion + + + Repository + + + + + + + + nmrXiv + + + + + + + + - nmrXiv + mass spectrometry + + + reference spectra - + + + + + + MassBank EU + + + + ); diff --git a/src/components/repos/DecisionTree.module.css b/src/components/repos/DecisionTree.module.css index b3364f84..672720ff 100644 --- a/src/components/repos/DecisionTree.module.css +++ b/src/components/repos/DecisionTree.module.css @@ -1,92 +1,40 @@ /********** Repo decision tree ************/ -.cls1, -.cls2 { - fill: var(--repo-data-box); -} - -.cls3 { - fill: black; - font-size: 18px; -} - -.cls3, -.cls4 { +svg > * { + transition-duration: 0.4s; font-family: "IBM Plex Sans", sans-serif; font-weight: 300; -} - -.cls2, -.cls5, -.cls6, -.cls7 { - stroke-width: 0px; -} - -.cls8 { - clip-path: url(#clippath-2); -} - -.cls9 { font-size: 21px; } -.cls9, -.cls10 { - font-family: "IBM Plex Sans", sans-serif; - font-weight: 600; -} - -.cls9, -.cls11, -.cls4 { - fill: white; -} - -.cls5, -.cls10 { +.svgBlueBox { fill: var(--ifm-color-primary); } -.cls12 { - clip-path: url(#clippath-1); -} - -.cls13 { - clip-path: url(#clippath-4); +.svgBlueBoxText, +.svgHeadBoxText { + fill: white; } -.cls10 { - font-size: 48px; +.svgHeadBoxText { + font-size: 30px; } -.cls11 { +.svgLine { stroke: var(--repo-line); + stroke-width: 1px; } -.cls14 { - clip-path: url(#clippath); -} - -.cls15 { - fill: none; - stroke: #717171; -} - -.cls16 { - clip-path: url(#clippath-3); -} - -.cls4 { - font-size: 30px; +.svgDescBox { + fill: var(--repo-data-box); } -.cls6, -.cls17 { - fill: var(--ifm-color-primary); +.svgDescText { + fill: black; + font-size: 18px; } -.cls7 { +.svgDescBox { fill: var(--repo-data-box); } @@ -102,3 +50,19 @@ svg > a:hover { text-decoration: none; } + +g.hoverGroup:hover > * { + fill: var(--ifm-color-secondary); + transition-duration: 0.4s; + text-decoration: none; +} + +g.hoverGroup:hover > line { + stroke: var(--ifm-color-secondary); + stroke-width: 3px; +} + +g.hoverGroup:hover > .svgDescText { + fill: white; + transition-duration: 0.4s; +}