mirror of
https://github.com/Unleash/unleash.git
synced 2025-02-23 00:22:19 +01:00
docs: update nav bar (#6045)
Update the Unleash docs navbar according to the new spec: Changing "estimated time burden" to "estimated time" (or "estimated reading time"), is just a matter of changing the text in the files. There's nothing special making it say burden other than plain text. That can be done in a follow-up PR. The new nav bar includes the Unleash academy and certification dropdowns as well as the docs and quickstart items. On smaller screen sizes (between 997 and 1150 px), we hide the word "Unleash" from "Unleash academy" and "Unleash certification". The narrowest nav bar:  When Unleash pops back in:  --------- Co-authored-by: markunl <mark@getunleash.io>
This commit is contained in:
Thomas Heartman
GitHub
parent
1d5d7ee57d
commit
6f4f8661c7
@ -65,16 +65,85 @@ module.exports = {
|
||||
indexName: 'getunleash',
|
||||
},
|
||||
navbar: {
|
||||
title: 'Unleash',
|
||||
logo: {
|
||||
alt: 'Unleash logo',
|
||||
src: 'img/logo.svg',
|
||||
src: 'img/unleash_logo_white.svg',
|
||||
},
|
||||
items: [
|
||||
{
|
||||
href: 'https://www.getunleash.io/plans',
|
||||
label: 'Unleash Enterprise',
|
||||
type: 'doc',
|
||||
position: 'right',
|
||||
docId: 'quickstart',
|
||||
label: 'Quickstart',
|
||||
},
|
||||
{
|
||||
type: 'doc',
|
||||
position: 'right',
|
||||
docId: 'welcome',
|
||||
label: 'Docs',
|
||||
},
|
||||
{
|
||||
type: 'dropdown',
|
||||
position: 'right',
|
||||
html: '<span class="hide-at-small-sizes">Unleash </span>Academy',
|
||||
to: 'unleash-academy/introduction',
|
||||
items: [
|
||||
{
|
||||
type: 'doc',
|
||||
docId: 'unleash-academy/foundational',
|
||||
label: 'Foundational',
|
||||
},
|
||||
{
|
||||
type: 'doc',
|
||||
docId: 'unleash-academy/advanced-for-devs',
|
||||
label: 'Advanced for Developers',
|
||||
},
|
||||
{
|
||||
type: 'doc',
|
||||
docId: 'unleash-academy/managing-unleash-for-devops',
|
||||
label: 'Managing Unleash for DevOps/Admins'
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
type: 'dropdown',
|
||||
position: 'right',
|
||||
html: '<span class="hide-at-small-sizes">Unleash </span>Certification',
|
||||
items: [
|
||||
{
|
||||
label: 'Foundational Unleash',
|
||||
href: 'https://docs.google.com/forms/d/1iPUk2I0k5xMzicn9aLMcPF3b9ub3ZwdVjRxCxWxV7js/viewform',
|
||||
},
|
||||
{
|
||||
label: 'Advanced Unleash for Developers',
|
||||
href: 'https://docs.google.com/forms/d/1NUL9hyO8Ys916TB6fPV3-jkvD97OmPXZ8_TO84Wjqgc/viewform',
|
||||
},
|
||||
{
|
||||
label: 'Managing Unleash for DevOps/Admins',
|
||||
href: 'https://docs.google.com/forms/d/1JlIqmXI3P7dj0n-OiUs2IYsYXgmqw23BChaemlSgHJA/viewform',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'html',
|
||||
position: 'right',
|
||||
value: '<span class="navbar-separator"></span>',
|
||||
},
|
||||
{
|
||||
href: 'https://www.getunleash.io/plans',
|
||||
label: 'Plans',
|
||||
position: 'right',
|
||||
},
|
||||
{
|
||||
href: 'https://app.unleash-hosted.com/sign-in',
|
||||
label: 'Sign in',
|
||||
position: 'right',
|
||||
},
|
||||
{
|
||||
type: 'html',
|
||||
position: 'right',
|
||||
value: '<span class="navbar-separator"></span>',
|
||||
},
|
||||
{
|
||||
href: 'https://github.com/Unleash/unleash',
|
||||
|
||||
@ -14,9 +14,7 @@
|
||||
|
||||
|
||||
module.exports = {
|
||||
documentation: [
|
||||
'welcome',
|
||||
'quickstart',
|
||||
academy: [
|
||||
{
|
||||
label: 'Unleash Academy',
|
||||
collapsed: true,
|
||||
@ -31,6 +29,10 @@ module.exports = {
|
||||
'unleash-academy/managing-unleash-for-devops',
|
||||
],
|
||||
},
|
||||
],
|
||||
documentation: [
|
||||
'welcome',
|
||||
'quickstart',
|
||||
{
|
||||
label: 'Feature Flag Best Practices',
|
||||
collapsed: true,
|
||||
|
||||
@ -9,12 +9,57 @@
|
||||
:root {
|
||||
--unleash-color-purple: #635dc5;
|
||||
--unleash-color-gray: #ecebeb;
|
||||
--unleash-color-green: #1a4049;
|
||||
|
||||
--ifm-code-font-size: 90%;
|
||||
--ifm-font-size-base: 15px;
|
||||
--navbar-link-color: #122d33;
|
||||
|
||||
--unleash-font-size-smaller: 90%;
|
||||
|
||||
/* navbar is independent of the theme in general */
|
||||
--ifm-navbar-background-color: var(--unleash-color-green);
|
||||
/* this is the font color set on the content in dark mode */
|
||||
--unleash-navbar-font-color: #e3e3e3;
|
||||
--unleash-navbar-active-background-color: #122D33;
|
||||
--ifm-navbar-link-color: var(--unleash-navbar-font-color);
|
||||
--unleash-navbar-highlight-color: #bab8ff;
|
||||
--ifm-navbar-link-active-color: var(--unleash-navbar-highlight-color);
|
||||
--ifm-navbar-link-hover-color: var(--unleash-navbar-highlight-color);
|
||||
|
||||
}
|
||||
|
||||
.navbar {
|
||||
color: var(--unleash-navbar-font-color);
|
||||
|
||||
/* this is the dark mode background github icon */
|
||||
.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;
|
||||
}
|
||||
|
||||
button[class*='toggleButton_']:hover
|
||||
{
|
||||
background: var(--unleash-navbar-active-background-color);
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-sidebar {
|
||||
background-color: var(--ifm-navbar-background-color);
|
||||
--ifm-menu-color: var(--ifm-navbar-link-color);
|
||||
--ifm-menu-color-active: var(--ifm-navbar-link-active-color);
|
||||
--ifm-menu-color-background-active: var(--unleash-navbar-active-background-color);
|
||||
--ifm-menu-color-active: var(--ifm-navbar-link-active-color);
|
||||
--ifm-menu-color-background-hover: var(--unleash-navbar-active-background-color);
|
||||
}
|
||||
|
||||
.navbar__logo {
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
@media (width < 1150px) {
|
||||
.navbar .hide-at-small-sizes {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
@ -60,8 +105,6 @@ html[data-theme='dark'] {
|
||||
--ifm-color-secondary-contrast-background
|
||||
);
|
||||
|
||||
--unleash-img-background-color: #fff;
|
||||
|
||||
--docsearch-primary-color: var(--ifm-color-primary-darkest);
|
||||
}
|
||||
|
||||
@ -121,6 +164,14 @@ main :is(p, figure) > img:not([src^="https://img.shields.io/" i], [src*="badge.s
|
||||
display: none;
|
||||
}
|
||||
|
||||
.navbar__item:has(.navbar-separator) {
|
||||
width: 1px;
|
||||
height: 100%;
|
||||
background: white;
|
||||
padding: 0;
|
||||
margin-inline: var(--ifm-spacing-horizontal);
|
||||
}
|
||||
|
||||
li.theme-doc-sidebar-item-category-level-1 > div::before {
|
||||
width: 0.3em;
|
||||
height: 100%;
|
||||
|
||||
1
website/static/img/unleash_logo_white.svg
Normal file
1
website/static/img/unleash_logo_white.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg id="bg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 653.4 251.24" aria-label="Unleash logo" class="mui-1nbic85"><defs><style>.cls-1{fill:#fff}.cls-2{fill:#1a4049}</style></defs><circle class="cls-1" cx="125.62" cy="125.62" r="80"/><path class="cls-1" d="M137.05 91.33v45.72h22.85V91.33h-22.85zM114.19 114.19V91.33H91.33v68.57h45.72v-22.85h-22.86v-22.86z"/><path class="cls-2" d="M137.05 91.33v45.72h22.85V91.33h-22.85zM114.19 114.19V91.33H91.33v68.57h45.72v-22.85h-22.86v-22.86z"/><path style="fill:#817afe" d="M137.05 137.05h22.86v22.86h-22.86z"/><path class="cls-1" d="M251.58 139.13v-26.36h11.93v25.06c0 7.36 3.91 12.2 11.27 12.2s11.27-4.84 11.27-12.2v-25.06h12v26.36c0 12.67-8.48 21.8-23.1 21.8-14.89 0-23.37-9.13-23.37-21.8ZM321.91 159.9h-11.83v-47.13h11.83v7.92a17.93 17.93 0 0 1 15.65-9c11.83 0 19.66 8.67 19.66 20.68v27.53h-12v-25.15c0-7.45-4.38-12.39-11.46-12.39s-11.83 5-11.83 12.39ZM369.42 91.34h11.92v68.56h-11.92ZM441.24 137v1.3h-37.45c.47 7.36 5.87 13 13.69 13 7.55 0 10.62-3.82 11.46-5.12h11.74c-.75 4.84-7.17 15-23.2 15-15.27 0-25.61-10.61-25.61-24.77 0-14.63 10.24-24.78 24.68-24.78s24.69 9.99 24.69 25.37Zm-37.08-6.9h24.6c-1.77-6-6.15-9.31-12.21-9.31-6.43-.01-10.9 3.44-12.39 9.3ZM467.78 130.37h15.47c0-5.68-4.29-9.31-11.27-9.31-6.62 0-9 3.54-9.78 4.75h-12c1-4.94 6.89-14.25 21.8-14.25 14.62 0 22.73 7.64 22.73 18.81v15.93c0 2.89 1 4 3.72 4.29v9.59h-3.72c-6.06-.09-9.69-2.33-11-6.52-2.23 3.45-7.26 7.27-15.27 7.27-11.09 0-19.47-6.24-19.47-15.93s7.15-14.63 18.79-14.63Zm15.47 12.11v-4h-13.51c-5.59 0-9 2-9 6.33 0 4.57 4.29 7.27 10.25 7.27 6.67 0 12.26-3.26 12.26-9.6ZM523.12 140.62c-10.34-.74-17.33-5.59-17.33-14.72 0-8.85 8.1-14.44 20.77-14.44 17 0 21.8 8.76 23.1 13.32h-12.57c-.84-1-3.54-4.28-10.62-4.28-5.68 0-8.66 1.86-8.66 4.75 0 2.61 2 4.29 6.7 4.94l8 .84c12.77 1.11 18 6 18 15.27 0 8.85-7.36 14.91-21.8 14.91-17.51 0-23.19-10.16-24.12-14.53h12.76c.47 1.11 3.35 5.31 11.36 5.31 6.62 0 9.69-2.24 9.69-5.22s-1.67-4.66-7-5.31c-3.35-.28-5.02-.46-8.28-.84ZM571.55 159.9h-11.83V91.34h11.83v29.35a17.93 17.93 0 0 1 15.65-9c11.83 0 19.66 8.67 19.66 20.68v27.53h-12v-25.15c0-7.45-4.38-12.39-11.46-12.39s-11.83 5-11.83 12.39Z"/></svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
Loading…
Reference in New Issue
Block a user