From a231272a25b4c50418a45268d1ea8d3d147690c2 Mon Sep 17 00:00:00 2001 From: Joseph Fajen <104791413+joseph-fajen@users.noreply.github.com> Date: Mon, 10 Jun 2024 10:50:50 -0700 Subject: [PATCH] Changed the term "Documentation" to "User guide" in the upper left area of the docs site (#6200) * Styling updates to docusaurus site * Changed the term Documentation to User guide in the upper left corner of the docs site next to the PLUTUS wordmark logo. * Add .yarn to .gitignore --------- Co-authored-by: ianhanssoniohk --- docusaurus/.gitignore | 1 + docusaurus/docusaurus.config.ts | 30 ++----- docusaurus/src/css/custom.css | 124 +++++++++++++++++++++++++- docusaurus/src/theme/Footer/index.js | 29 ++++++ docusaurus/static/img/github.svg | 3 + docusaurus/static/img/logo-footer.svg | 8 ++ 6 files changed, 170 insertions(+), 25 deletions(-) create mode 100644 docusaurus/src/theme/Footer/index.js create mode 100644 docusaurus/static/img/github.svg create mode 100644 docusaurus/static/img/logo-footer.svg diff --git a/docusaurus/.gitignore b/docusaurus/.gitignore index b2d6de30624..7a69b96e6d9 100644 --- a/docusaurus/.gitignore +++ b/docusaurus/.gitignore @@ -18,3 +18,4 @@ npm-debug.log* yarn-debug.log* yarn-error.log* +docusaurus/.yarn/ diff --git a/docusaurus/docusaurus.config.ts b/docusaurus/docusaurus.config.ts index 22cdcfb3410..3bdfc27ebff 100644 --- a/docusaurus/docusaurus.config.ts +++ b/docusaurus/docusaurus.config.ts @@ -82,38 +82,20 @@ const config: Config = { type: "docSidebar", sidebarId: "tutorialSidebar", position: "left", - label: "Documentation", + label: "User guide", }, { - href: "https://github.com/IntersectMBO/plutus", - label: "GitHub", + type: "html", position: "right", + value: + '', }, ], }, footer: { style: "dark", - links: [ - { - title: "Docs", - items: [ - { - label: "User Guide", - to: "/", - }, - ], - }, - { - title: "More", - items: [ - { - label: "GitHub", - href: "https://github.com/IntersectMBO/plutus", - }, - ], - }, - ], - copyright: `Copyright © ${new Date().getFullYear()} IOHK. Built with Docusaurus.`, + links: [], + copyright: `Copyright`, }, prism: { theme: prismThemes.github, diff --git a/docusaurus/src/css/custom.css b/docusaurus/src/css/custom.css index 7aaf14d5e88..d74464d74b8 100644 --- a/docusaurus/src/css/custom.css +++ b/docusaurus/src/css/custom.css @@ -192,7 +192,7 @@ --ifm-link-hover-color: var(--color-plutus-blue-2); --ifm-link-hover-decoration: var(--color-plutus-blue-2); --ifm-menu-color-active: var(--color-plutus-grey-28); - --ifm-navbar-link-hover-color: var(--color-plutus-grey-28); + --ifm-navbar-link-hover-color: #61676f; --ifm-breadcrumb-color-active: var(--color-plutus-grey-28); --ifm-navbar-search-input-placeholder-color: var(--color-plutus-grey-24); @@ -204,6 +204,8 @@ --ifm-color-secondary-darker: var(--color-plutus-grey-20); --ifm-color-secondary-lightest: var(--color-plutus-grey-4); --ifm-color-secondary-darkest: var(--color-plutus-grey-24); + + --ifm-navbar-height: 70px; } :root:root { @@ -248,10 +250,54 @@ html[data-theme="dark"] body { max-width: 35vw; } +@media (min-width: 997px) { + .navbar__brand { + margin-right: -0.25rem; + } + .navbar__logo { + border-right: 1px solid #61676f; + padding-right: 17px; + } +} + .navbar__title { display: none; } +/* Github link */ + +.github-link:before { + background: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E") + no-repeat; + content: ""; + display: flex; + height: 24px; + width: 24px; +} + +html[data-theme="dark"] .github-link:before { + background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='white' d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E") + no-repeat; +} + +.footer .github-link:before { + background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='white' d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E") + no-repeat; + opacity: 0.75; + height: 30px; + width: 30px; +} + +.header-github-link svg { + display: none; +} + +/* Mobile menu */ + +.navbar-sidebar--show div.menu__list-item { + padding: 12px; +} + /* Cards */ .padding--lg { @@ -307,3 +353,79 @@ html[data-theme="dark"] .csv-table-overflow-marker::after { rgba(27, 27, 29, 255) ); } + +/* Footer */ + +.footer { + background: #193d47; + color: #758b91; + font-size: 0.875rem; + font-weight: 500; + padding: 32px 0; + text-align: center; +} + +.footer a { + color: #bac5c8; + font-size: 1rem; +} + +.footer-container { + max-width: 1200px; + padding: 0 16px; + margin: 0 auto; +} + +.footer-logo { + width: 60px; + margin: 0 auto 12px; +} + +.footer-right { + display: flex; + align-items: center; + justify-content: center; + margin-top: 12px; +} +.footer-right > * { + margin-right: 2.5rem; + &:last-child { + margin-right: 0; + } +} + +.footer-left { + display: flex; + flex-direction: column; +} + +@media (min-width: 997px) { + .footer-logo { + margin-bottom: 0; + } + + .footer { + padding: 46px 0; + } + + .footer-left { + flex-direction: row; + align-items: center; + } + + .footer-left > * { + margin-right: 2.5rem; + &:last-child { + margin-right: 0; + } + } + + .footer-right { + margin-top: 0; + } + + .footer-container { + display: flex; + justify-content: space-between; + } +} diff --git a/docusaurus/src/theme/Footer/index.js b/docusaurus/src/theme/Footer/index.js new file mode 100644 index 00000000000..906aa720a6a --- /dev/null +++ b/docusaurus/src/theme/Footer/index.js @@ -0,0 +1,29 @@ +import React from "react"; +import useBaseUrl from "@docusaurus/useBaseUrl"; + +export default function Footer(props) { + return ( + + ); +} diff --git a/docusaurus/static/img/github.svg b/docusaurus/static/img/github.svg new file mode 100644 index 00000000000..316f5b2d16f --- /dev/null +++ b/docusaurus/static/img/github.svg @@ -0,0 +1,3 @@ + + + diff --git a/docusaurus/static/img/logo-footer.svg b/docusaurus/static/img/logo-footer.svg new file mode 100644 index 00000000000..360a2c74c32 --- /dev/null +++ b/docusaurus/static/img/logo-footer.svg @@ -0,0 +1,8 @@ + + + + + + + +