diff --git a/src/components/config/ConfigurationStructureDiagram.tsx b/src/components/config/ConfigurationStructureDiagram.tsx index 6847b07ef..3dfc973e2 100644 --- a/src/components/config/ConfigurationStructureDiagram.tsx +++ b/src/components/config/ConfigurationStructureDiagram.tsx @@ -1,5 +1,6 @@ import React, { useState } from "react"; import "@site/src/css/configuration-explorer-layout.css"; +// @ts-ignore import { Icon } from "@iconify/react"; import Link from "@docusaurus/Link"; import clsx from "clsx"; @@ -13,6 +14,7 @@ interface ExplorerNode { children?: ExplorerNode[]; description?: string; url?: string; + external?: boolean; } const folderData: ExplorerNode[] = [ @@ -44,6 +46,7 @@ const folderData: ExplorerNode[] = [ type: "folder", description: "Used to store remapped plugins. (Learn more)", url: "https://forums.papermc.io/threads/important-dev-psa-future-removal-of-cb-package-relocation.1106/", + external: true, }, ], }, @@ -130,6 +133,7 @@ export default function ConfigurationStructureDiagram(): JSX.Element { const isFolder = node.type === "folder"; const hasDescription = "description" in node; const hasUrl = "url" in node; + const isExternal = node.external; const handleNodeOpening = (event: React.MouseEvent) => { event.stopPropagation(); @@ -150,7 +154,8 @@ export default function ConfigurationStructureDiagram(): JSX.Element { className={clsx( !isFolder && "config-explorer-file-node", isFolder && "config-explorer-file-folder-node", - hasUrl && "config-explorer-file-node-with-link" + hasUrl && "config-explorer-file-node-with-link", + isExternal && "config-explorer-file-folder-node-with-link", )} to={node.url} > diff --git a/src/css/configuration-explorer-layout.css b/src/css/configuration-explorer-layout.css index 453192205..5704ef6d4 100644 --- a/src/css/configuration-explorer-layout.css +++ b/src/css/configuration-explorer-layout.css @@ -39,6 +39,19 @@ color: var(--config-node-highlight-text-color); } +/* File Folder Node with Link */ +.config-explorer-file-folder-node-with-link { + font-weight: bold; + color: var(--ifm-link-color); +} + +.config-explorer-file-folder-node-with-link:hover { + background-color: rgba(0, 0, 0, 0.1); + cursor: pointer; + text-decoration: none; + color: var(--ifm-link-color); +} + /* Popup Window Container */ .config-explorer-popup-window-container { position: absolute;