mirror of
https://github.com/datahub-project/datahub.git
synced 2025-08-31 04:25:29 +00:00
docs: remove navbar overwrite (#14494)
This commit is contained in:
Hyejin Yoon
GitHub
parent
4a1bab6015
commit
4a283a07bd
@ -132,87 +132,6 @@ module.exports = {
|
||||
label: "Integrations",
|
||||
position: "right",
|
||||
},
|
||||
// {
|
||||
// type: "dropdown",
|
||||
// activeBasePath: "learn",
|
||||
// label: "Learn",
|
||||
// position: "right",
|
||||
// items: [
|
||||
// {
|
||||
// to: "https://pages.acryl.io/webinar-governance-ai-5",
|
||||
// label: "Weekly Demo",
|
||||
// },
|
||||
// {
|
||||
// to: "/learn",
|
||||
// label: "Use Cases",
|
||||
// },
|
||||
// {
|
||||
// to: "/adoption-stories",
|
||||
// label: "Adoption Stories",
|
||||
// },
|
||||
// {
|
||||
// href: "https://medium.com/datahub-project",
|
||||
// label: "Blog",
|
||||
// },
|
||||
// {
|
||||
// href: "https://www.youtube.com/channel/UC3qFQC5IiwR5fvWEqi_tJ5w",
|
||||
// label: "YouTube",
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// type: "dropdown",
|
||||
// label: "Community",
|
||||
// position: "right",
|
||||
// items: [
|
||||
// {
|
||||
// href: "https://datahub.com/slack?utm_source=docs&utm_medium=header&utm_campaign=docs_header",
|
||||
// label: "Join Slack",
|
||||
// },
|
||||
// {
|
||||
// to: "/events",
|
||||
// label: "Events",
|
||||
// },
|
||||
// {
|
||||
// to: "/champions",
|
||||
// label: "Champions",
|
||||
// },
|
||||
// {
|
||||
// label: "Share Your Journey",
|
||||
// href: "/customer-stories-survey",
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
{
|
||||
href: "https://datahub.com/products/why-datahub-cloud/",
|
||||
html: `
|
||||
<style>
|
||||
.cloud-cta {
|
||||
color: var(--ifm-menu-color-active);
|
||||
font-weight: 600;
|
||||
background: linear-gradient(40deg, var(--ifm-menu-color-active), var(--ifm-menu-color-active));
|
||||
background-size: 200% 100%;
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
transition: background-image 0.3s ease;
|
||||
}
|
||||
.cloud-cta:hover {
|
||||
color: transparent;
|
||||
background: linear-gradient(40deg, var(--ifm-menu-color-active), #ff1493);
|
||||
background-size: 200% 100%;
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
animation: gradientShift 3s ease infinite;
|
||||
}
|
||||
@keyframes gradientShift {
|
||||
0%, 100% { background-position: 0% 50%; }
|
||||
50% { background-position: 100% 50%; }
|
||||
}
|
||||
</style>
|
||||
<div class='cloud-cta'>Get Cloud</div>
|
||||
`,
|
||||
position: "right",
|
||||
},
|
||||
{
|
||||
type: "docsVersionDropdown",
|
||||
position: "left",
|
||||
@ -312,6 +231,18 @@ module.exports = {
|
||||
`,
|
||||
position: "right",
|
||||
},
|
||||
{
|
||||
href: "https://github.com/datahub-project/datahub",
|
||||
html: `
|
||||
<style>
|
||||
.github-logo:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
</style>
|
||||
<img class='github-logo' src='https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg', alt='slack', height='20px' style='margin: 10px 0 0 0;'/>
|
||||
`,
|
||||
position: "right",
|
||||
},
|
||||
],
|
||||
},
|
||||
footer: {
|
||||
|
||||
@ -1,116 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
import React, {type ReactNode} from 'react';
|
||||
import {useThemeConfig, ErrorCauseBoundary} from '@docusaurus/theme-common';
|
||||
import {
|
||||
splitNavbarItems,
|
||||
useNavbarMobileSidebar,
|
||||
} from '@docusaurus/theme-common/internal';
|
||||
import NavbarItem, {type Props as NavbarItemConfig} 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 CardDropdown from '../../../components/CardDropdown/CardDropdown';
|
||||
import learnCardDropdownContent from '../learnCardDropdownContent';
|
||||
import communityCardDropdownContent from '../communityCardDropdownContent';
|
||||
|
||||
import styles from './styles.module.css';
|
||||
|
||||
function useNavbarItems() {
|
||||
// TODO temporary casting until ThemeConfig type is improved
|
||||
return useThemeConfig().navbar.items as NavbarItemConfig[];
|
||||
}
|
||||
|
||||
function NavbarItems({items}: {items: NavbarItemConfig[]}): JSX.Element {
|
||||
return (
|
||||
<>
|
||||
{items.map((item, i) => (
|
||||
<ErrorCauseBoundary
|
||||
key={i}
|
||||
onError={(error) =>
|
||||
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},
|
||||
)
|
||||
}>
|
||||
<NavbarItem {...item} />
|
||||
</ErrorCauseBoundary>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function NavbarContentLayout({
|
||||
left,
|
||||
right,
|
||||
}: {
|
||||
left: ReactNode;
|
||||
right: ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<div className="navbar__inner">
|
||||
<div className="navbar__items">{left}</div>
|
||||
<div className="navbar__items navbar__items--right">{right}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function NavbarContent(): JSX.Element {
|
||||
const mobileSidebar = useNavbarMobileSidebar();
|
||||
|
||||
const items = useNavbarItems();
|
||||
const [leftItems, rightItems] = splitNavbarItems(items);
|
||||
|
||||
// among the right items, pick items except "Solution", "Learn", "Community"
|
||||
const rightItemsDropdown = rightItems.filter(
|
||||
(item) =>
|
||||
item.label == 'Integrations' ||
|
||||
item.label == 'Docs'
|
||||
);
|
||||
|
||||
// pick items without labels
|
||||
const rightItemsCTA = rightItems.filter(
|
||||
(item) =>
|
||||
item.label == undefined
|
||||
);
|
||||
|
||||
const searchBarItem = items.find((item) => item.type === 'search');
|
||||
|
||||
return (
|
||||
<NavbarContentLayout
|
||||
left={
|
||||
// TODO stop hardcoding items?
|
||||
<>
|
||||
{!mobileSidebar.disabled && <NavbarMobileSidebarToggle />}
|
||||
<NavbarLogo />
|
||||
<NavbarItems items={leftItems} />
|
||||
</>
|
||||
}
|
||||
right={
|
||||
// TODO stop hardcoding items?
|
||||
// Ask the user to add the respective navbar items => more flexible
|
||||
<>
|
||||
<NavbarItems items={rightItemsDropdown} />
|
||||
<CardDropdown label="Learn" items={learnCardDropdownContent} />
|
||||
<CardDropdown label= "Community" items={communityCardDropdownContent} />
|
||||
<NavbarItems items={rightItemsCTA} />
|
||||
<NavbarColorModeToggle className={styles.colorModeToggle} />
|
||||
{!searchBarItem && (
|
||||
<NavbarSearch>
|
||||
<SearchBar />
|
||||
</NavbarSearch>
|
||||
)}
|
||||
</>
|
||||
}
|
||||
/>
|
||||
);
|
||||
}
|
||||
@ -1,8 +0,0 @@
|
||||
/*
|
||||
Hide color mode toggle in small viewports
|
||||
*/
|
||||
@media (max-width: 996px) {
|
||||
.colorModeToggle {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@ -1,24 +0,0 @@
|
||||
const communityCardDropdownContent = [
|
||||
{
|
||||
title: "Join Slack",
|
||||
iconImage: "/img/icon-join-slack.png",
|
||||
href: "https://datahub.com/slack/",
|
||||
},
|
||||
{
|
||||
title: "Events",
|
||||
iconImage: "/img/icon-events.png",
|
||||
href: "https://datahub.com/events/",
|
||||
},
|
||||
{
|
||||
title: "Champions",
|
||||
iconImage: "/img/icon-champions.png",
|
||||
href: "https://datahub.com/champions/",
|
||||
},
|
||||
{
|
||||
title: "Share Your Journey",
|
||||
iconImage: "/img/icon-share-your-journey.png",
|
||||
href: "https://datahub.com/share-your-journey/",
|
||||
}
|
||||
]
|
||||
|
||||
export default communityCardDropdownContent
|
||||
@ -1,29 +0,0 @@
|
||||
const learnCardDropdownContent = [
|
||||
{
|
||||
title: "Weekly Demo",
|
||||
iconImage: "/img/icon-join-slack.png",
|
||||
href: "https://datahub.com/weekly-demo/",
|
||||
},
|
||||
{
|
||||
title: "Use Cases",
|
||||
iconImage: "/img/icon-forum.png",
|
||||
href: "https://datahub.com/use-cases/",
|
||||
},
|
||||
{
|
||||
title: "Adoption Stories",
|
||||
iconImage: "/img/icon-events.png",
|
||||
href: "https://datahub.com/resources/?2004611554=dh-stories",
|
||||
},
|
||||
{
|
||||
title: "Blog",
|
||||
iconImage: "/img/icon-champions.png",
|
||||
href: "https://datahub.com/resources/?2004611554=post",
|
||||
},
|
||||
{
|
||||
title: "Youtube",
|
||||
iconImage: "/img/icon-share-your-journey.png",
|
||||
href: "http://www.youtube.com/channel/UC3qFQC5IiwR5fvWEqi_tJ5w",
|
||||
}
|
||||
]
|
||||
|
||||
export default learnCardDropdownContent
|
||||
Loading…
x
Reference in New Issue
Block a user