diff --git a/crowdsec-docs/docusaurus.config.ts b/crowdsec-docs/docusaurus.config.ts index a6c815100..5a6133218 100644 --- a/crowdsec-docs/docusaurus.config.ts +++ b/crowdsec-docs/docusaurus.config.ts @@ -107,24 +107,34 @@ const NAVBAR_ITEMS: NavbarItem[] = [ position: "left", label: "FAQ/Troubleshooting", }, + { + href: "https://roadmap.crowdsec.net", + position: "right", + title: "Features Roadmap", + className: "header-roadmap-link header-icon-link invert dark:invert-0", + }, { href: "https://github.com/crowdsecurity/crowdsec", position: "right", + title: "GitHub CrowdSecurity", className: "header-github-link header-icon-link invert dark:invert-0", }, { href: "https://discord.gg/wGN7ShmEE8", position: "right", + title: "Discord Community", className: "header-discord-link invert dark:invert-0", }, { href: "https://discourse.crowdsec.net", position: "right", + title: "Discourse Community", className: "header-discourse-link invert dark:invert-0", }, { href: "https://hub.crowdsec.net/", position: "right", + title: "CrowdSec Hub", className: "header-hub-link dark:invert", }, ]; diff --git a/crowdsec-docs/src/css/navbar.css b/crowdsec-docs/src/css/navbar.css index 8d5ca217a..5058f6cd5 100644 --- a/crowdsec-docs/src/css/navbar.css +++ b/crowdsec-docs/src/css/navbar.css @@ -38,14 +38,14 @@ html[data-theme="light"] .navbar-sidebar__item > .menu__list .menu__caret::befor --ifm-menu-link-sublist-icon: url('data:image/svg+xml;utf8,'); } -.header-discord-link:before { - content: "Discord"; +.header-roadmap-link:before { + content: "Roadmap"; padding-left: 1.5rem !important; padding-right: 0 !important; color: white; background: no-repeat left / 22% - url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20fill%3D%22%23ffffff%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224px%22%20height%3D%2224px%22%3E%20%20%20%20%3Cpath%20d%3D%22M19.952%2C5.672c-1.904-1.531-4.916-1.79-5.044-1.801c-0.201-0.017-0.392%2C0.097-0.474%2C0.281%20c-0.006%2C0.012-0.072%2C0.163-0.145%2C0.398c1.259%2C0.212%2C2.806%2C0.64%2C4.206%2C1.509c0.224%2C0.139%2C0.293%2C0.434%2C0.154%2C0.659%20c-0.09%2C0.146-0.247%2C0.226-0.407%2C0.226c-0.086%2C0-0.173-0.023-0.252-0.072C15.584%2C5.38%2C12.578%2C5.305%2C12%2C5.305S8.415%2C5.38%2C6.011%2C6.872%20c-0.225%2C0.14-0.519%2C0.07-0.659-0.154c-0.14-0.225-0.07-0.519%2C0.154-0.659c1.4-0.868%2C2.946-1.297%2C4.206-1.509%20c-0.074-0.236-0.14-0.386-0.145-0.398C9.484%2C3.968%2C9.294%2C3.852%2C9.092%2C3.872c-0.127%2C0.01-3.139%2C0.269-5.069%2C1.822%20C3.015%2C6.625%2C1%2C12.073%2C1%2C16.783c0%2C0.083%2C0.022%2C0.165%2C0.063%2C0.237c1.391%2C2.443%2C5.185%2C3.083%2C6.05%2C3.111c0.005%2C0%2C0.01%2C0%2C0.015%2C0%20c0.153%2C0%2C0.297-0.073%2C0.387-0.197l0.875-1.202c-2.359-0.61-3.564-1.645-3.634-1.706c-0.198-0.175-0.217-0.477-0.042-0.675%20c0.175-0.198%2C0.476-0.217%2C0.674-0.043c0.029%2C0.026%2C2.248%2C1.909%2C6.612%2C1.909c4.372%2C0%2C6.591-1.891%2C6.613-1.91%20c0.198-0.172%2C0.5-0.154%2C0.674%2C0.045c0.174%2C0.198%2C0.155%2C0.499-0.042%2C0.673c-0.07%2C0.062-1.275%2C1.096-3.634%2C1.706l0.875%2C1.202%20c0.09%2C0.124%2C0.234%2C0.197%2C0.387%2C0.197c0.005%2C0%2C0.01%2C0%2C0.015%2C0c0.865-0.027%2C4.659-0.667%2C6.05-3.111%20C22.978%2C16.947%2C23%2C16.866%2C23%2C16.783C23%2C12.073%2C20.985%2C6.625%2C19.952%2C5.672z%20M8.891%2C14.87c-0.924%2C0-1.674-0.857-1.674-1.913%20s0.749-1.913%2C1.674-1.913s1.674%2C0.857%2C1.674%2C1.913S9.816%2C14.87%2C8.891%2C14.87z%20M15.109%2C14.87c-0.924%2C0-1.674-0.857-1.674-1.913%20s0.749-1.913%2C1.674-1.913c0.924%2C0%2C1.674%2C0.857%2C1.674%2C1.913S16.033%2C14.87%2C15.109%2C14.87z%22%2F%3E%3C%2Fsvg%3E"); + url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolygon points='16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76' fill='white'/%3E%3C/svg%3E"); } .header-github-link:before { @@ -58,6 +58,16 @@ html[data-theme="light"] .navbar-sidebar__item > .menu__list .menu__caret::befor 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"); } +.header-discord-link:before { + content: "Discord"; + padding-left: 1.5rem !important; + padding-right: 0 !important; + color: white; + background: + no-repeat left / 22% + url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20fill%3D%22%23ffffff%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224px%22%20height%3D%2224px%22%3E%20%20%20%20%3Cpath%20d%3D%22M19.952%2C5.672c-1.904-1.531-4.916-1.79-5.044-1.801c-0.201-0.017-0.392%2C0.097-0.474%2C0.281%20c-0.006%2C0.012-0.072%2C0.163-0.145%2C0.398c1.259%2C0.212%2C2.806%2C0.64%2C4.206%2C1.509c0.224%2C0.139%2C0.293%2C0.434%2C0.154%2C0.659%20c-0.09%2C0.146-0.247%2C0.226-0.407%2C0.226c-0.086%2C0-0.173-0.023-0.252-0.072C15.584%2C5.38%2C12.578%2C5.305%2C12%2C5.305S8.415%2C5.38%2C6.011%2C6.872%20c-0.225%2C0.14-0.519%2C0.07-0.659-0.154c-0.14-0.225-0.07-0.519%2C0.154-0.659c1.4-0.868%2C2.946-1.297%2C4.206-1.509%20c-0.074-0.236-0.14-0.386-0.145-0.398C9.484%2C3.968%2C9.294%2C3.852%2C9.092%2C3.872c-0.127%2C0.01-3.139%2C0.269-5.069%2C1.822%20C3.015%2C6.625%2C1%2C12.073%2C1%2C16.783c0%2C0.083%2C0.022%2C0.165%2C0.063%2C0.237c1.391%2C2.443%2C5.185%2C3.083%2C6.05%2C3.111c0.005%2C0%2C0.01%2C0%2C0.015%2C0%20c0.153%2C0%2C0.297-0.073%2C0.387-0.197l0.875-1.202c-2.359-0.61-3.564-1.645-3.634-1.706c-0.198-0.175-0.217-0.477-0.042-0.675%20c0.175-0.198%2C0.476-0.217%2C0.674-0.043c0.029%2C0.026%2C2.248%2C1.909%2C6.612%2C1.909c4.372%2C0%2C6.591-1.891%2C6.613-1.91%20c0.198-0.172%2C0.5-0.154%2C0.674%2C0.045c0.174%2C0.198%2C0.155%2C0.499-0.042%2C0.673c-0.07%2C0.062-1.275%2C1.096-3.634%2C1.706l0.875%2C1.202%20c0.09%2C0.124%2C0.234%2C0.197%2C0.387%2C0.197c0.005%2C0%2C0.01%2C0%2C0.015%2C0c0.865-0.027%2C4.659-0.667%2C6.05-3.111%20C22.978%2C16.947%2C23%2C16.866%2C23%2C16.783C23%2C12.073%2C20.985%2C6.625%2C19.952%2C5.672z%20M8.891%2C14.87c-0.924%2C0-1.674-0.857-1.674-1.913%20s0.749-1.913%2C1.674-1.913s1.674%2C0.857%2C1.674%2C1.913S9.816%2C14.87%2C8.891%2C14.87z%20M15.109%2C14.87c-0.924%2C0-1.674-0.857-1.674-1.913%20s0.749-1.913%2C1.674-1.913c0.924%2C0%2C1.674%2C0.857%2C1.674%2C1.913S16.033%2C14.87%2C15.109%2C14.87z%22%2F%3E%3C%2Fsvg%3E"); +} + .header-discourse-link:before { content: "Forum"; padding-left: 1.5rem !important; @@ -79,6 +89,7 @@ html[data-theme="light"] .navbar-sidebar__item > .menu__list .menu__caret::befor /* On wide screens (desktop), remove text content for icon-only display */ @media (min-width: 1401px) { + .header-roadmap-link:before, .header-discord-link:before, .header-github-link:before, .header-discourse-link:before { diff --git a/crowdsec-docs/src/pages/index.tsx b/crowdsec-docs/src/pages/index.tsx index f550d70ae..4798d40f1 100644 --- a/crowdsec-docs/src/pages/index.tsx +++ b/crowdsec-docs/src/pages/index.tsx @@ -24,18 +24,23 @@ const HomePageHeader = (): React.JSX.Element => {
+ + +