It like actually works now TM

PaperMC · Feb 22, 2024 · 1d9d278 · 1d9d278
1 parent 16779fa
commit 1d9d278
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 33 deletions.
diff --git a/src/components/ConfigurationStructureDiagram.tsx b/src/components/ConfigurationStructureDiagram.tsx
@@ -21,24 +21,24 @@ const folderData = [
             { name: "paper-world.yml", url: "/paper/reference/configuration#per-world-values" },
         ],
     },
-    { name: "banned-ips.json", type: "file", description: "WIP" },
-    { name: "banned-players.json", type: "file", description: "WIP" },
+    { name: "banned-ips.json", type: "file", description: "This file stores all the banned IP addresses on the server." },
+    { name: "banned-players.json", type: "file", description: "This file stores all the banned player information for the server." },
     { name: "bukkit.yml", type: "file", url: "/paper/reference/bukkit-configuration" },
-    { name: "commands.yml", type: "file", url: "WIP" },
+    { name: "commands.yml", type: "file", url: "/paper/reference/bukkit-commands-configuration" },
     { name: "eula.txt", type: "file", description: "This file is in place to allow you to accept the Minecraft EULA.\nThis is required to start the server." },
-    { name: "help.yml", type: "file", url: "WIP" },
-    { name: "ops.json", type: "file", description: "WIP" },
-    { name: "permissions.yml", type: "file", url: "WIP" },
+    { name: "help.yml", type: "file", description: "This file provides you with a wide variety of ways to configure the /help system in your Paper Server." },
+    { name: "ops.json", type: "file", description: "ops.json is a JSON file located in the root directory of a server containing a list of players with operator status." },
+    { name: "permissions.yml", type: "file", description: "The permissions.yml file allows creating of permission nodes so that server admins can easily distribute permissions." },
     { name: "server.properties", type: "file", url: "/paper/reference/server-properties" },
     { name: "spigot.yml", type: "file", url: "/paper/reference/spigot-configuration" },
-    { name: "usercache.json", type: "file", description: "WIP" },
-    { name: "whitelist.json", type: "file", description: "WIP" },
+    { name: "usercache.json", type: "file", description: "This file acts as a cache of user information that has been requested from Mojang's servers when they join the server or their texture is used as a Head." },
+    { name: "whitelist.json", type: "file", description: "This is is a server configuration file that stores the usernames of players who have been whitelisted on a server." },
 ];
 
 const IndentationArrow = ({ level }) => {
 
     if (level === 0) {
-        return (<></>);
+        return null;
     }
 
     const arrowStyle = {
@@ -50,7 +50,7 @@ const IndentationArrow = ({ level }) => {
 
     return (
         <span style={arrowStyle}>
-            {level > 0 && Array(level).fill("→").join("")}
+            {level > 0 && "→".repeat(level)}
         </span>
     );
 };
@@ -67,47 +67,33 @@ export default function ConfigurationStructureDiagram({}) {
         const hasDescription = "description" in node;
         const hasUrl = "url" in node;
 
-        const nodeStyle = {
-            alignItems: "center",
-            position: "relative",
-        };
-
-        if (level > 0) {
-            nodeStyle.display = "flex";
-        }
-
-        const iconStyle = {
-            fontSize: "20px",
-            cursor: hasDescription ? "pointer" : "auto",
-        };
-
         const handleNodeOpening = (event) => {
             event.stopPropagation();
             setPopupNode(node);
         };
 
         return (
-            <div key={node.name} style={nodeStyle} onMouseLeave={closePopup}>
+            <div key={node.name} className={level > 0 ? "config-explorer-node" : "config-explorer-node-noflex"} onMouseLeave={closePopup}>
 
                 {level > 0 && (
                     <IndentationArrow level={level} />
                 )}
 
-                <a className={`${(isFolder ? "config-explorer-file-folder-node" : "config-explorer-file-node")} ${(!hasUrl ? "config-explorer-file-node" : "config-explorer-file-node-with-link")}`} href={node.url}
+                <a className={`${(isFolder ? "config-explorer-file-folder-node" : "config-explorer-file-node")} 
+                   ${(!hasUrl ? "config-explorer-file-node" : "config-explorer-file-node-with-link")}`} href={node.url}
                    style={{cursor: hasUrl ? "pointer" : "default"}}>
 
-                    <span style={iconStyle}>{isFolder ? "📁" : "📄"}</span>
+                    <span style={{cursor: hasDescription ? "pointer" : "auto"}} className={"config-explorer-node-icon"}>{isFolder ? "📁" : "📄"}</span>
                     <span style={{ margin: "0 5px 0 5px" }}>{node.name}</span>
                     {hasDescription && (
                         <span className={"config-explorer-popup-window-open-tag"} onMouseEnter={handleNodeOpening}>ⓘ</span>
                     )}
-
                 </a>
 
                 {hasDescription && (
                     <div className={"config-explorer-popup-window-container"}>
                         <div className={"config-explorer-popup-window"}
-                             /*style={{ display: popupNode === node ? "block" : "none" }}*/>
+                             style={{ display: popupNode === node ? "block" : "none" }}>
                             <strong>Description:</strong><br/>{node.description}
                         </div>
                     </div>

diff --git a/src/css/custom.css b/src/css/custom.css
@@ -326,7 +326,8 @@ ul.yaml-list-elem > li:before {
   color: var(--config-node-highlight-text-color);
 }
 
-.config-explorer-popup-window-container { /* Container */
+.config-explorer-popup-window-container {
+  /* Container */
   position: absolute;
   margin-left: 30px;
   transform: translateZ(0);
@@ -336,7 +337,8 @@ ul.yaml-list-elem > li:before {
   z-index: 10;
 }
 
-.config-explorer-popup-window { /* Inner */
+.config-explorer-popup-window {
+  /* Inner */
   background-color: #1c1e21;
   padding: 10px;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
@@ -346,11 +348,27 @@ ul.yaml-list-elem > li:before {
   z-index: 20;
 }
 
-.config-explorer-popup-window-open-tag { /* (i) tag */
-  z-index: 15; /* Between container and popup window */
+.config-explorer-popup-window-open-tag {
+  /* (i) tag */
+  z-index: 5;
 }
 
 .config-explorer-popup-window-open-tag:hover {
   font-weight: bold;
   cursor: pointer;
 }
+
+.config-explorer-node-icon {
+  font-size: 20px;
+}
+
+.config-explorer-node {
+  align-items: center;
+  position: relative;
+  display: flex;
+}
+
+.config-explorer-node-noflex {
+  align-items: center;
+  position: relative;
+}