From 239bd8f69e01c0a06da378fc0930333fb500c3e9 Mon Sep 17 00:00:00 2001 From: hemarina Date: Mon, 9 Oct 2023 16:18:48 -0700 Subject: [PATCH] custom navbar --- website/docusaurus.config.js | 39 ++++--- website/src/css/custom.css | 19 ---- website/src/theme/ColorModeToggle/index.js | 58 ++++++++++ .../theme/ColorModeToggle/styles.module.css | 28 +++++ website/src/theme/Icon/DarkMode/index.js | 11 ++ website/src/theme/Icon/LightMode/index.js | 11 ++ .../src/theme/Navbar/ColorModeToggle/index.js | 22 ++++ .../Navbar/ColorModeToggle/styles.module.css | 3 + website/src/theme/Navbar/Content/index.js | 105 ++++++++++++++++++ .../theme/Navbar/Content/styles.module.css | 8 ++ website/src/theme/Navbar/Layout/index.js | 52 +++++++++ .../src/theme/Navbar/Layout/styles.module.css | 7 ++ website/src/theme/Navbar/Logo/index.js | 11 ++ .../Navbar/MobileSidebar/Header/index.js | 31 ++++++ .../Navbar/MobileSidebar/Layout/index.js | 22 ++++ .../Navbar/MobileSidebar/PrimaryMenu/index.js | 27 +++++ .../MobileSidebar/SecondaryMenu/index.js | 30 +++++ .../Navbar/MobileSidebar/Toggle/index.js | 22 ++++ .../src/theme/Navbar/MobileSidebar/index.js | 23 ++++ website/src/theme/Navbar/Search/index.js | 6 + .../src/theme/Navbar/Search/styles.module.css | 13 +++ website/src/theme/Navbar/index.js | 10 ++ website/src/theme/Root.js | 6 + website/static/img/github.svg | 10 ++ website/static/img/githubLight.svg | 10 ++ website/static/img/verticalBlackLine.svg | 3 + website/static/img/verticalWhiteLine.svg | 3 + 27 files changed, 551 insertions(+), 39 deletions(-) create mode 100644 website/src/theme/ColorModeToggle/index.js create mode 100644 website/src/theme/ColorModeToggle/styles.module.css create mode 100644 website/src/theme/Icon/DarkMode/index.js create mode 100644 website/src/theme/Icon/LightMode/index.js create mode 100644 website/src/theme/Navbar/ColorModeToggle/index.js create mode 100644 website/src/theme/Navbar/ColorModeToggle/styles.module.css create mode 100644 website/src/theme/Navbar/Content/index.js create mode 100644 website/src/theme/Navbar/Content/styles.module.css create mode 100644 website/src/theme/Navbar/Layout/index.js create mode 100644 website/src/theme/Navbar/Layout/styles.module.css create mode 100644 website/src/theme/Navbar/Logo/index.js create mode 100644 website/src/theme/Navbar/MobileSidebar/Header/index.js create mode 100644 website/src/theme/Navbar/MobileSidebar/Layout/index.js create mode 100644 website/src/theme/Navbar/MobileSidebar/PrimaryMenu/index.js create mode 100644 website/src/theme/Navbar/MobileSidebar/SecondaryMenu/index.js create mode 100644 website/src/theme/Navbar/MobileSidebar/Toggle/index.js create mode 100644 website/src/theme/Navbar/MobileSidebar/index.js create mode 100644 website/src/theme/Navbar/Search/index.js create mode 100644 website/src/theme/Navbar/Search/styles.module.css create mode 100644 website/src/theme/Navbar/index.js create mode 100644 website/src/theme/Root.js create mode 100644 website/static/img/github.svg create mode 100644 website/static/img/githubLight.svg create mode 100644 website/static/img/verticalBlackLine.svg create mode 100644 website/static/img/verticalWhiteLine.svg diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index aeb08268..cf9a9fab 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -73,15 +73,20 @@ const config = { width: 32, height: 32, }, - - // style: "primary", - items: [ - // FIXME: TEMPORARILY DISABLE DOCS, BLOG - //{ label: "Tutorial", position: "left", type: "doc", docId: "intro",}, - //{ to: '/blog', label: 'Blog', position: 'left'}, + { href: "/", label: "Templates", position: "left" }, - { to: "/about", label: "About", position: "left" }, + { to: "/about", label: "Getting Started", position: "left" }, + { + to: "https://learn.microsoft.com/azure/developer/azure-developer-cli/", + label: "Docs", + position: "left", + }, + { + to: "https://learn.microsoft.com/azure/architecture/browse/", + label: "Resources", + position: "left", + }, { label: "Contribute", position: "left", @@ -92,20 +97,14 @@ const config = { // CONFIG: // Make sure you have class defined in src/css/custom.css { - to: "https://learn.microsoft.com/azure/architecture/browse/", - label: "Architectures", - position: "right", - }, - { - to: "https://learn.microsoft.com/azure/developer/azure-developer-cli/", - label: "Docs", - position: "right", - }, - { - href: "https://github.com/azure/awesome-azd", + to: "https://azure.github.io/awesome-azd/docs/intro", + label: "Submit your template!", position: "right", - className: "header-github-link", - "aria-label": "GitHub repository", + className: "button", + style: { + backgroundColor: "#7160E8", + color: "white", + }, }, ], }, diff --git a/website/src/css/custom.css b/website/src/css/custom.css index 8aae739f..f73216aa 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -37,25 +37,6 @@ color: black; } -.header-github-link:hover { - opacity: 0.6; -} - -.header-github-link::before { - content: ''; - width: 24px; - height: 24px; - display: flex; - 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; -} - -[data-theme='dark'] .header-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; -} - - .docusaurus-highlight-code-line { background-color: rgba(0, 0, 0, 0.1); display: block; diff --git a/website/src/theme/ColorModeToggle/index.js b/website/src/theme/ColorModeToggle/index.js new file mode 100644 index 00000000..b9a44d32 --- /dev/null +++ b/website/src/theme/ColorModeToggle/index.js @@ -0,0 +1,58 @@ +import React from 'react'; +import clsx from 'clsx'; +import useIsBrowser from '@docusaurus/useIsBrowser'; +import {translate} from '@docusaurus/Translate'; +import IconLightMode from '@theme/Icon/LightMode'; +import IconDarkMode from '@theme/Icon/DarkMode'; +import styles from './styles.module.css'; +function ColorModeToggle({className, buttonClassName, value, onChange, github}) { + + const isBrowser = useIsBrowser(); + const title = translate( + { + message: 'Switch between dark and light mode (currently {mode})', + id: 'theme.colorToggle.ariaLabel', + description: 'The ARIA label for the navbar color mode toggle', + }, + { + mode: + value === 'dark' + ? translate({ + message: 'dark mode', + id: 'theme.colorToggle.ariaLabel.mode.dark', + description: 'The name for the dark color mode', + }) + : translate({ + message: 'light mode', + id: 'theme.colorToggle.ariaLabel.mode.light', + description: 'The name for the light color mode', + }), + }, + ); + return ( +
+ +
+ ); +} +export default React.memo(ColorModeToggle); diff --git a/website/src/theme/ColorModeToggle/styles.module.css b/website/src/theme/ColorModeToggle/styles.module.css new file mode 100644 index 00000000..8459fc79 --- /dev/null +++ b/website/src/theme/ColorModeToggle/styles.module.css @@ -0,0 +1,28 @@ +.toggle { + width: 2rem; + height: 2rem; +} + +.toggleButton { + -webkit-tap-highlight-color: transparent; + align-items: center; + display: flex; + justify-content: center; + width: 100%; + height: 100%; + border-radius: 50%; + transition: background var(--ifm-transition-fast); +} + +.toggleButton:hover { + background: var(--ifm-color-emphasis-200); +} + +[data-theme='light'] .darkToggleIcon, +[data-theme='dark'] .lightToggleIcon { + display: none; +} + +.toggleButtonDisabled { + cursor: not-allowed; +} diff --git a/website/src/theme/Icon/DarkMode/index.js b/website/src/theme/Icon/DarkMode/index.js new file mode 100644 index 00000000..5a5bc0d7 --- /dev/null +++ b/website/src/theme/Icon/DarkMode/index.js @@ -0,0 +1,11 @@ +import React from 'react'; +export default function IconDarkMode(props) { + return ( + + + + ); +} diff --git a/website/src/theme/Icon/LightMode/index.js b/website/src/theme/Icon/LightMode/index.js new file mode 100644 index 00000000..38c8e93c --- /dev/null +++ b/website/src/theme/Icon/LightMode/index.js @@ -0,0 +1,11 @@ +import React from 'react'; +export default function IconLightMode(props) { + return ( + + + + ); +} diff --git a/website/src/theme/Navbar/ColorModeToggle/index.js b/website/src/theme/Navbar/ColorModeToggle/index.js new file mode 100644 index 00000000..a506863c --- /dev/null +++ b/website/src/theme/Navbar/ColorModeToggle/index.js @@ -0,0 +1,22 @@ +import React from 'react'; +import {useColorMode, useThemeConfig} from '@docusaurus/theme-common'; +import ColorModeToggle from '@theme/ColorModeToggle'; +import styles from './styles.module.css'; +export default function NavbarColorModeToggle({className}) { + const navbarStyle = useThemeConfig().navbar.style; + const disabled = useThemeConfig().colorMode.disableSwitch; + const {colorMode, setColorMode} = useColorMode(); + if (disabled) { + return null; + } + return ( + + ); +} diff --git a/website/src/theme/Navbar/ColorModeToggle/styles.module.css b/website/src/theme/Navbar/ColorModeToggle/styles.module.css new file mode 100644 index 00000000..7bd077a6 --- /dev/null +++ b/website/src/theme/Navbar/ColorModeToggle/styles.module.css @@ -0,0 +1,3 @@ +.darkNavbarColorModeToggle:hover { + background: var(--ifm-color-gray-800); +} diff --git a/website/src/theme/Navbar/Content/index.js b/website/src/theme/Navbar/Content/index.js new file mode 100644 index 00000000..b2a00ac3 --- /dev/null +++ b/website/src/theme/Navbar/Content/index.js @@ -0,0 +1,105 @@ +import React from "react"; +import { + useThemeConfig, + ErrorCauseBoundary, + useColorMode, +} from "@docusaurus/theme-common"; +import { + splitNavbarItems, + useNavbarMobileSidebar, +} from "@docusaurus/theme-common/internal"; +import NavbarItem from "@theme/NavbarItem"; +import NavbarColorModeToggle from "@theme/Navbar/ColorModeToggle"; +import SearchBar from "@theme/SearchBar"; +import NavbarMobileSidebarToggle from "@theme/Navbar/MobileSidebar/Toggle"; +import NavbarLogo from "@theme/Navbar/Logo"; +import NavbarSearch from "@theme/Navbar/Search"; +import styles from "./styles.module.css"; +import clsx from "clsx"; +import useBaseUrl from "@docusaurus/useBaseUrl"; +function useNavbarItems() { + // TODO temporary casting until ThemeConfig type is improved + return useThemeConfig().navbar.items; +} +function NavbarItems({ items }) { + return ( + <> + {items.map((item, i) => ( + + new Error( + `A theme navbar item failed to render. +Please double-check the following navbar item (themeConfig.navbar.items) of your Docusaurus config: +${JSON.stringify(item, null, 2)}`, + { cause: error } + ) + } + > + + + ))} + + ); +} +function NavbarContentLayout({ left, right }) { + return ( +
+
{left}
+
{right}
+
+ ); +} +export default function NavbarContent() { + const mobileSidebar = useNavbarMobileSidebar(); + const items = useNavbarItems(); + const [leftItems, rightItems] = splitNavbarItems(items); + const searchBarItem = items.find((item) => item.type === "search"); + const { colorMode, setColorMode } = useColorMode(); + return ( + + {!mobileSidebar.disabled && } + + {colorMode != "dark" ? ( +
+ ) : ( +
+ )} + + + } + right={ + // TODO stop hardcoding items? + // Ask the user to add the respective navbar items => more flexible + <> + +
+ +
+ + {!searchBarItem && ( + + + + )} + + } + /> + ); +} diff --git a/website/src/theme/Navbar/Content/styles.module.css b/website/src/theme/Navbar/Content/styles.module.css new file mode 100644 index 00000000..4c9471e1 --- /dev/null +++ b/website/src/theme/Navbar/Content/styles.module.css @@ -0,0 +1,8 @@ +/* +Hide color mode toggle in small viewports + */ +@media (max-width: 996px) { + .colorModeToggle { + display: none; + } +} diff --git a/website/src/theme/Navbar/Layout/index.js b/website/src/theme/Navbar/Layout/index.js new file mode 100644 index 00000000..492a9290 --- /dev/null +++ b/website/src/theme/Navbar/Layout/index.js @@ -0,0 +1,52 @@ +import React from 'react'; +import clsx from 'clsx'; +import {useThemeConfig} from '@docusaurus/theme-common'; +import { + useHideableNavbar, + useNavbarMobileSidebar, +} from '@docusaurus/theme-common/internal'; +import {translate} from '@docusaurus/Translate'; +import NavbarMobileSidebar from '@theme/Navbar/MobileSidebar'; +import styles from './styles.module.css'; +function NavbarBackdrop(props) { + return ( +
+ ); +} +export default function NavbarLayout({children}) { + const { + navbar: {hideOnScroll, style}, + } = useThemeConfig(); + const mobileSidebar = useNavbarMobileSidebar(); + const {navbarRef, isNavbarVisible} = useHideableNavbar(hideOnScroll); + return ( + + ); +} diff --git a/website/src/theme/Navbar/Layout/styles.module.css b/website/src/theme/Navbar/Layout/styles.module.css new file mode 100644 index 00000000..e72891a4 --- /dev/null +++ b/website/src/theme/Navbar/Layout/styles.module.css @@ -0,0 +1,7 @@ +.navbarHideable { + transition: transform var(--ifm-transition-fast) ease; +} + +.navbarHidden { + transform: translate3d(0, calc(-100% - 2px), 0); +} diff --git a/website/src/theme/Navbar/Logo/index.js b/website/src/theme/Navbar/Logo/index.js new file mode 100644 index 00000000..f0fa51ff --- /dev/null +++ b/website/src/theme/Navbar/Logo/index.js @@ -0,0 +1,11 @@ +import React from 'react'; +import Logo from '@theme/Logo'; +export default function NavbarLogo() { + return ( + + ); +} diff --git a/website/src/theme/Navbar/MobileSidebar/Header/index.js b/website/src/theme/Navbar/MobileSidebar/Header/index.js new file mode 100644 index 00000000..67e9e443 --- /dev/null +++ b/website/src/theme/Navbar/MobileSidebar/Header/index.js @@ -0,0 +1,31 @@ +import React from 'react'; +import {useNavbarMobileSidebar} from '@docusaurus/theme-common/internal'; +import {translate} from '@docusaurus/Translate'; +import NavbarColorModeToggle from '@theme/Navbar/ColorModeToggle'; +import IconClose from '@theme/Icon/Close'; +import NavbarLogo from '@theme/Navbar/Logo'; +function CloseButton() { + const mobileSidebar = useNavbarMobileSidebar(); + return ( + + ); +} +export default function NavbarMobileSidebarHeader() { + return ( +
+ + + +
+ ); +} diff --git a/website/src/theme/Navbar/MobileSidebar/Layout/index.js b/website/src/theme/Navbar/MobileSidebar/Layout/index.js new file mode 100644 index 00000000..b19eb2f9 --- /dev/null +++ b/website/src/theme/Navbar/MobileSidebar/Layout/index.js @@ -0,0 +1,22 @@ +import React from 'react'; +import clsx from 'clsx'; +import {useNavbarSecondaryMenu} from '@docusaurus/theme-common/internal'; +export default function NavbarMobileSidebarLayout({ + header, + primaryMenu, + secondaryMenu, +}) { + const {shown: secondaryMenuShown} = useNavbarSecondaryMenu(); + return ( +
+ {header} +
+
{primaryMenu}
+
{secondaryMenu}
+
+
+ ); +} diff --git a/website/src/theme/Navbar/MobileSidebar/PrimaryMenu/index.js b/website/src/theme/Navbar/MobileSidebar/PrimaryMenu/index.js new file mode 100644 index 00000000..9c5d0ec0 --- /dev/null +++ b/website/src/theme/Navbar/MobileSidebar/PrimaryMenu/index.js @@ -0,0 +1,27 @@ +import React from 'react'; +import {useThemeConfig} from '@docusaurus/theme-common'; +import {useNavbarMobileSidebar} from '@docusaurus/theme-common/internal'; +import NavbarItem from '@theme/NavbarItem'; +function useNavbarItems() { + // TODO temporary casting until ThemeConfig type is improved + return useThemeConfig().navbar.items; +} +// The primary menu displays the navbar items +export default function NavbarMobilePrimaryMenu() { + const mobileSidebar = useNavbarMobileSidebar(); + // TODO how can the order be defined for mobile? + // Should we allow providing a different list of items? + const items = useNavbarItems(); + return ( +
    + {items.map((item, i) => ( + mobileSidebar.toggle()} + key={i} + /> + ))} +
