diff --git a/docs/overviews/images/icon-page-advertisers.svg b/docs/overviews/images/icon-page-advertisers.svg new file mode 100644 index 000000000..01fc6a99f --- /dev/null +++ b/docs/overviews/images/icon-page-advertisers.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/docs/overviews/images/icon-page-dataproviders.svg b/docs/overviews/images/icon-page-dataproviders.svg new file mode 100644 index 000000000..5e205be1b --- /dev/null +++ b/docs/overviews/images/icon-page-dataproviders.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/docs/overviews/images/icon-page-dsps.svg b/docs/overviews/images/icon-page-dsps.svg new file mode 100644 index 000000000..466791fc9 --- /dev/null +++ b/docs/overviews/images/icon-page-dsps.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/docs/overviews/images/icon-page-publishers.svg b/docs/overviews/images/icon-page-publishers.svg new file mode 100644 index 000000000..e5dbca870 --- /dev/null +++ b/docs/overviews/images/icon-page-publishers.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/docs/overviews/overview-advertisers.md b/docs/overviews/overview-advertisers.md index d4d089af6..cf2e93c8c 100644 --- a/docs/overviews/overview-advertisers.md +++ b/docs/overviews/overview-advertisers.md @@ -6,6 +6,9 @@ sidebar_position: 04 use_banner: true banner_title: UID2 Overview for Advertisers banner_description: Upgrade campaign activation with Unified ID 2.0. +banner_icon: 'documents' +banner_background_color: '#7085D4' +banner_background_color_dark: '#7085D4' displayed_sidebar: sidebarAdvertisers --- diff --git a/docs/overviews/overview-data-providers.md b/docs/overviews/overview-data-providers.md index bad931f63..166560d86 100644 --- a/docs/overviews/overview-data-providers.md +++ b/docs/overviews/overview-data-providers.md @@ -6,6 +6,9 @@ sidebar_position: 08 use_banner: true banner_title: UID2 Overview for Data Providers banner_description: An identity solution for the future. +banner_icon: 'documents' +banner_background_color: '#10692E' +banner_background_color_dark: '#10692E' displayed_sidebar: sidebarDataProviders --- diff --git a/docs/overviews/overview-dsps.md b/docs/overviews/overview-dsps.md index a5109c378..8a764e96e 100644 --- a/docs/overviews/overview-dsps.md +++ b/docs/overviews/overview-dsps.md @@ -6,6 +6,9 @@ sidebar_position: 06 use_banner: true banner_title: UID2 Overview for DSPs banner_description: Enable data strategies with a more durable identifier. +banner_icon: 'documents' +banner_background_color: '#0459FC' +banner_background_color_dark: '#0459FC' displayed_sidebar: sidebarDSPs --- diff --git a/docs/overviews/overview-publishers.md b/docs/overviews/overview-publishers.md index 7d4f218f0..de0d3313a 100644 --- a/docs/overviews/overview-publishers.md +++ b/docs/overviews/overview-publishers.md @@ -6,11 +6,13 @@ sidebar_position: 02 use_banner: true banner_title: UID2 Overview for Publishers banner_description: Maintain audience targeting in the ever-changing advertising industry for better impression monetization and more relevance. +banner_icon: 'documents' +banner_background_color: '#035959' +banner_background_color_dark: '#035959' displayed_sidebar: sidebarPublishers --- import IntegratingWithSSO from '/docs/snippets/_integrating-with-sso.mdx'; - import Link from '@docusaurus/Link'; As a publisher, you can benefit from the cross-device presence of Unified ID 2.0 (UID2) and take advantage of a consistent identity fabric on all your inventory. diff --git a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-advertisers.md b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-advertisers.md index a17791fe9..efb8eb34b 100644 --- a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-advertisers.md +++ b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-advertisers.md @@ -6,6 +6,9 @@ sidebar_position: 04 use_banner: true banner_title: 広告主向け UID2 の概要 banner_description: Unified ID 2.0 でキャンペーンのアクティベーションをアップグレードしましょう。 +banner_icon: 'documents' +banner_background_color: '#7085D4' +banner_background_color_dark: '#7085D4' displayed_sidebar: sidebarAdvertisers --- diff --git a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-data-providers.md b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-data-providers.md index 7b7060c18..79aba3c86 100644 --- a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-data-providers.md +++ b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-data-providers.md @@ -6,6 +6,9 @@ sidebar_position: 08 use_banner: true banner_title: データプロバイダー向け UID2 の概要 banner_description: 未来のためのIDソリューション。 +banner_icon: 'documents' +banner_background_color: '#10692E' +banner_background_color_dark: '#10692E' displayed_sidebar: sidebarDataProviders --- diff --git a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-dsps.md b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-dsps.md index 003b18371..ff0a2b928 100644 --- a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-dsps.md +++ b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-dsps.md @@ -6,6 +6,9 @@ sidebar_position: 06 use_banner: true banner_title: UID2 Overview for DSPs banner_description: より耐久性のある識別子でデータ戦略を可能に。 +banner_icon: 'documents' +banner_background_color: '#0459FC' +banner_background_color_dark: '#0459FC' displayed_sidebar: sidebarDSPs --- diff --git a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-publishers.md b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-publishers.md index 4f05bbd6a..30ed36c12 100644 --- a/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-publishers.md +++ b/i18n/ja/docusaurus-plugin-content-docs/current/overviews/overview-publishers.md @@ -6,6 +6,9 @@ sidebar_position: 02 use_banner: true banner_title: パブリッシャー向け UID2 概要 banner_description: 変化し続ける広告業界においてオーディエンスターゲティングを維持し、より良いインプレッション収益化と関連性の向上を実現。 +banner_icon: 'documents' +banner_background_color: '#035959' +banner_background_color_dark: '#035959' displayed_sidebar: sidebarPublishers --- diff --git a/src/components/DocsBanner/index.tsx b/src/components/DocsBanner/index.tsx index 9b0dde68d..927bf8a86 100644 --- a/src/components/DocsBanner/index.tsx +++ b/src/components/DocsBanner/index.tsx @@ -1,32 +1,54 @@ -import React from "react"; +import React, { CSSProperties, ComponentType, SVGProps } from "react"; import clsx from "clsx"; import styles from "./styles.module.scss"; import DocumentsSvg from "@site/static/img/documents-icon.svg"; +const icons: Record>> = { + documents: DocumentsSvg, +}; + type DocsBannerProps = { title: string; description: string; + icon?: string; + backgroundColor?: string; + backgroundColorDark?: string; }; export default function DocsBanner({ title, description, + icon, + backgroundColor, + backgroundColorDark, }: DocsBannerProps): JSX.Element { + const Icon = (icon && icons[icon]) || icons.documents; + + backgroundColor ||= "var(--c-dirty-socks)"; // default banner bg color + backgroundColorDark ||= "var(--c-primary-gray)"; // default banner bg color dark theme + //remove the dulpicate html
+ h1 tags within the .markdown React.useEffect(() => { const header = document.querySelector(".markdown > header"); - if (header) { - header.remove(); - } + if (header) header.remove(); }, []); return ( -
+

{title}

{description}

- + +
); } diff --git a/src/components/DocsBanner/styles.module.scss b/src/components/DocsBanner/styles.module.scss index 54e1e7c1a..ac3935bdd 100644 --- a/src/components/DocsBanner/styles.module.scss +++ b/src/components/DocsBanner/styles.module.scss @@ -3,7 +3,7 @@ padding: 1.25rem; display: flex; flex-direction: column; - background-color: var(--c-dirty-socks); + background-color: var(--bg-docs-banner); // var is set in html styles margin-bottom: 1.875rem; align-items: center; diff --git a/src/theme/DocItem/Layout/index.tsx b/src/theme/DocItem/Layout/index.tsx index 7b077cad2..8280d567c 100644 --- a/src/theme/DocItem/Layout/index.tsx +++ b/src/theme/DocItem/Layout/index.tsx @@ -21,6 +21,9 @@ type CustomDocFrontMatter = DocFrontMatter & { use_banner?: boolean; banner_title?: string; banner_description?: string; + banner_icon?: string; + banner_background_color?: string; + banner_background_color_dark?: string; }; /** @@ -83,7 +86,15 @@ export default function DocItemLayout({ children }: Props): JSX.Element { {docTOC.mobile} {useBanner && ( - + )} {children} @@ -95,4 +106,4 @@ export default function DocItemLayout({ children }: Props): JSX.Element { {docTOC.desktop &&
{docTOC.desktop}
} ); -} +} \ No newline at end of file