fix some styles

Author: avivkeller

scripts/vercel-build.sh

@@ -1,29 +1,25 @@
-echo "Generating node.1"
-
+echo "Generating man page (node.1)"
 node bin/cli.mjs generate \
   -t man-page \
   -i "./node/doc/api/cli.md" \
   -o "./node/node.1" \
   --skip-lint
 
-  echo "Generating addon tests"
-
+echo "Generating addon tests"
 node bin/cli.mjs generate \
   -t addon-verify \
   -i "./node/doc/api/addons.md" \
   -o "./node/test/addons" \
   --skip-lint
 
-  echo "Generating API doc links"
-
+echo "Generating API doc links"
 node bin/cli.mjs generate \
   -t api-links \
   -i "./node/lib/*.js" \
   -o "./out" \
   --skip-lint
 
-  echo "Generating API docs (orama, json, llms, web)"
-
+echo "Generating API docs: orama-db, legacy-json, llms-txt, web"
 node bin/cli.mjs generate \
   -t orama-db \
   -t legacy-json \

src/generators/web/constants.mjs

@@ -10,11 +10,11 @@ export const JSX_IMPORTS = {
   },
   SideBar: {
     name: 'SideBar',
-    source: './components/SideBar.jsx',
+    source: './components/SideBar/index.jsx',
   },
   MetaBar: {
     name: 'MetaBar',
-    source: './components/MetaBar.jsx',
+    source: './components/MetaBar/index.jsx',
   },
   CodeBox: {
     name: 'CodeBox',

…generators/web/ui/components/MetaBar.jsx …tors/web/ui/components/MetaBar/index.jsxsrc/generators/web/ui/components/MetaBar.jsx renamed to src/generators/web/ui/components/MetaBar/index.jsx src/generators/web/ui/components/MetaBar.jsx renamed to src/generators/web/ui/components/MetaBar/index.jsx

@@ -2,6 +2,8 @@ import { CodeBracketIcon, DocumentIcon } from '@heroicons/react/24/outline';
 import MetaBar from '@node-core/ui-components/Containers/MetaBar';
 import GitHubIcon from '@node-core/ui-components/Icons/Social/GitHub';
 
+import styles from './index.module.css';
+
 const iconMap = {
   JSON: CodeBracketIcon,
   MD: DocumentIcon,
@@ -45,7 +47,7 @@ export default ({
             return (
               <li key={title}>
                 <a href={path}>
-                  {Icon && <Icon className="inline w-4 h-4 mr-1" />}
+                  {Icon && <Icon className={styles.icon} />}
                   {title}
                 </a>
               </li>

src/generators/web/ui/components/MetaBar/index.module.css

@@ -0,0 +1,6 @@
+.icon {
+    display: inline;
+    width: 1rem;
+    height: 1rem;
+    margin-right: 0.25rem;
+}

…generators/web/ui/components/SideBar.jsx …tors/web/ui/components/SideBar/index.jsxsrc/generators/web/ui/components/SideBar.jsx renamed to src/generators/web/ui/components/SideBar/index.jsx src/generators/web/ui/components/SideBar.jsx renamed to src/generators/web/ui/components/SideBar/index.jsx

@@ -1,6 +1,8 @@
 import Select from '@node-core/ui-components/Common/Select/index.js';
 import SideBar from '@node-core/ui-components/Containers/Sidebar';
 
+import styles from './index.module.css';
+
 /**
  * @typedef {Object} SideBarProps
  * @property {string} pathname - The current document
@@ -34,6 +36,8 @@ export default ({ versions, pathname, currentVersion, docPages }) => (
       <Select
         label="Node.js version"
         values={versions}
+        inline={true}
+        className={styles.select}
         placeholder={currentVersion}
         onChange={redirect}
       />

src/generators/web/ui/components/SideBar/index.module.css

@@ -0,0 +1,3 @@
+.select {
+    width: 100%;
+}