+ ); +} diff --git a/website/src/theme/Navbar/MobileSidebar/SecondaryMenu/index.js b/website/src/theme/Navbar/MobileSidebar/SecondaryMenu/index.js new file mode 100644 index 00000000..dd71af85 --- /dev/null +++ b/website/src/theme/Navbar/MobileSidebar/SecondaryMenu/index.js @@ -0,0 +1,30 @@ +import React from 'react'; +import {useThemeConfig} from '@docusaurus/theme-common'; +import {useNavbarSecondaryMenu} from '@docusaurus/theme-common/internal'; +import Translate from '@docusaurus/Translate'; +function SecondaryMenuBackButton(props) { + return ( + + ); +} +// The secondary menu slides from the right and shows contextual information +// such as the docs sidebar +export default function NavbarMobileSidebarSecondaryMenu() { + const isPrimaryMenuEmpty = useThemeConfig().navbar.items.length === 0; + const secondaryMenu = useNavbarSecondaryMenu(); + return ( + <> + {/* edge-case: prevent returning to the primaryMenu when it's empty */} + {!isPrimaryMenuEmpty && ( + secondaryMenu.hide()} /> + )} + {secondaryMenu.content} + + ); +} diff --git a/website/src/theme/Navbar/MobileSidebar/Toggle/index.js b/website/src/theme/Navbar/MobileSidebar/Toggle/index.js new file mode 100644 index 00000000..bfe29889 --- /dev/null +++ b/website/src/theme/Navbar/MobileSidebar/Toggle/index.js @@ -0,0 +1,22 @@ +import React from 'react'; +import {useNavbarMobileSidebar} from '@docusaurus/theme-common/internal'; +import {translate} from '@docusaurus/Translate'; +import IconMenu from '@theme/Icon/Menu'; +export default function MobileSidebarToggle() { + const {toggle, shown} = useNavbarMobileSidebar(); + return ( + + ); +} diff --git a/website/src/theme/Navbar/MobileSidebar/index.js b/website/src/theme/Navbar/MobileSidebar/index.js new file mode 100644 index 00000000..5db3cc7a --- /dev/null +++ b/website/src/theme/Navbar/MobileSidebar/index.js @@ -0,0 +1,23 @@ +import React from 'react'; +import { + useLockBodyScroll, + useNavbarMobileSidebar, +} from '@docusaurus/theme-common/internal'; +import NavbarMobileSidebarLayout from '@theme/Navbar/MobileSidebar/Layout'; +import NavbarMobileSidebarHeader from '@theme/Navbar/MobileSidebar/Header'; +import NavbarMobileSidebarPrimaryMenu from '@theme/Navbar/MobileSidebar/PrimaryMenu'; +import NavbarMobileSidebarSecondaryMenu from '@theme/Navbar/MobileSidebar/SecondaryMenu'; +export default function NavbarMobileSidebar() { + const mobileSidebar = useNavbarMobileSidebar(); + useLockBodyScroll(mobileSidebar.shown); + if (!mobileSidebar.shouldRender) { + return null; + } + return ( + } + primaryMenu={} + secondaryMenu={} + /> + ); +} diff --git a/website/src/theme/Navbar/Search/index.js b/website/src/theme/Navbar/Search/index.js new file mode 100644 index 00000000..6c6e7c24 --- /dev/null +++ b/website/src/theme/Navbar/Search/index.js @@ -0,0 +1,6 @@ +import React from 'react'; +import clsx from 'clsx'; +import styles from './styles.module.css'; +export default function NavbarSearch({children, className}) { + return
{children}
; +} diff --git a/website/src/theme/Navbar/Search/styles.module.css b/website/src/theme/Navbar/Search/styles.module.css new file mode 100644 index 00000000..ebce92dd --- /dev/null +++ b/website/src/theme/Navbar/Search/styles.module.css @@ -0,0 +1,13 @@ +@media (max-width: 996px) { + .searchBox { + position: absolute; + right: var(--ifm-navbar-padding-horizontal); + } +} + +@media (min-width: 997px) { + .searchBox { + padding: var(--ifm-navbar-item-padding-vertical) + var(--ifm-navbar-item-padding-horizontal); + } +} diff --git a/website/src/theme/Navbar/index.js b/website/src/theme/Navbar/index.js new file mode 100644 index 00000000..d18a258c --- /dev/null +++ b/website/src/theme/Navbar/index.js @@ -0,0 +1,10 @@ +import React from 'react'; +import NavbarLayout from '@theme/Navbar/Layout'; +import NavbarContent from '@theme/Navbar/Content'; +export default function Navbar() { + return ( + + + + ); +} diff --git a/website/src/theme/Root.js b/website/src/theme/Root.js new file mode 100644 index 00000000..d4dea5ae --- /dev/null +++ b/website/src/theme/Root.js @@ -0,0 +1,6 @@ +import React from "react"; + +// Default implementation, that you can customize +export default function Root({ children }) { + return <>{children}; +} diff --git a/website/static/img/github.svg b/website/static/img/github.svg new file mode 100644 index 00000000..56cd2a32 --- /dev/null +++ b/website/static/img/github.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/website/static/img/githubLight.svg b/website/static/img/githubLight.svg new file mode 100644 index 00000000..03ab3fde --- /dev/null +++ b/website/static/img/githubLight.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/website/static/img/verticalBlackLine.svg b/website/static/img/verticalBlackLine.svg new file mode 100644 index 00000000..00f41b8a --- /dev/null +++ b/website/static/img/verticalBlackLine.svg @@ -0,0 +1,3 @@ + + + diff --git a/website/static/img/verticalWhiteLine.svg b/website/static/img/verticalWhiteLine.svg new file mode 100644 index 00000000..606e21f4 --- /dev/null +++ b/website/static/img/verticalWhiteLine.svg @@ -0,0 +1,3 @@ + + +