github.com/kubeshop/testkube@v1.17.23/docs/src/theme/Navbar/index.js (about) 1 import React from "react"; 2 import Navbar from "@theme-original/Navbar"; 3 import {useThemeConfig} from "@docusaurus/theme-common"; 4 import {useAnnouncementBar, useNavbarMobileSidebar} from "@docusaurus/theme-common/internal"; 5 6 import styles from "./styles.module.css"; 7 8 export default function NavbarWrapper() { 9 const {announcementBar} = useThemeConfig(); 10 const {isActive, close} = useAnnouncementBar(); 11 const mobileSidebar = useNavbarMobileSidebar(); 12 13 if (!isActive) { 14 return <Navbar />; 15 } 16 17 return ( 18 <> 19 <Navbar /> 20 <div 21 id={announcementBar.id} 22 className={styles.announcement} 23 style={{ 24 '--announcementBar-color': announcementBar.textColor, 25 '--announcementBar-background': announcementBar.backgroundColor, 26 }} 27 aria-disabled={mobileSidebar.shown} 28 > 29 <div className={styles.announcementContent} dangerouslySetInnerHTML={{__html: announcementBar.content}} /> 30 {announcementBar.isCloseable ? <button className={styles.announcementClose} onClick={close}>×</button> : null} 31 </div> 32 </> 33 ); 34 }