docusaurus dark mode
This commit is contained in:
@@ -23,35 +23,35 @@ You can learn more about Medusa's architecture in [our introduction](/introducti
|
||||
|
||||

|
||||
|
||||
<div class="container" style={{ padding: 0 }}>
|
||||
<div class="row is-multiline">
|
||||
<div class="col col--6">
|
||||
<Link class="card" to="/tutorial/set-up-your-development-environment" style={{ height: '100%' }}>
|
||||
<div class="card__body">
|
||||
<div className="container" style={{ padding: 0 }}>
|
||||
<div className="row is-multiline">
|
||||
<div className="col col--6">
|
||||
<Link className="card box-link" to="/tutorial/set-up-your-development-environment" style={{ height: '100%' }}>
|
||||
<div className="card__body">
|
||||
<h4>Tutorial</h4>
|
||||
<p>Set up your local development environment</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div class="col col--6">
|
||||
<Link class="card" to="/tutorial/adding-custom-functionality" style={{ height: '100%' }}>
|
||||
<div class="card__body">
|
||||
<div className="col col--6">
|
||||
<Link className="card box-link" to="/tutorial/adding-custom-functionality" style={{ height: '100%' }}>
|
||||
<div className="card__body">
|
||||
<h4>Make it your own</h4>
|
||||
<p>Create custom endpoints, services, or subscribers.</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div class="col col--6">
|
||||
<Link class="card" to="/guides/plugins" style={{ height: '100%' }}>
|
||||
<div class="card__body">
|
||||
<div className="col col--6">
|
||||
<Link className="card box-link" to="/guides/plugins" style={{ height: '100%' }}>
|
||||
<div className="card__body">
|
||||
<h4>Plugins</h4>
|
||||
<p>Add or build a plugin to make your engine more powerful.</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div class="col col--6">
|
||||
<Link class="card" to="/how-to/deploying-on-heroku" style={{ height: '100%' }}>
|
||||
<div class="card__body">
|
||||
<div className="col col--6">
|
||||
<Link className="card box-link" to="/how-to/deploying-on-heroku" style={{ height: '100%' }}>
|
||||
<div className="card__body">
|
||||
<h4>Deploy in seconds</h4>
|
||||
<p>Use one of our guides to deploy your Medusa project in seconds.</p>
|
||||
</div>
|
||||
@@ -66,28 +66,28 @@ Visit our [Quickstart](https://github.com/medusajs/medusa#-quickstart) to get up
|
||||
|
||||
## What you'll find here
|
||||
|
||||
<div class="container" style={{ padding: 0 }}>
|
||||
<div class="row is-multiline">
|
||||
<div class="col col--4">
|
||||
<Link class="card" to="/quickstart/quick-start" style={{ height: '100%' }}>
|
||||
<div class="card__body">
|
||||
<div className="container" style={{ padding: 0 }}>
|
||||
<div className="row is-multiline">
|
||||
<div className="col col--4">
|
||||
<Link className="card box-link" to="/quickstart/quick-start" style={{ height: '100%' }}>
|
||||
<div className="card__body">
|
||||
<h4>Quickstart</h4>
|
||||
<p>A short guide to get you quickly started.</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div class="col col--4">
|
||||
<Link class="card" to="/how-to/notification-api" style={{ height: '100%' }}>
|
||||
<div class="card__body">
|
||||
<div className="col col--4">
|
||||
<Link className="card box-link" to="/how-to/notification-api" style={{ height: '100%' }}>
|
||||
<div className="card__body">
|
||||
<h4>How-to and guides</h4>
|
||||
<p>Guides and walkthroughs of concepts, tools, deployment and APIs.</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
{/* Ref */}
|
||||
<div class="col col--4">
|
||||
<a class="card" href="https://docs.medusajs.com/api/store" target="_blank" style={{ height: '100%' }}>
|
||||
<div class="card__body">
|
||||
<div className="col col--4">
|
||||
<a className="card box-link" href="https://docs.medusajs.com/api/store" target="_blank" style={{ height: '100%' }}>
|
||||
<div className="card__body">
|
||||
<h4>Reference</h4>
|
||||
<p>Technical documentation of the Medusa API.</p>
|
||||
</div>
|
||||
|
||||
@@ -27,7 +27,8 @@ module.exports = {
|
||||
themeConfig: {
|
||||
colorMode: {
|
||||
defaultMode: 'light',
|
||||
disableSwitch: true,
|
||||
disableSwitch: false,
|
||||
respectPrefersColorScheme: true,
|
||||
},
|
||||
algolia: {
|
||||
apiKey: algoliaApiKey,
|
||||
@@ -45,9 +46,9 @@ module.exports = {
|
||||
navbar: {
|
||||
hideOnScroll: true,
|
||||
logo: {
|
||||
alt: "Medusa Commerce",
|
||||
alt: "Medusa",
|
||||
src: "img/logo.svg",
|
||||
srcDark: "img/logo.svg",
|
||||
srcDark: "img/logo-dark.svg",
|
||||
width: 100
|
||||
},
|
||||
items: [
|
||||
|
||||
@@ -10,13 +10,13 @@
|
||||
|
||||
:root {
|
||||
/* Colors */
|
||||
--ifm-color-primary: #0a3149;
|
||||
--ifm-color-primary-dark: #0a3149;
|
||||
--ifm-color-primary-darker: #0a3149;
|
||||
--ifm-color-primary-darkest: #0a3149;
|
||||
--ifm-color-primary-light: #0a3149;
|
||||
--ifm-color-primary-lighter: #0a3149;
|
||||
--ifm-color-primary-lightest: #0a3149;
|
||||
--ifm-color-primary: #7C53FF;
|
||||
--ifm-color-primary-dark: #6231ff;
|
||||
--ifm-color-primary-darker: #5520ff;
|
||||
--ifm-color-primary-darkest: #3800ed;
|
||||
--ifm-color-primary-light: #9675ff;
|
||||
--ifm-color-primary-lighter: #a386ff;
|
||||
--ifm-color-primary-lightest: #c9b8ff;
|
||||
--ifm-medusa-gray: #f0f0f0;
|
||||
|
||||
/* Fonts */
|
||||
@@ -33,21 +33,39 @@
|
||||
--ifm-toc-border-color: #f0f0f0;
|
||||
--ifm-toc-link-color: #a6acb5;
|
||||
--ifm-toc-padding-horizontal: 9px;
|
||||
}
|
||||
|
||||
html:not([data-theme="dark"]) {
|
||||
/* Navbar */
|
||||
--ifm-navbar-shadow: 0px 1px 0px 0px #a6acb5;
|
||||
}
|
||||
|
||||
html[data-theme="dark"] {
|
||||
--ifm-color-primary-dark: #ff4848;
|
||||
--ifm-color-primary: #ff4242;
|
||||
--ifm-background-color: #1f1f1f;
|
||||
--ifm-background-surface-color: #1f1f1f;
|
||||
--ifm-navbar-background-color: #242526;
|
||||
/* --ifm-color-primary: #7C53FF; */
|
||||
--ifm-color-primary-dark: #6231ff;
|
||||
--ifm-color-primary-darker: #5520ff;
|
||||
--ifm-color-primary-darkest: #3800ed;
|
||||
--ifm-color-primary: #9675ff;
|
||||
--ifm-color-primary-lighter: #a386ff;
|
||||
--ifm-color-primary-lightest: #c9b8ff;
|
||||
--ifm-background-color: var(--ifm-color-gray-900);
|
||||
--ifm-background-surface-color: var(--ifm-color-gray-900);
|
||||
--ifm-medusa-gray: #292929;
|
||||
--ifm-menu-color: #fff;
|
||||
--ifm-toc-border-color: #333;
|
||||
}
|
||||
|
||||
[data-theme="dark"] .breadcrumbs__item--active a {
|
||||
background-color: var(--ifm-color-gray-800) !important;
|
||||
color: var(--ifm-color-primary-lightest) !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
[data-theme="dark"] pre code {
|
||||
background-color: var(--ifm-code-background);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
@@ -92,6 +110,15 @@ html[data-theme="dark"] .docusaurus-highlight-code-line {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
html[data-theme="dark"] footer:not(.theme-doc-footer) {
|
||||
background-color: var(--ifm-color-gray-800);
|
||||
}
|
||||
|
||||
html[data-theme="dark"] .card {
|
||||
border: 1px solid #fff;
|
||||
color: var(--ifm-color-primary);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
z-index: 1000;
|
||||
font-size: 14px;
|
||||
@@ -183,7 +210,6 @@ a.menu__link--sublist::after {
|
||||
|
||||
.menu__list-item > a {
|
||||
font-weight: 450;
|
||||
color: #1f1f1f;
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
@@ -221,7 +247,7 @@ footer .footer__title {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
footer {
|
||||
html:not([data-theme="dark"]) footer {
|
||||
background-color: #ffffff !important;
|
||||
border-top: 1px solid var(--ifm-toc-border-color);
|
||||
}
|
||||
@@ -232,7 +258,7 @@ footer {
|
||||
|
||||
/* Cards */
|
||||
|
||||
.card {
|
||||
html:not([data-theme=dark]) .card {
|
||||
border: 1px solid #1f1f1f;
|
||||
border-radius: 8px;
|
||||
}
|
||||
@@ -258,11 +284,12 @@ details summary {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.theme-doc-markdown a {
|
||||
color: #9461ff;
|
||||
.theme-doc-markdown a:not(.box-link):hover {
|
||||
color: var(--ifm-color-primary-darkest);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.theme-doc-markdown a:hover {
|
||||
color: #6e3eff;
|
||||
text-decoration: none;
|
||||
.box-link,
|
||||
.box-link:hover {
|
||||
color: #0a3149;
|
||||
}
|
||||
15
www/docs/static/img/logo-dark.svg
vendored
Normal file
15
www/docs/static/img/logo-dark.svg
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
<svg width="408" height="96" viewBox="0 0 408 96" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M160.04 69H151V45.56C151 42.9466 150.36 40.8933 149.08 39.4C147.8 37.8533 146.04 37.08 143.8 37.08C141.24 37.08 139.24 37.9333 137.8 39.64C136.413 41.3467 135.72 43.6933 135.72 46.68V69H126.6V29.8H135.56V33.24C138.013 30.3066 141.4 28.84 145.72 28.84C150.573 28.84 154.226 30.5466 156.68 33.96C159.72 30.5466 163.8 28.84 168.92 28.84C174.04 28.84 177.906 30.3333 180.52 33.32C183.186 36.2533 184.52 40.5466 184.52 46.2V69H175.4V45.56C175.4 42.9466 174.76 40.8933 173.48 39.4C172.2 37.8533 170.44 37.08 168.2 37.08C165.64 37.08 163.64 37.96 162.2 39.72C160.76 41.4266 160.04 43.7467 160.04 46.68V69Z" fill="white"/>
|
||||
<path d="M228.886 48.92L228.806 52.12H202.006C202.22 55.0533 203.26 57.3733 205.126 59.08C206.993 60.7866 209.393 61.64 212.326 61.64C216.54 61.64 219.9 59.8 222.406 56.12L228.566 61.88C224.406 67.2133 218.993 69.88 212.326 69.88C206.406 69.88 201.66 68.0133 198.086 64.28C194.46 60.4933 192.646 55.6133 192.646 49.64C192.646 43.8267 194.3 38.8933 197.606 34.84C200.966 30.84 205.42 28.84 210.966 28.84C216.886 28.84 221.34 30.8133 224.326 34.76C227.366 38.7067 228.886 43.4267 228.886 48.92ZM211.046 37.16C208.753 37.16 206.86 37.88 205.366 39.32C203.926 40.76 202.966 42.6 202.486 44.84H219.206C219.153 42.6533 218.433 40.84 217.046 39.4C215.66 37.9067 213.66 37.16 211.046 37.16Z" fill="white"/>
|
||||
<path d="M255.751 28.84C260.124 28.84 263.778 30.12 266.711 32.68V12.92H275.831V69H266.871V65.48C264.098 68.4133 260.391 69.88 255.751 69.88C250.204 69.88 245.618 67.96 241.991 64.12C238.418 60.2267 236.631 55.32 236.631 49.4C236.631 43.48 238.418 38.5733 241.991 34.68C245.564 30.7867 250.151 28.84 255.751 28.84ZM264.071 40.44C262.204 38.0933 259.644 36.92 256.391 36.92C253.138 36.92 250.578 38.0933 248.711 40.44C246.844 42.7866 245.911 45.7733 245.911 49.4C245.911 53.0267 246.844 56.0133 248.711 58.36C250.578 60.7067 253.138 61.88 256.391 61.88C259.644 61.88 262.204 60.7067 264.071 58.36C265.938 56.0133 266.871 53.0267 266.871 49.4C266.871 45.7733 265.938 42.7866 264.071 40.44Z" fill="white"/>
|
||||
<path d="M285.872 29.8H294.992V53.24C294.992 55.8533 295.632 57.9333 296.912 59.48C298.192 60.9733 300.005 61.72 302.352 61.72C304.859 61.72 306.832 60.84 308.272 59.08C309.765 57.2667 310.512 54.8666 310.512 51.88V29.8H319.632V69H310.672V65.8C308.165 68.52 304.779 69.88 300.512 69.88C296.032 69.88 292.459 68.36 289.792 65.32C287.179 62.2267 285.872 57.9866 285.872 52.6V29.8Z" fill="white"/>
|
||||
<path d="M346.658 54.2L341.458 52.92C333.512 51.0533 329.538 46.92 329.538 40.52C329.538 37 330.872 34.1733 333.538 32.04C336.205 29.9067 339.645 28.84 343.858 28.84C349.512 28.84 354.445 31.0266 358.658 35.4L352.818 41.64C350.418 38.3333 347.352 36.68 343.618 36.68C342.018 36.68 340.712 37.0533 339.698 37.8C338.738 38.4933 338.258 39.3467 338.258 40.36C338.258 42.1733 339.538 43.4 342.098 44.04L348.258 45.48C356.258 47.2933 360.258 51.3733 360.258 57.72C360.258 61.3467 358.872 64.28 356.098 66.52C353.378 68.76 349.592 69.88 344.738 69.88C337.912 69.88 332.498 67.3466 328.498 62.28L334.258 56.36C337.138 60.1467 340.872 62.04 345.458 62.04C349.458 62.04 351.458 60.7067 351.458 58.04C351.458 56.3333 349.858 55.0533 346.658 54.2Z" fill="white"/>
|
||||
<path d="M379.911 69.88C376.124 69.88 372.978 68.8133 370.471 66.68C367.964 64.4933 366.711 61.5867 366.711 57.96C366.711 53.8 368.204 50.5733 371.191 48.28C374.178 45.9866 378.124 44.84 383.031 44.84C385.484 44.84 388.124 45.2933 390.951 46.2V43.56C390.951 41.64 390.231 40.0933 388.791 38.92C387.351 37.6933 385.511 37.08 383.271 37.08C379.164 37.08 376.071 38.9733 373.991 42.76L367.831 37C369.271 34.3867 371.378 32.3867 374.151 31C376.978 29.56 380.044 28.84 383.351 28.84C388.524 28.84 392.604 30.12 395.591 32.68C398.578 35.24 400.071 38.8933 400.071 43.64V69H391.111V65.96C388.178 68.5733 384.444 69.88 379.911 69.88ZM375.831 57.32C375.831 58.6533 376.338 59.7467 377.351 60.6C378.418 61.4533 379.884 61.88 381.751 61.88C385.591 61.88 388.658 60.76 390.951 58.52V54.04C388.071 52.9733 385.351 52.44 382.791 52.44C380.658 52.44 378.951 52.8666 377.671 53.72C376.444 54.5733 375.831 55.7733 375.831 57.32Z" fill="white"/>
|
||||
<path d="M77.707 15.5831L56.0329 3.0766C48.9414 -1.02553 40.2518 -1.02553 33.1603 3.0766L11.3864 15.5831C4.39474 19.6853 0 27.2892 0 35.3934V60.5065C0 68.7108 4.39474 76.2147 11.3864 80.3168L33.0604 92.9234C40.1519 97.0255 48.8415 97.0255 55.933 92.9234L77.6071 80.3168C84.6986 76.2147 88.9935 68.7108 88.9935 60.5065V35.3934C89.1932 27.2892 84.7985 19.6853 77.707 15.5831ZM44.5467 70.3116C32.2614 70.3116 22.2733 60.3064 22.2733 48C22.2733 35.6936 32.2614 25.6884 44.5467 25.6884C56.832 25.6884 66.9199 35.6936 66.9199 48C66.9199 60.3064 56.9318 70.3116 44.5467 70.3116Z" fill="url(#paint0_linear_593_870)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_593_870" x1="0" y1="96" x2="107.4" y2="66.105" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#7C53FF"/>
|
||||
<stop offset="1" stop-color="#F796FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.9 KiB |
Reference in New Issue
Block a user