tfgrid/www_docs_threefold_io
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

development_colors #42

Merged
mik-tf merged 2 commits from development_colors into main 2024-11-20 16:58:50 +00:00
Conversation 0 Commits 2 Files Changed 2 +46 -13
2 changed files with 46 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 808a93dea0 - Show all commits

4
docs_website/docusaurus.config.ts
View File

@ -87,7 +87,7 @@ const config: Config = {
},
colorMode: {
defaultMode: 'light',
defaultMode: 'dark',
disableSwitch: false,
respectPrefersColorScheme: false,
},
@ -202,7 +202,7 @@ const config: Config = {
},
{
label: 'Gitea',
href: 'https://git.ourworld.tf/',
href: 'https://github.com/threefoldtech/home',
},
],
},

55
docs_website/src/css/custom.css
View File

@ -6,7 +6,7 @@
/* You can override the default Infima variables here. */
:root {
--ifm-color-primary: #2e83ff;
--ifm-color-primary: #265fb4a6;
--ifm-color-primary-dark: #29784c;
--ifm-color-primary-darker: #277148;
--ifm-color-primary-darkest: #205d3b;
@ -14,29 +14,62 @@
--ifm-color-primary-lighter: #359962;
--ifm-color-primary-lightest: #3cad6e;
--ifm-code-font-size: 95%;
--svg-fill-color: #2a2021; /* Black fill for light mode */
--svg-fill-color: #141515; /* Black fill for light mode */
--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
.footer {
background-color: #ffffff;
}
.footer a,
.footer p,
.footer span,
.footer div {
color: #131213; /* Example: Light gray text for dark mode */
}
img.svg-icon {
fill: var(--svg-fill-color); /* Apply the color variable */
}
.navbar { /* or .navbar--fixedTop if it has that class */
background-color: #ffffff;
}
.navbar__link { /* Example: for navbar links */
color: #131213;
}
}
/* Dark mode styles */
html[data-theme="dark"] {
--svg-fill-color: #fff; /* White fill for dark mode */
--svg-fill-color: #fffff; /* White fill for dark mode */
}
/* For readability concerns, you should choose a lighter palette in dark mode. */
[data-theme='dark'] {
--ifm-color-primary: #2e83ff;
--ifm-color-primary: #8da5c9c0;
--ifm-color-primary-dark: #21af90;
--ifm-color-primary-darker: #1fa588;
--ifm-color-primary-darkest: #1a8870;
--ifm-color-primary-darkest: #1dcfa9;
--ifm-color-primary-light: #29d5b0;
--ifm-color-primary-lighter: #32d8b4;
--ifm-color-primary-lightest: #4fddbf;
--svg-fill-color: #fff; /* White fill for dark mode */
--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
}
img.svg-icon {
fill: var(--svg-fill-color); /* Apply the color variable */
--svg-fill-color: #fffff; /* White fill for dark mode */
--docusaurus-highlighted-code-line-bg: #141515;
.footer {
background-color: #131213;
}
.footer a,
.footer p,
.footer span,
.footer div {
color: #ffffff; /* Example: Light gray text for dark mode */
}
img.svg-icon {
fill: var(--svg-fill-color); /* Apply the color variable */
}
.navbar { /* or .navbar--fixedTop if it has that class */
background-color: #131213;
}
.navbar__link { /* Example: for navbar links */
color: #ffffff;
}
}