Skip to content

Commit

Permalink
change: base colors of docusaurus and add menu item documentation
Browse files Browse the repository at this point in the history
  • Loading branch information
@m-benamor
m-benamor committed Sep 27, 2024
1 parent 6ab036f commit cca4cd6
Show file tree
Hide file tree
Showing 4 changed files with 55 additions and 19 deletions.
16 changes: 13 additions & 3 deletions .idea/workspace.xml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

21 changes: 13 additions & 8 deletions mainzelliste-doc/docusaurus.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,10 +60,10 @@ const config: Config = {
image: 'img/mainzelliste-logo.jpg',
navbar: {
hideOnScroll: false,
title: 'My Site',
logo: {
alt: 'My Site Logo',
src: 'img/logo.svg',
alt: 'Mainzelliste Logo',
src: 'img/mainzelliste-logo.png',
href: 'https://medicalinformatics.github.io/mainzelliste.de/'
},
items: [
{
Expand All @@ -73,13 +73,18 @@ const config: Config = {
label: 'Tutorial',
},
// {to: '/blog', label: 'Blog', position: 'left'},
// {
// href: 'https://github.com/facebook/docusaurus',
// label: 'GitHub',
// position: 'right',
// },
{
href: 'https://medicalinformatics.github.io/mainzelliste.de/api-doc/',
label: 'API Doc',
position: 'right',
},
],
},
colorMode: {
defaultMode: 'light',
disableSwitch: true,
respectPrefersColorScheme: false,
},
footer: {
style: 'dark',
links: [
Expand Down
14 changes: 7 additions & 7 deletions mainzelliste-doc/src/css/custom.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,13 @@

/* You can override the default Infima variables here. */
:root {
--ifm-color-primary: #2e8555;
--ifm-color-primary-dark: #29784c;
--ifm-color-primary-darker: #277148;
--ifm-color-primary-darkest: #205d3b;
--ifm-color-primary-light: #33925d;
--ifm-color-primary-lighter: #359962;
--ifm-color-primary-lightest: #3cad6e;
--ifm-color-primary: #2a4ea3;
--ifm-color-primary-dark: #22428d;
--ifm-color-primary-darker: #1c3672;
--ifm-color-primary-darkest: #1D2430;
--ifm-color-primary-light: #3053a4;
--ifm-color-primary-lighter: #3b60b6;
--ifm-color-primary-lightest: #547ad2;
--ifm-code-font-size: 95%;
--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
}
Expand Down
23 changes: 22 additions & 1 deletion src/components/Header/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,13 +32,15 @@ const Header = () => {
let $features: HTMLElement;
let $contact: HTMLElement;
let $apiDoc: HTMLElement;
let $docs: HTMLElement;

if (typeof document !== 'undefined') {
sections = document.querySelectorAll("section[id]");
$home = document.getElementById('home_');
$features = document.getElementById('features_');
$contact = document.getElementById('contact_');
$apiDoc = document.getElementById('apiDoc_');
$docs = document.getElementById('docs_');
window.addEventListener("scroll", navHighlighter);
}

Expand Down Expand Up @@ -70,28 +72,39 @@ const Header = () => {
$features.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$contact.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$apiDoc.className = "flex items-center text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$docs.className = "flex items-center text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
break;
}
case "features": {
$home.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$features.className = "text-primary dark:text-white"
$contact.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$apiDoc.className = "flex items-center text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$docs.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
break;
}
case "contact": {
$home.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$features.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$contact.className = "text-primary dark:text-white"
$apiDoc.className = "flex items-center text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$docs.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
break;
}
case "apiDoc": {
$home.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$features.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$contact.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
// "flex items-center py-2 text-lg lg:mr-0 lg:inline-flex lg:px-0 lg:py-6 transition-transform cursor-pointer"
$apiDoc.className = "flex items-center text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$docs.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
break;
}
case "docs": {
$home.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$features.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$contact.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$apiDoc.className = "flex items-center text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
$docs.className = "text-dark hover:text-primary dark:text-white/70 dark:hover:text-white"
break;
}
default: {
Expand Down Expand Up @@ -182,6 +195,14 @@ const Header = () => {
</li>
))}
<li key={menuData.length} className="group relative">
<Link
id={"docs_"}
href="/docs"
target="_blank"
className="py-2 text-lg lg:mr-0 lg:inline-flex lg:px-0 lg:py-6 transition-transform cursor-pointer"
>Documentation</Link>
</li>
<li key={menuData.length + 1} className="group relative">
<Link
id={"apiDoc_"}
href="/api-doc"
Expand Down

0 comments on commit cca4cd6

Please sign in to comment.