mirror of
https://github.com/Unleash/unleash.git
synced 2025-08-04 13:48:56 +02:00
new docs theme ✨🎨
This commit is contained in:
Alvin Bryan
parent
45035102f4
commit
81d7eb6c63
@ -42,7 +42,23 @@ const addDocsRoutePrefix = ({ from, ...rest }) => {
|
|||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
const config: Config = {
|
const getUnleashRepoStars = async () => {
|
||||||
|
const response = await fetch(
|
||||||
|
`https://api.github.com/repos/unleash/unleash`,
|
||||||
|
);
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
const unleashRepoStars = data.stargazers_count;
|
||||||
|
const formattedStars =
|
||||||
|
unleashRepoStars >= 1000
|
||||||
|
? `${(unleashRepoStars / 1000).toFixed(1)}k`
|
||||||
|
: unleashRepoStars.toString();
|
||||||
|
return formattedStars;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default async function createConfigAsync(): Promise<Config> {
|
||||||
|
const stars = await getUnleashRepoStars();
|
||||||
|
return {
|
||||||
title: 'Unleash Documentation',
|
title: 'Unleash Documentation',
|
||||||
tagline: 'The enterprise ready feature flag service',
|
tagline: 'The enterprise ready feature flag service',
|
||||||
url: 'https://docs.getunleash.io',
|
url: 'https://docs.getunleash.io',
|
||||||
@ -69,45 +85,30 @@ const config: Config = {
|
|||||||
navbar: {
|
navbar: {
|
||||||
logo: {
|
logo: {
|
||||||
alt: 'Unleash logo',
|
alt: 'Unleash logo',
|
||||||
src: 'img/unleash_logo_white.svg',
|
src: 'https://getunleash.io/logos/unleash_pos.svg',
|
||||||
|
srcDark: 'img/unleash_logo_white.svg',
|
||||||
href: 'https://www.getunleash.io',
|
href: 'https://www.getunleash.io',
|
||||||
|
height: '2rem',
|
||||||
},
|
},
|
||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
type: 'doc',
|
label: 'Product',
|
||||||
position: 'right',
|
href: 'https://www.getunleash.io/enterprise-feature-management-platform',
|
||||||
docId: 'quickstart',
|
position: 'left',
|
||||||
html: '<span class="hide-when-active">Quickstart</span>',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'doc',
|
label: 'Plans',
|
||||||
position: 'right',
|
href: 'https://www.getunleash.io/plans',
|
||||||
docId: 'welcome',
|
position: 'left',
|
||||||
html: '<span class="hide-when-active">Docs</span>',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'html',
|
label: 'Blog',
|
||||||
value: '<a href="https://www.getunleash.io/enterprise-feature-management-platform" class="navbar__item navbar__link">Product</a>',
|
href: 'https://www.getunleash.io/blog',
|
||||||
position: 'right',
|
position: 'left',
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'html',
|
|
||||||
value: '<a href="https://www.getunleash.io/plans" class="navbar__item navbar__link">Plans</a>',
|
|
||||||
position: 'right',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'html',
|
|
||||||
value: '<a href="https://www.getunleash.io/blog" class="navbar__item navbar__link">Blog</a>',
|
|
||||||
position: 'right',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'html',
|
|
||||||
position: 'right',
|
|
||||||
value: '<span class="navbar-separator"></span>',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'dropdown',
|
type: 'dropdown',
|
||||||
position: 'right',
|
position: 'left',
|
||||||
html: '<span class="hide-at-small-sizes">Unleash </span>Academy',
|
html: '<span class="hide-at-small-sizes">Unleash </span>Academy',
|
||||||
to: 'unleash-academy/introduction',
|
to: 'unleash-academy/introduction',
|
||||||
items: [
|
items: [
|
||||||
@ -128,10 +129,9 @@ const config: Config = {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
type: 'dropdown',
|
type: 'dropdown',
|
||||||
position: 'right',
|
position: 'left',
|
||||||
html: '<span class="hide-at-small-sizes">Unleash </span>Certification',
|
html: '<span class="hide-at-small-sizes">Unleash </span>Certification',
|
||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
@ -149,25 +149,31 @@ const config: Config = {
|
|||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'html',
|
type: 'search',
|
||||||
position: 'right',
|
position: 'right',
|
||||||
value: '<span class="navbar-separator"></span>',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'html',
|
label: 'Sign in',
|
||||||
value: '<a href="https://app.unleash-hosted.com/sign-in" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link">Sign in</a>',
|
href: 'https://app.unleash-hosted.com/sign-in',
|
||||||
position: 'right',
|
position: 'right',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'html',
|
type: 'html',
|
||||||
position: 'right',
|
position: 'right',
|
||||||
value: '<span class="navbar-separator"></span>',
|
value: `<a
|
||||||
|
href="https://github.com/Unleash/unleash"
|
||||||
|
aria-label="Unleash GitHub repository"
|
||||||
|
class="header-github-link"
|
||||||
|
>
|
||||||
|
<svg width="28px" height="28px" viewBox="0 0 21 20"><path fill="currentColor" d="M10.537 1.833c-4.602 0-8.333 3.544-8.333 7.917 0 4.373 3.73 7.917 8.333 7.917s8.334-3.544 8.334-7.917c0-4.373-3.73-7.917-8.334-7.917Zm0 1.584c3.676 0 6.667 2.842 6.667 6.333 0 .371-.039.736-.104 1.089a4.345 4.345 0 0 0-.86-.1 6.375 6.375 0 0 0-.859.075 2.76 2.76 0 0 0 .156-.89c0-.761-.39-1.47-1.015-2.054.172-.61.342-1.655-.104-2.078a2.762 2.762 0 0 0-2.084.94 5.684 5.684 0 0 0-1.276-.149 5.91 5.91 0 0 0-1.64.248l.156-.124s-.733-.965-2.083-.965c-.472.452-.258 1.596-.079 2.177-.638.579-1.041 1.262-1.041 2.004 0 .26.065.507.13.742-.231-.024-1.064-.098-1.406-.098-.303 0-.772.067-1.146.148a5.912 5.912 0 0 1-.078-.965c0-3.491 2.991-6.333 6.666-6.333Zm-5.442 7.347c.329 0 1.328.112 1.458.124.016.043.033.084.052.124-.358-.031-1.051-.078-1.51-.025-.306.034-.697.14-1.042.223-.026-.1-.059-.195-.078-.297.365-.074.843-.149 1.12-.149Zm11.146.174c.332.003.634.055.833.098-.01.053-.04.096-.052.149a5.042 5.042 0 0 0-.964-.124c-.195-.003-.508.007-.781.025.013-.025.016-.05.026-.074.283-.037.645-.078.938-.074Zm-10.625.222c.468.003.908.034 1.093.05.437.773 1.319 1.345 2.683 1.583a2.621 2.621 0 0 0-.86.718c-.195.015-.4.024-.599.024-.58 0-.94-.492-1.25-.915-.312-.424-.696-.47-.911-.495-.218-.025-.293.093-.182.173.634.464.862 1.015 1.12 1.51.23.445.715.692 1.25.692h.103a1.33 1.33 0 0 0-.026.248v.865c-1.923-.739-3.388-2.3-3.932-4.23.342-.08.726-.164 1.016-.198.133-.016.302-.028.495-.025Zm10.442.1c.375.008.707.076.912.123-.46 1.639-1.592 3.003-3.1 3.835v-.47c0-.675-.56-1.54-1.353-1.955 1.318-.229 2.177-.776 2.63-1.51.316-.02.687-.03.911-.024Zm-5.104 3.24a.41.41 0 0 1 .417.396v1.138c-.274.034-.55.05-.834.05v-1.188a.41.41 0 0 1 .417-.396Zm-1.667.792a.41.41 0 0 1 .417.396v.346a7.438 7.438 0 0 1-.833-.148v-.198a.41.41 0 0 1 .416-.396Zm3.334 0c.202 0 .377.139.416.321-.27.106-.546.201-.833.273v-.198a.41.41 0 0 1 .417-.396Z"/></svg>
|
||||||
|
<span>Stars</span>
|
||||||
|
<strong>${stars}</strong>
|
||||||
|
</a>`,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
href: 'https://github.com/Unleash/unleash',
|
label: 'Get a demo',
|
||||||
|
href: 'https://www.getunleash.io/plans/enterprise',
|
||||||
position: 'right',
|
position: 'right',
|
||||||
className: 'header-github-link',
|
|
||||||
'aria-label': 'Unleash GitHub repository',
|
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
@ -224,8 +230,48 @@ const config: Config = {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
footer: {
|
footer: {
|
||||||
style: 'dark',
|
|
||||||
links: [
|
links: [
|
||||||
|
{
|
||||||
|
title: 'Feature Flag use cases',
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
label: 'Secure, scalable feature flags',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Rollbacks',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Fedramp, SOC2, ISO2700 compliance',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Progressive or gradual rollouts',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Trunk-based development',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Software kill switches',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'A/B testing',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Feature Management',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Canary releases',
|
||||||
|
to: 'EMPTY LINK',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: 'Product',
|
title: 'Product',
|
||||||
items: [
|
items: [
|
||||||
@ -270,10 +316,6 @@ const config: Config = {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
copyright: `Copyright © ${new Date().getFullYear()} Unleash. Built with Docusaurus.`,
|
copyright: `Copyright © ${new Date().getFullYear()} Unleash. Built with Docusaurus.`,
|
||||||
logo: {
|
|
||||||
src: 'img/logo.svg',
|
|
||||||
alt: 'Unleash logo',
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
image: 'img/logo.png',
|
image: 'img/logo.png',
|
||||||
imageZoom: {
|
imageZoom: {
|
||||||
@ -311,7 +353,8 @@ const config: Config = {
|
|||||||
lastmod: 'date',
|
lastmod: 'date',
|
||||||
priority: 0.5,
|
priority: 0.5,
|
||||||
createSitemapItems: async (params) => {
|
createSitemapItems: async (params) => {
|
||||||
const { defaultCreateSitemapItems, ...rest } = params;
|
const { defaultCreateSitemapItems, ...rest } =
|
||||||
|
params;
|
||||||
const items = await defaultCreateSitemapItems(rest);
|
const items = await defaultCreateSitemapItems(rest);
|
||||||
return items.filter(
|
return items.filter(
|
||||||
(item) => !item.url.includes('/page/'),
|
(item) => !item.url.includes('/page/'),
|
||||||
@ -414,7 +457,10 @@ const config: Config = {
|
|||||||
to: '/reference/integrations',
|
to: '/reference/integrations',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
from: ['/addons/datadog', '/reference/addons/datadog'],
|
from: [
|
||||||
|
'/addons/datadog',
|
||||||
|
'/reference/addons/datadog',
|
||||||
|
],
|
||||||
to: '/reference/integrations/datadog',
|
to: '/reference/integrations/datadog',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -433,7 +479,10 @@ const config: Config = {
|
|||||||
to: '/reference/integrations/teams',
|
to: '/reference/integrations/teams',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
from: ['/addons/webhook', '/reference/addons/webhook'],
|
from: [
|
||||||
|
'/addons/webhook',
|
||||||
|
'/reference/addons/webhook',
|
||||||
|
],
|
||||||
to: '/reference/integrations/webhook',
|
to: '/reference/integrations/webhook',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -441,7 +490,10 @@ const config: Config = {
|
|||||||
to: '/how-to/how-to-send-feature-updates-to-slack-deprecated',
|
to: '/how-to/how-to-send-feature-updates-to-slack-deprecated',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
from: ['/integrations/integrations', '/integrations'],
|
from: [
|
||||||
|
'/integrations/integrations',
|
||||||
|
'/integrations',
|
||||||
|
],
|
||||||
to: '/reference/integrations',
|
to: '/reference/integrations',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -666,7 +718,10 @@ const config: Config = {
|
|||||||
to: '/',
|
to: '/',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
from: ['/topics/feature-flags/tutorials', '/tutorials'],
|
from: [
|
||||||
|
'/topics/feature-flags/tutorials',
|
||||||
|
'/tutorials',
|
||||||
|
],
|
||||||
to: '/feature-flag-tutorials',
|
to: '/feature-flag-tutorials',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -919,5 +974,4 @@ const config: Config = {
|
|||||||
],
|
],
|
||||||
clientModules: ['./global.js'],
|
clientModules: ['./global.js'],
|
||||||
};
|
};
|
||||||
|
}
|
||||||
export default config;
|
|
||||||
|
|||||||
329
website/src/css/academy.css
Normal file
329
website/src/css/academy.css
Normal file
@ -0,0 +1,329 @@
|
|||||||
|
/* Unleash academy content */
|
||||||
|
|
||||||
|
/* breakpoints:
|
||||||
|
show wide: >=1247
|
||||||
|
show narrow: 997-1246
|
||||||
|
show wide: 711-996
|
||||||
|
show narrow: <=710
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* shared academy styles */
|
||||||
|
|
||||||
|
.unleash-academy-level-badge {
|
||||||
|
border: 2px solid;
|
||||||
|
border-radius: 60px;
|
||||||
|
padding-inline: 0.5em;
|
||||||
|
text-transform: capitalize;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-theme="light"] .unleash-academy-level-badge {
|
||||||
|
border-color: var(--unleash-logo-purple);
|
||||||
|
color: var(--unleash-logo-purple);
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-theme="dark"] .unleash-academy-level-badge {
|
||||||
|
border-color: var(--ifm-link-color);
|
||||||
|
color: var(--ifm-link-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-level-container.advanced {
|
||||||
|
background-image: url("/img/unleash-academy/advanced-pixels.svg");
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-level-container.beginners {
|
||||||
|
background-image: url("/img/unleash-academy/beginner-pixels.svg");
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-banner {
|
||||||
|
--banner-padding: calc(var(--ifm-spacing-vertical) * 3);
|
||||||
|
--unleash-academy-logo-width: 85px;
|
||||||
|
--banner-padding: calc(var(--ifm-spacing-vertical) * 3);
|
||||||
|
--banner-font-color: #000;
|
||||||
|
--button-color: var(--unleash-logo-purple);
|
||||||
|
|
||||||
|
margin-block-start: var(--ifm-spacing-vertical);
|
||||||
|
margin-block-end: var(--ifm-spacing-vertical);
|
||||||
|
position: relative;
|
||||||
|
border: var(--ifm-global-border-width) solid var(--ifm-color-emphasis-200);
|
||||||
|
padding: var(--banner-padding);
|
||||||
|
border-radius: var(--ifm-global-radius);
|
||||||
|
background-color: #f1f0fc;
|
||||||
|
background-image: url("/img/unleash-academy/banner-bg-pixels.svg");
|
||||||
|
background-position: top right;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
overflow: hidden;
|
||||||
|
color: var(--banner-font-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-theme="dark"] .course-banner-container {
|
||||||
|
background-color: inherit;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.academy-banner-main-text {
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 1.4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-banner-list {
|
||||||
|
grid-area: bullets;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
gap: calc(var(--ifm-spacing-horizontal) * 2);
|
||||||
|
padding-inline-start: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-banner-list > li {
|
||||||
|
font-weight: bold;
|
||||||
|
list-style-type: none;
|
||||||
|
background-image: url("/img/unleash-academy/bullet-check.svg");
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: left center;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-banner-list > li::marker {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-banner-list > li + li {
|
||||||
|
margin-block-start: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 711px) and (max-width: 996px), (min-width: 1247px) {
|
||||||
|
.unleash-academy-banner-list {
|
||||||
|
flex-flow: row;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-action-button {
|
||||||
|
--button-color: #6c65e5;
|
||||||
|
--button-hover-color: #615bc2;
|
||||||
|
display: block;
|
||||||
|
border-radius: var(--ifm-global-radius);
|
||||||
|
width: 100%;
|
||||||
|
background: var(--button-color);
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
padding: calc(var(--ifm-spacing-horizontal) * 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-action-button:hover {
|
||||||
|
background: var(--button-hover-color);
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* begin certification links */
|
||||||
|
.unleash-academy-links-container {
|
||||||
|
margin-block-start: var(--ifm-spacing-vertical);
|
||||||
|
margin-block-end: var(--ifm-spacing-vertical);
|
||||||
|
--button-background-color: var(--color-purple);
|
||||||
|
--border-color: var(--ifm-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-links {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
width: 100%;
|
||||||
|
gap: var(--ifm-spacing-vertical);
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-links-container li:has(article) {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-links-container article {
|
||||||
|
border-radius: var(--ifm-global-radius);
|
||||||
|
border: var(--ifm-global-border-width) solid var(--ifm-color-emphasis-200);
|
||||||
|
padding: calc(var(--ifm-spacing-vertical) * 2);
|
||||||
|
display: grid;
|
||||||
|
grid-template-rows: min-content auto min-content;
|
||||||
|
background-position: top right;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-links-container article .header > * + * {
|
||||||
|
margin-block-start: calc(var(--ifm-spacing-vertical) * 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-links-container article p {
|
||||||
|
font-size: var(--unleash-font-size-smaller);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 711px) and (max-width: 996px), (min-width: 1247px) {
|
||||||
|
.unleash-academy-links {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-links-container article {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* End of certification links styles */
|
||||||
|
|
||||||
|
/* Specific styles for the main Unleash academy banner */
|
||||||
|
.academy-general-banner-content {
|
||||||
|
display: grid;
|
||||||
|
grid-template-areas: "header logo" "bullets bullets" "button button";
|
||||||
|
grid-template-columns: auto var(--unleash-academy-logo-width);
|
||||||
|
gap: var(--ifm-spacing-horizontal);
|
||||||
|
}
|
||||||
|
|
||||||
|
.academy-general-banner-content .unleash-action-button {
|
||||||
|
grid-area: button;
|
||||||
|
}
|
||||||
|
|
||||||
|
.academy-general-banner .academy-banner-main-text {
|
||||||
|
grid-area: header;
|
||||||
|
}
|
||||||
|
|
||||||
|
.academy-general-banner .small-logo {
|
||||||
|
grid-area: logo;
|
||||||
|
background-image: url("/img/unleash-academy/academy-logo.svg");
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
width: 100%;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 711px) and (max-width: 996px), (min-width: 1247px) {
|
||||||
|
.academy-general-banner-content {
|
||||||
|
grid-template-areas: "header logo" "bullets logo" "button logo";
|
||||||
|
grid-template-columns: 480px auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.academy-general-banner-content .unleash-action-button {
|
||||||
|
width: 240px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.academy-general-banner .small-logo {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.academy-general-banner .big-logo {
|
||||||
|
position: absolute;
|
||||||
|
background-image: url("/img/unleash-academy/academy-logo.svg");
|
||||||
|
bottom: 0;
|
||||||
|
right: 40px;
|
||||||
|
width: 200px;
|
||||||
|
height: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position-x: left;
|
||||||
|
background-position-y: 190%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* end banner */
|
||||||
|
|
||||||
|
/* course banner-specific styling */
|
||||||
|
.course-banner-container.beginners {
|
||||||
|
background-size: 108px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-banner-container.advanced {
|
||||||
|
background-size: 108px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-banner-container > * + * {
|
||||||
|
margin-block-start: var(--ifm-spacing-vertical);
|
||||||
|
margin-block-end: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unleash-academy-level-badge {
|
||||||
|
border: 2px solid;
|
||||||
|
border-radius: 60px;
|
||||||
|
padding-inline: 0.5em;
|
||||||
|
text-transform: capitalize;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-theme="light"] .unleash-academy-level-badge {
|
||||||
|
border-color: var(--unleash-logo-purple);
|
||||||
|
color: var(--unleash-logo-purple);
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-theme="dark"] .unleash-academy-level-badge {
|
||||||
|
border-color: var(--ifm-link-color);
|
||||||
|
color: var(--ifm-link-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* docusaurus-plugin-openapi-docs styling
|
||||||
|
|
||||||
|
Taken from
|
||||||
|
https://github.com/PaloAltoNetworks/docusaurus-openapi-docs/blob/02922a6ad6d635373e01409dac8c17a88da2b72e/demo/src/css/custom.css#L45-L9
|
||||||
|
|
||||||
|
Based on this thread:
|
||||||
|
https://github.com/PaloAltoNetworks/docusaurus-openapi-docs/issues/177
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Sidebar Method labels */
|
||||||
|
.api-method > .menu__link {
|
||||||
|
align-items: center;
|
||||||
|
justify-content: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-method > .menu__link::before {
|
||||||
|
width: 50px;
|
||||||
|
height: 20px;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 20px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-weight: 600;
|
||||||
|
border-radius: 0.25rem;
|
||||||
|
border: 1px solid;
|
||||||
|
border-inline-start-width: 5px;
|
||||||
|
margin-right: var(--ifm-spacing-horizontal);
|
||||||
|
text-align: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.get > .menu__link::before {
|
||||||
|
content: "get";
|
||||||
|
background-color: var(--ifm-color-info-contrast-background);
|
||||||
|
color: var(--ifm-color-info-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-info-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.post > .menu__link::before {
|
||||||
|
content: "post";
|
||||||
|
background-color: var(--ifm-color-success-contrast-background);
|
||||||
|
color: var(--ifm-color-success-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-success-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete > .menu__link::before {
|
||||||
|
content: "del";
|
||||||
|
background-color: var(--ifm-color-danger-contrast-background);
|
||||||
|
color: var(--ifm-color-danger-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-danger-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.put > .menu__link::before {
|
||||||
|
content: "put";
|
||||||
|
background-color: var(--ifm-color-warning-contrast-background);
|
||||||
|
color: var(--ifm-color-warning-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-warning-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.patch > .menu__link::before {
|
||||||
|
content: "patch";
|
||||||
|
background-color: var(--ifm-color-success-contrast-background);
|
||||||
|
color: var(--ifm-color-success-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-success-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.head > .menu__link::before {
|
||||||
|
content: "head";
|
||||||
|
background-color: var(--ifm-color-secondary-contrast-background);
|
||||||
|
color: var(--ifm-color-secondary-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-secondary-dark);
|
||||||
|
}
|
||||||
72
website/src/css/api-docs.css
Normal file
72
website/src/css/api-docs.css
Normal file
@ -0,0 +1,72 @@
|
|||||||
|
/* docusaurus-plugin-openapi-docs styling
|
||||||
|
|
||||||
|
Taken from
|
||||||
|
https://github.com/PaloAltoNetworks/docusaurus-openapi-docs/blob/02922a6ad6d635373e01409dac8c17a88da2b72e/demo/src/css/custom.css#L45-L9
|
||||||
|
|
||||||
|
Based on this thread:
|
||||||
|
https://github.com/PaloAltoNetworks/docusaurus-openapi-docs/issues/177
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Sidebar Method labels */
|
||||||
|
.api-method > .menu__link {
|
||||||
|
align-items: center;
|
||||||
|
justify-content: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-method > .menu__link::before {
|
||||||
|
width: 50px;
|
||||||
|
height: 20px;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 20px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-weight: 600;
|
||||||
|
border-radius: 0.25rem;
|
||||||
|
border: 1px solid;
|
||||||
|
border-inline-start-width: 5px;
|
||||||
|
margin-right: var(--ifm-spacing-horizontal);
|
||||||
|
text-align: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.get > .menu__link::before {
|
||||||
|
content: "get";
|
||||||
|
background-color: var(--ifm-color-info-contrast-background);
|
||||||
|
color: var(--ifm-color-info-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-info-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.post > .menu__link::before {
|
||||||
|
content: "post";
|
||||||
|
background-color: var(--ifm-color-success-contrast-background);
|
||||||
|
color: var(--ifm-color-success-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-success-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete > .menu__link::before {
|
||||||
|
content: "del";
|
||||||
|
background-color: var(--ifm-color-danger-contrast-background);
|
||||||
|
color: var(--ifm-color-danger-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-danger-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.put > .menu__link::before {
|
||||||
|
content: "put";
|
||||||
|
background-color: var(--ifm-color-warning-contrast-background);
|
||||||
|
color: var(--ifm-color-warning-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-warning-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.patch > .menu__link::before {
|
||||||
|
content: "patch";
|
||||||
|
background-color: var(--ifm-color-success-contrast-background);
|
||||||
|
color: var(--ifm-color-success-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-success-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.head > .menu__link::before {
|
||||||
|
content: "head";
|
||||||
|
background-color: var(--ifm-color-secondary-contrast-background);
|
||||||
|
color: var(--ifm-color-secondary-contrast-foreground);
|
||||||
|
border-color: var(--ifm-color-secondary-dark);
|
||||||
|
}
|
||||||
@ -5,80 +5,38 @@
|
|||||||
* work well for content-centric websites.
|
* work well for content-centric websites.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
@import url("./academy.css");
|
||||||
|
@import url("./api-docs.css");
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: Styrene B Web;
|
||||||
|
src: url(/fonts/StyreneB-Regular-Web.woff2) format("woff2"),
|
||||||
|
url(/fonts/StyreneB-Regular-Web.woff) format("woff");
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-stretch: normal;
|
||||||
|
font-display: swap;
|
||||||
|
}
|
||||||
|
|
||||||
/* You can override the default Infima variables here. */
|
/* You can override the default Infima variables here. */
|
||||||
:root {
|
:root {
|
||||||
--unleash-logo-purple: #635dc5;
|
--unleash-logo-purple: #635dc5;
|
||||||
--unleash-color-purple: var(--unleash-logo-purple);
|
--unleash-color-purple: var(--unleash-logo-purple);
|
||||||
--unleash-color-gray: #ecebeb;
|
--unleash-color-gray: #ecebeb;
|
||||||
--unleash-color-green: #1a4049;
|
--unleash-color-green: #1a4049;
|
||||||
|
--unleash-color-sub-background: #eaeaed;
|
||||||
|
--ifm-font-family-base: "Sen", sans-serif;
|
||||||
|
|
||||||
--ifm-code-font-size: 90%;
|
--ifm-code-font-size: 90%;
|
||||||
--ifm-font-size-base: 15px;
|
--ifm-font-size-base: 15px;
|
||||||
--navbar-link-color: #122d33;
|
|
||||||
|
|
||||||
--unleash-font-size-smaller: 90%;
|
--unleash-font-size-smaller: 90%;
|
||||||
--ifm-footer-logo-max-width: 250px;
|
--ifm-footer-logo-max-width: 250px;
|
||||||
|
--ifm-navbar-height: 5rem;
|
||||||
|
--ifm-footer-background-color: var(--ifm-background-color);
|
||||||
|
|
||||||
/* navbar is independent of the theme in general */
|
/* navbar is independent of the theme in general */
|
||||||
--ifm-navbar-background-color: var(--unleash-color-green);
|
--ifm-navbar-background-color: var(--ifm-background-color);
|
||||||
/* 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);
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar .navbar__link--active:has(.hide-when-active) {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar 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 (max-width: 1150px) {
|
|
||||||
.navbar .hide-at-small-sizes {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 997px) {
|
|
||||||
.show-when-collapsed {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
footer {
|
|
||||||
--ifm-footer-link-hover-color: var(--ifm-footer-link-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
article video {
|
|
||||||
display: block;
|
|
||||||
margin-block: var(--ifm-spacing-vertical);
|
|
||||||
margin-inline: auto;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
html[data-theme="light"] {
|
html[data-theme="light"] {
|
||||||
@ -120,9 +78,80 @@ html[data-theme="dark"] {
|
|||||||
--ifm-color-secondary-contrast-background
|
--ifm-color-secondary-contrast-background
|
||||||
);
|
);
|
||||||
|
|
||||||
|
--ifm-background-color: #222130;
|
||||||
|
--unleash-color-sub-background: #1a1924;
|
||||||
|
|
||||||
--docsearch-primary-color: var(--ifm-color-primary-darkest);
|
--docsearch-primary-color: var(--ifm-color-primary-darkest);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* navbar */
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
color: var(--unleash-navbar-font-color);
|
||||||
|
font-family: Styrene B Web, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-github-link {
|
||||||
|
color: var(--ifm-navbar-link-color);
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 10px;
|
||||||
|
height: 100%;
|
||||||
|
border: 2px solid var(--ifm-navbar-link-color);
|
||||||
|
padding: 0.25rem 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-demo-button {
|
||||||
|
background-color: var(--ifm-color-primary);
|
||||||
|
color: var(--ifm-color-primary-contrast-background);
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
font-size: 1rem;
|
||||||
|
font-weight: 600;
|
||||||
|
text-transform: uppercase;
|
||||||
|
text-align: center;
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar a[href*="http"] svg {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .navbar__link--active:has(.hide-when-active) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar 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
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1150px) {
|
||||||
|
.navbar .hide-at-small-sizes {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 997px) {
|
||||||
|
.show-when-collapsed {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
div[class^="announcementBar_"],
|
div[class^="announcementBar_"],
|
||||||
div[class^="announcementBar_"] svg {
|
div[class^="announcementBar_"] svg {
|
||||||
background-color: var(--ifm-color-primary);
|
background-color: var(--ifm-color-primary);
|
||||||
@ -130,16 +159,48 @@ div[class^="announcementBar_"] svg {
|
|||||||
font-size: larger;
|
font-size: larger;
|
||||||
}
|
}
|
||||||
|
|
||||||
.visually-hidden {
|
/* Main area */
|
||||||
border: 0;
|
|
||||||
clip: rect(0 0 0 0);
|
/* .docs-wrapper {
|
||||||
height: auto;
|
background-color: red;
|
||||||
|
} */
|
||||||
|
|
||||||
|
main {
|
||||||
|
position: relative;
|
||||||
|
background-color: var(--unleash-color-sub-background);
|
||||||
|
|
||||||
|
.container {
|
||||||
|
background-color: var(--ifm-background-color);
|
||||||
margin: 0;
|
margin: 0;
|
||||||
overflow: hidden;
|
border-radius: 8px;
|
||||||
padding: 0;
|
z-index: 1;
|
||||||
position: absolute;
|
|
||||||
width: 1px;
|
@media (min-width: 997px) {
|
||||||
white-space: nowrap;
|
margin: 4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
main:before {
|
||||||
|
/* background-color: red; */
|
||||||
|
background-image: url("/img/mountain-texture.png");
|
||||||
|
position: fixed;
|
||||||
|
display: block;
|
||||||
|
z-index: 0;
|
||||||
|
bottom: 0px;
|
||||||
|
right: 0px;
|
||||||
|
width: 400px;
|
||||||
|
height: 100%;
|
||||||
|
pointer-events: none;
|
||||||
|
user-select: none;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
content: "";
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 997px) {
|
||||||
|
.show-when-collapsed {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
main img {
|
main img {
|
||||||
@ -171,15 +232,14 @@ main
|
|||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* mermaid diagrams */
|
.table-of-contents:before {
|
||||||
.docusaurus-mermaid-container {
|
display: inline-block;
|
||||||
display: flex;
|
width: 100%;
|
||||||
justify-content: center;
|
content: "Table of Contents";
|
||||||
margin-block: calc(1.5 * var(--ifm-spacing-vertical));
|
padding: 5px;
|
||||||
}
|
box-sizing: border-box;
|
||||||
|
background-color: var(--unleash-color-sub-background);
|
||||||
[class^="docTitle"] {
|
text-transform: uppercase;
|
||||||
font-size: 2.5rem !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-sidebar__back {
|
.navbar-sidebar__back {
|
||||||
@ -195,6 +255,10 @@ main
|
|||||||
margin-inline: var(--ifm-spacing-horizontal);
|
margin-inline: var(--ifm-spacing-horizontal);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
li.theme-doc-sidebar-item-category-level-1 > div::before {
|
li.theme-doc-sidebar-item-category-level-1 > div::before {
|
||||||
width: 0.3em;
|
width: 0.3em;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -204,26 +268,6 @@ li.theme-doc-sidebar-item-category-level-1 > div::before {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
}
|
}
|
||||||
|
|
||||||
.docusaurus-highlight-code-line {
|
|
||||||
background-color: rgb(72, 77, 91);
|
|
||||||
display: block;
|
|
||||||
margin: 0 calc(-1 * var(--ifm-pre-padding));
|
|
||||||
padding: 0 var(--ifm-pre-padding);
|
|
||||||
}
|
|
||||||
|
|
||||||
.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;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Video content container */
|
/* Video content container */
|
||||||
|
|
||||||
.unleash-video-container {
|
.unleash-video-container {
|
||||||
@ -238,333 +282,3 @@ li.theme-doc-sidebar-item-category-level-1 > div::before {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* end video content container */
|
/* end video content container */
|
||||||
|
|
||||||
/* Unleash academy content */
|
|
||||||
|
|
||||||
/* breakpoints:
|
|
||||||
show wide: >=1247
|
|
||||||
show narrow: 997-1246
|
|
||||||
show wide: 711-996
|
|
||||||
show narrow: <=710
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* shared academy styles */
|
|
||||||
|
|
||||||
.unleash-academy-level-badge {
|
|
||||||
border: 2px solid;
|
|
||||||
border-radius: 60px;
|
|
||||||
padding-inline: 0.5em;
|
|
||||||
text-transform: capitalize;
|
|
||||||
}
|
|
||||||
|
|
||||||
html[data-theme="light"] .unleash-academy-level-badge {
|
|
||||||
border-color: var(--unleash-logo-purple);
|
|
||||||
color: var(--unleash-logo-purple);
|
|
||||||
}
|
|
||||||
|
|
||||||
html[data-theme="dark"] .unleash-academy-level-badge {
|
|
||||||
border-color: var(--ifm-link-color);
|
|
||||||
color: var(--ifm-link-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-level-container.advanced {
|
|
||||||
background-image: url("/img/unleash-academy/advanced-pixels.svg");
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-level-container.beginners {
|
|
||||||
background-image: url("/img/unleash-academy/beginner-pixels.svg");
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-banner {
|
|
||||||
--banner-padding: calc(var(--ifm-spacing-vertical) * 3);
|
|
||||||
--unleash-academy-logo-width: 85px;
|
|
||||||
--banner-padding: calc(var(--ifm-spacing-vertical) * 3);
|
|
||||||
--banner-font-color: #000;
|
|
||||||
--button-color: var(--unleash-logo-purple);
|
|
||||||
|
|
||||||
margin-block-start: var(--ifm-spacing-vertical);
|
|
||||||
margin-block-end: var(--ifm-spacing-vertical);
|
|
||||||
position: relative;
|
|
||||||
border: var(--ifm-global-border-width) solid var(--ifm-color-emphasis-200);
|
|
||||||
padding: var(--banner-padding);
|
|
||||||
border-radius: var(--ifm-global-radius);
|
|
||||||
background-color: #f1f0fc;
|
|
||||||
background-image: url("/img/unleash-academy/banner-bg-pixels.svg");
|
|
||||||
background-position: top right;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
overflow: hidden;
|
|
||||||
color: var(--banner-font-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
html[data-theme="dark"] .course-banner-container {
|
|
||||||
background-color: inherit;
|
|
||||||
color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.academy-banner-main-text {
|
|
||||||
font-weight: normal;
|
|
||||||
font-size: 1.4em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-banner-list {
|
|
||||||
grid-area: bullets;
|
|
||||||
display: flex;
|
|
||||||
flex-flow: column;
|
|
||||||
gap: calc(var(--ifm-spacing-horizontal) * 2);
|
|
||||||
padding-inline-start: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-banner-list > li {
|
|
||||||
font-weight: bold;
|
|
||||||
list-style-type: none;
|
|
||||||
background-image: url("/img/unleash-academy/bullet-check.svg");
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: left center;
|
|
||||||
padding-left: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-banner-list > li::marker {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-banner-list > li + li {
|
|
||||||
margin-block-start: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 711px) and (max-width: 996px), (min-width: 1247px) {
|
|
||||||
.unleash-academy-banner-list {
|
|
||||||
flex-flow: row;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-action-button {
|
|
||||||
--button-color: #6c65e5;
|
|
||||||
--button-hover-color: #615bc2;
|
|
||||||
display: block;
|
|
||||||
border-radius: var(--ifm-global-radius);
|
|
||||||
width: 100%;
|
|
||||||
background: var(--button-color);
|
|
||||||
color: white;
|
|
||||||
text-align: center;
|
|
||||||
padding: calc(var(--ifm-spacing-horizontal) * 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-action-button:hover {
|
|
||||||
background: var(--button-hover-color);
|
|
||||||
color: white;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* begin certification links */
|
|
||||||
.unleash-academy-links-container {
|
|
||||||
margin-block-start: var(--ifm-spacing-vertical);
|
|
||||||
margin-block-end: var(--ifm-spacing-vertical);
|
|
||||||
--button-background-color: var(--color-purple);
|
|
||||||
--border-color: var(--ifm-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-links {
|
|
||||||
list-style: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
display: flex;
|
|
||||||
flex-flow: column;
|
|
||||||
width: 100%;
|
|
||||||
gap: var(--ifm-spacing-vertical);
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-links-container li:has(article) {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-links-container article {
|
|
||||||
border-radius: var(--ifm-global-radius);
|
|
||||||
border: var(--ifm-global-border-width) solid var(--ifm-color-emphasis-200);
|
|
||||||
padding: calc(var(--ifm-spacing-vertical) * 2);
|
|
||||||
display: grid;
|
|
||||||
grid-template-rows: min-content auto min-content;
|
|
||||||
background-position: top right;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-links-container article .header > * + * {
|
|
||||||
margin-block-start: calc(var(--ifm-spacing-vertical) * 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-links-container article p {
|
|
||||||
font-size: var(--unleash-font-size-smaller);
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 711px) and (max-width: 996px), (min-width: 1247px) {
|
|
||||||
.unleash-academy-links {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(3, 1fr);
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-links-container article {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* End of certification links styles */
|
|
||||||
|
|
||||||
/* Specific styles for the main Unleash academy banner */
|
|
||||||
.academy-general-banner-content {
|
|
||||||
display: grid;
|
|
||||||
grid-template-areas: "header logo" "bullets bullets" "button button";
|
|
||||||
grid-template-columns: auto var(--unleash-academy-logo-width);
|
|
||||||
gap: var(--ifm-spacing-horizontal);
|
|
||||||
}
|
|
||||||
|
|
||||||
.academy-general-banner-content .unleash-action-button {
|
|
||||||
grid-area: button;
|
|
||||||
}
|
|
||||||
|
|
||||||
.academy-general-banner .academy-banner-main-text {
|
|
||||||
grid-area: header;
|
|
||||||
}
|
|
||||||
|
|
||||||
.academy-general-banner .small-logo {
|
|
||||||
grid-area: logo;
|
|
||||||
background-image: url("/img/unleash-academy/academy-logo.svg");
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: center;
|
|
||||||
width: 100%;
|
|
||||||
aspect-ratio: 1;
|
|
||||||
background-size: contain;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 711px) and (max-width: 996px), (min-width: 1247px) {
|
|
||||||
.academy-general-banner-content {
|
|
||||||
grid-template-areas: "header logo" "bullets logo" "button logo";
|
|
||||||
grid-template-columns: 480px auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.academy-general-banner-content .unleash-action-button {
|
|
||||||
width: 240px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.academy-general-banner .small-logo {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.academy-general-banner .big-logo {
|
|
||||||
position: absolute;
|
|
||||||
background-image: url("/img/unleash-academy/academy-logo.svg");
|
|
||||||
bottom: 0;
|
|
||||||
right: 40px;
|
|
||||||
width: 200px;
|
|
||||||
height: 100%;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position-x: left;
|
|
||||||
background-position-y: 190%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* end banner */
|
|
||||||
|
|
||||||
/* course banner-specific styling */
|
|
||||||
.course-banner-container.beginners {
|
|
||||||
background-size: 108px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.course-banner-container.advanced {
|
|
||||||
background-size: 108px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.course-banner-container > * + * {
|
|
||||||
margin-block-start: var(--ifm-spacing-vertical);
|
|
||||||
margin-block-end: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.unleash-academy-level-badge {
|
|
||||||
border: 2px solid;
|
|
||||||
border-radius: 60px;
|
|
||||||
padding-inline: 0.5em;
|
|
||||||
text-transform: capitalize;
|
|
||||||
}
|
|
||||||
|
|
||||||
html[data-theme="light"] .unleash-academy-level-badge {
|
|
||||||
border-color: var(--unleash-logo-purple);
|
|
||||||
color: var(--unleash-logo-purple);
|
|
||||||
}
|
|
||||||
|
|
||||||
html[data-theme="dark"] .unleash-academy-level-badge {
|
|
||||||
border-color: var(--ifm-link-color);
|
|
||||||
color: var(--ifm-link-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* docusaurus-plugin-openapi-docs styling
|
|
||||||
|
|
||||||
Taken from
|
|
||||||
https://github.com/PaloAltoNetworks/docusaurus-openapi-docs/blob/02922a6ad6d635373e01409dac8c17a88da2b72e/demo/src/css/custom.css#L45-L9
|
|
||||||
|
|
||||||
Based on this thread:
|
|
||||||
https://github.com/PaloAltoNetworks/docusaurus-openapi-docs/issues/177
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Sidebar Method labels */
|
|
||||||
.api-method > .menu__link {
|
|
||||||
align-items: center;
|
|
||||||
justify-content: start;
|
|
||||||
}
|
|
||||||
|
|
||||||
.api-method > .menu__link::before {
|
|
||||||
width: 50px;
|
|
||||||
height: 20px;
|
|
||||||
font-size: 12px;
|
|
||||||
line-height: 20px;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-weight: 600;
|
|
||||||
border-radius: 0.25rem;
|
|
||||||
border: 1px solid;
|
|
||||||
border-inline-start-width: 5px;
|
|
||||||
margin-right: var(--ifm-spacing-horizontal);
|
|
||||||
text-align: center;
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.get > .menu__link::before {
|
|
||||||
content: "get";
|
|
||||||
background-color: var(--ifm-color-info-contrast-background);
|
|
||||||
color: var(--ifm-color-info-contrast-foreground);
|
|
||||||
border-color: var(--ifm-color-info-dark);
|
|
||||||
}
|
|
||||||
|
|
||||||
.post > .menu__link::before {
|
|
||||||
content: "post";
|
|
||||||
background-color: var(--ifm-color-success-contrast-background);
|
|
||||||
color: var(--ifm-color-success-contrast-foreground);
|
|
||||||
border-color: var(--ifm-color-success-dark);
|
|
||||||
}
|
|
||||||
|
|
||||||
.delete > .menu__link::before {
|
|
||||||
content: "del";
|
|
||||||
background-color: var(--ifm-color-danger-contrast-background);
|
|
||||||
color: var(--ifm-color-danger-contrast-foreground);
|
|
||||||
border-color: var(--ifm-color-danger-dark);
|
|
||||||
}
|
|
||||||
|
|
||||||
.put > .menu__link::before {
|
|
||||||
content: "put";
|
|
||||||
background-color: var(--ifm-color-warning-contrast-background);
|
|
||||||
color: var(--ifm-color-warning-contrast-foreground);
|
|
||||||
border-color: var(--ifm-color-warning-dark);
|
|
||||||
}
|
|
||||||
|
|
||||||
.patch > .menu__link::before {
|
|
||||||
content: "patch";
|
|
||||||
background-color: var(--ifm-color-success-contrast-background);
|
|
||||||
color: var(--ifm-color-success-contrast-foreground);
|
|
||||||
border-color: var(--ifm-color-success-dark);
|
|
||||||
}
|
|
||||||
|
|
||||||
.head > .menu__link::before {
|
|
||||||
content: "head";
|
|
||||||
background-color: var(--ifm-color-secondary-contrast-background);
|
|
||||||
color: var(--ifm-color-secondary-contrast-foreground);
|
|
||||||
border-color: var(--ifm-color-secondary-dark);
|
|
||||||
}
|
|
||||||
|
|||||||
BIN
website/static/fonts/StyreneB-Regular-Web.woff
Normal file
BIN
website/static/fonts/StyreneB-Regular-Web.woff
Normal file
Binary file not shown.
BIN
website/static/fonts/StyreneB-Regular-Web.woff2
Normal file
BIN
website/static/fonts/StyreneB-Regular-Web.woff2
Normal file
Binary file not shown.
BIN
website/static/img/mountain-texture.png
Normal file
BIN
website/static/img/mountain-texture.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Loading…
Reference in New Issue
Block a user