@jsenv/core 40.12.2 → 40.12.4

package/dist/build/build.js

@@ -2902,9 +2902,8 @@ const shouldHandleSourcemap = (urlInfo) => {
   return true;
 };
 
-const inlineContentClientFileUrl = import.meta.resolve(
-  "../client/inline_content/inline_content.js",
-);
+const inlineContentClientFileUrl = import.meta
+  .resolve("../client/inline_content/inline_content.js");
 
 const createKitchen = ({
   name,
@@ -4101,9 +4100,8 @@ const jsenvPluginInlining = () => {
 };
 
 const jsenvPluginHtmlSyntaxErrorFallback = () => {
-  const htmlSyntaxErrorFileUrl = import.meta.resolve(
-    "../client/html_syntax_error/html_syntax_error.html",
-  );
+  const htmlSyntaxErrorFileUrl = import.meta
+    .resolve("../client/html_syntax_error/html_syntax_error.html");
 
   return {
     mustStayFirst: true,
@@ -6550,9 +6548,8 @@ const jsenvPluginVersionSearchParam = () => {
  */
 
 
-const htmlFileUrlForDirectory = import.meta.resolve(
-  "../client/directory_listing/directory_listing.html",
-);
+const htmlFileUrlForDirectory = import.meta
+  .resolve("../client/directory_listing/directory_listing.html");
 
 const jsenvPluginDirectoryListing = ({
   spa,
@@ -6614,7 +6611,7 @@ const jsenvPluginDirectoryListing = ({
       if (!acceptsHtml) {
         return null;
       }
-      reference.fsStat = null; // reset fsStat, now it's not a directory anyor
+      reference.fsStat = null; // reset fsStat as it's not a directory anymore
       return `${htmlFileUrlForDirectory}?url=${encodeURIComponent(url)}`;
     },
     transformUrlContent: {
@@ -7033,19 +7030,13 @@ const jsenvPluginFsRedirection = ({
           applyFsStatEffectsOnUrlObject(urlObject, fsStat);
         }
       }
-      if (!fsStat) {
-        // for SPA we want to serve the root HTML file only when:
-        // 1. There is no corresponding file on the filesystem
-        // 2. The url pathname does not have an extension
-        //    This point assume client is requesting a file when there is an extension
-        //    and it assumes all routes will not use extension
-        // 3. The url pathname does not ends with "/"
-        //    In that case we assume client explicitely asks to load a directory
-        if (
-          spa &&
-          !urlToExtension(urlObject) &&
-          !urlToPathname(urlObject).endsWith("/")
-        ) {
+      if (spa) {
+        // for SPA we want to serve the root HTML file most of the time
+        if (!fsStat) {
+          if (urlToExtension(urlObject)) {
+            // url has an extension, we assume it's a file request -> let 404 happen
+            return null;
+          }
           const { requestedUrl, rootDirectoryUrl, mainFilePath } =
             reference.ownerUrlInfo.context;
           const closestHtmlRootFile = getClosestHtmlRootFile(
@@ -7057,6 +7048,16 @@ const jsenvPluginFsRedirection = ({
           }
           return new URL(mainFilePath, rootDirectoryUrl);
         }
+        if (fsStat.isDirectory()) {
+          // When requesting a directory, check if we have an HTML entry file for that directory
+          const directoryEntryFileUrl = getDirectoryEntryFileUrl(urlObject);
+          if (directoryEntryFileUrl) {
+            reference.fsStat = readEntryStatSync(directoryEntryFileUrl);
+            return directoryEntryFileUrl;
+          }
+        }
+      }
+      if (!fsStat) {
         return null;
       }
       const urlBeforeSymlinkResolution = urlObject.href;
@@ -7104,17 +7105,24 @@ const resolveSymlink = (fileUrl) => {
   return realUrlObject.href;
 };
 
+const getDirectoryEntryFileUrl = (directoryUrl) => {
+  const indexHtmlFileUrl = new URL(`index.html`, directoryUrl);
+  if (existsSync(indexHtmlFileUrl)) {
+    return indexHtmlFileUrl.href;
+  }
+  const filename = urlToFilename(directoryUrl);
+  const htmlFileUrlCandidate = new URL(`${filename}.html`, directoryUrl);
+  if (existsSync(htmlFileUrlCandidate)) {
+    return htmlFileUrlCandidate.href;
+  }
+  return null;
+};
 const getClosestHtmlRootFile = (requestedUrl, serverRootDirectoryUrl) => {
   let directoryUrl = new URL("./", requestedUrl);
   while (true) {
-    const indexHtmlFileUrl = new URL(`index.html`, directoryUrl);
-    if (existsSync(indexHtmlFileUrl)) {
-      return indexHtmlFileUrl.href;
-    }
-    const filename = urlToFilename(directoryUrl);
-    const htmlFileUrlCandidate = new URL(`${filename}.html`, directoryUrl);
-    if (existsSync(htmlFileUrlCandidate)) {
-      return htmlFileUrlCandidate.href;
+    const directoryEntryFileUrl = getDirectoryEntryFileUrl(directoryUrl);
+    if (directoryEntryFileUrl) {
+      return directoryEntryFileUrl;
     }
     if (!urlIsOrIsInsideOf(directoryUrl, serverRootDirectoryUrl)) {
       return null;
@@ -7817,12 +7825,10 @@ const jsenvPluginNodeRuntime = ({ runtimeCompat }) => {
 
 
 const jsenvPluginImportMetaCss = () => {
-  const importMetaCssClientFileUrl = import.meta.resolve(
-    "../client/import_meta_css/import_meta_css.js",
-  );
-  const importMetaCssBuildFileUrl = import.meta.resolve(
-    "../client/import_meta_css/import_meta_css_build.js",
-  );
+  const importMetaCssClientFileUrl = import.meta
+    .resolve("../client/import_meta_css/import_meta_css.js");
+  const importMetaCssBuildFileUrl = import.meta
+    .resolve("../client/import_meta_css/import_meta_css_build.js");
 
   return {
     name: "jsenv:import_meta_css",
@@ -8154,9 +8160,8 @@ const htmlNodeCanHotReload = (node) => {
 };
 
 const jsenvPluginImportMetaHot = () => {
-  const importMetaHotClientFileUrl = import.meta.resolve(
-    "../client/import_meta_hot/import_meta_hot.js",
-  );
+  const importMetaHotClientFileUrl = import.meta
+    .resolve("../client/import_meta_hot/import_meta_hot.js");
 
   return {
     name: "jsenv:import_meta_hot",
@@ -8948,9 +8953,8 @@ const jsenvPluginChromeDevtoolsJson = () => {
 };
 
 const jsenvPluginAutoreloadOnServerRestart = () => {
-  const autoreloadOnRestartClientFileUrl = import.meta.resolve(
-    "@jsenv/server/src/services/autoreload_on_server_restart/client/autoreload_on_server_restart.js",
-  );
+  const autoreloadOnRestartClientFileUrl = import.meta
+    .resolve("@jsenv/server/src/services/autoreload_on_server_restart/client/autoreload_on_server_restart.js");
 
   return {
     name: "jsenv:autoreload_on_server_restart",

package/dist/build/jsenv_core_packages.js

@@ -521,8 +521,6 @@ const SIGINT_CALLBACK = {
  * https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs#syntax
  */
 
-/* eslint-env browser, node */
-
 const DATA_URL = {
   parse: (string) => {
     const afterDataProtocol = string.slice("data:".length);

package/dist/client/inline_content/inline_content.js

@@ -1,5 +1,3 @@
-/* eslint-env browser,node */
-
 /*
  * This file does not use export const InlineContent = function() {} on purpose:
  * - An export would be renamed by rollup,

package/dist/client/ribbon/ribbon.js

@@ -2,14 +2,14 @@ const injectRibbon = ({ text }) => {
   const css = /* css */ `
     #jsenv_ribbon_container {
       position: fixed;
-      z-index: 1001;
       top: 0;
       right: 0;
+      z-index: 1001;
       width: 100px;
       height: 100px;
-      overflow: hidden;
       opacity: 0.5;
       pointer-events: none;
+      overflow: hidden;
     }
     #jsenv_ribbon {
       position: absolute;
@@ -20,20 +20,20 @@ const injectRibbon = ({ text }) => {
     }
     #jsenv_ribbon_text {
       position: absolute;
-      left: 0px;
       top: 20px;
-      transform: rotate(45deg);
+      left: 0px;
       display: block;
       width: 125px;
-      line-height: 36px;
-      background-color: orange;
       color: rgb(55, 7, 7);
-      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
       font-weight: 700;
       font-size: 16px;
       font-family: "Lato", sans-serif;
-      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
       text-align: center;
+      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
+      line-height: 36px;
+      background-color: orange;
+      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
+      transform: rotate(45deg);
       user-select: none;
     }
   `;

package/dist/start_dev_server/jsenv_core_packages.js

@@ -10,8 +10,6 @@ import { pathToFileURL, fileURLToPath } from "node:url";
  * https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs#syntax
  */
 
-/* eslint-env browser, node */
-
 const DATA_URL = {
   parse: (string) => {
     const afterDataProtocol = string.slice("data:".length);

package/dist/start_dev_server/start_dev_server.js

@@ -2942,9 +2942,8 @@ const shouldHandleSourcemap = (urlInfo) => {
   return true;
 };
 
-const inlineContentClientFileUrl = import.meta.resolve(
-  "../client/inline_content/inline_content.js",
-);
+const inlineContentClientFileUrl = import.meta
+  .resolve("../client/inline_content/inline_content.js");
 
 const createKitchen = ({
   name,
@@ -3806,9 +3805,8 @@ const inferUrlInfoType = (urlInfo) => {
 };
 
 const jsenvPluginHtmlSyntaxErrorFallback = () => {
-  const htmlSyntaxErrorFileUrl = import.meta.resolve(
-    "../client/html_syntax_error/html_syntax_error.html",
-  );
+  const htmlSyntaxErrorFileUrl = import.meta
+    .resolve("../client/html_syntax_error/html_syntax_error.html");
 
   return {
     mustStayFirst: true,
@@ -6255,9 +6253,8 @@ const jsenvPluginVersionSearchParam = () => {
  */
 
 
-const htmlFileUrlForDirectory = import.meta.resolve(
-  "../client/directory_listing/directory_listing.html",
-);
+const htmlFileUrlForDirectory = import.meta
+  .resolve("../client/directory_listing/directory_listing.html");
 
 const jsenvPluginDirectoryListing = ({
   spa,
@@ -6319,7 +6316,7 @@ const jsenvPluginDirectoryListing = ({
       if (!acceptsHtml) {
         return null;
       }
-      reference.fsStat = null; // reset fsStat, now it's not a directory anyor
+      reference.fsStat = null; // reset fsStat as it's not a directory anymore
       return `${htmlFileUrlForDirectory}?url=${encodeURIComponent(url)}`;
     },
     transformUrlContent: {
@@ -6738,19 +6735,13 @@ const jsenvPluginFsRedirection = ({
           applyFsStatEffectsOnUrlObject(urlObject, fsStat);
         }
       }
-      if (!fsStat) {
-        // for SPA we want to serve the root HTML file only when:
-        // 1. There is no corresponding file on the filesystem
-        // 2. The url pathname does not have an extension
-        //    This point assume client is requesting a file when there is an extension
-        //    and it assumes all routes will not use extension
-        // 3. The url pathname does not ends with "/"
-        //    In that case we assume client explicitely asks to load a directory
-        if (
-          spa &&
-          !urlToExtension(urlObject) &&
-          !urlToPathname(urlObject).endsWith("/")
-        ) {
+      if (spa) {
+        // for SPA we want to serve the root HTML file most of the time
+        if (!fsStat) {
+          if (urlToExtension(urlObject)) {
+            // url has an extension, we assume it's a file request -> let 404 happen
+            return null;
+          }
           const { requestedUrl, rootDirectoryUrl, mainFilePath } =
             reference.ownerUrlInfo.context;
           const closestHtmlRootFile = getClosestHtmlRootFile(
@@ -6762,6 +6753,16 @@ const jsenvPluginFsRedirection = ({
           }
           return new URL(mainFilePath, rootDirectoryUrl);
         }
+        if (fsStat.isDirectory()) {
+          // When requesting a directory, check if we have an HTML entry file for that directory
+          const directoryEntryFileUrl = getDirectoryEntryFileUrl(urlObject);
+          if (directoryEntryFileUrl) {
+            reference.fsStat = readEntryStatSync(directoryEntryFileUrl);
+            return directoryEntryFileUrl;
+          }
+        }
+      }
+      if (!fsStat) {
         return null;
       }
       const urlBeforeSymlinkResolution = urlObject.href;
@@ -6809,17 +6810,24 @@ const resolveSymlink = (fileUrl) => {
   return realUrlObject.href;
 };
 
+const getDirectoryEntryFileUrl = (directoryUrl) => {
+  const indexHtmlFileUrl = new URL(`index.html`, directoryUrl);
+  if (existsSync(indexHtmlFileUrl)) {
+    return indexHtmlFileUrl.href;
+  }
+  const filename = urlToFilename(directoryUrl);
+  const htmlFileUrlCandidate = new URL(`${filename}.html`, directoryUrl);
+  if (existsSync(htmlFileUrlCandidate)) {
+    return htmlFileUrlCandidate.href;
+  }
+  return null;
+};
 const getClosestHtmlRootFile = (requestedUrl, serverRootDirectoryUrl) => {
   let directoryUrl = new URL("./", requestedUrl);
   while (true) {
-    const indexHtmlFileUrl = new URL(`index.html`, directoryUrl);
-    if (existsSync(indexHtmlFileUrl)) {
-      return indexHtmlFileUrl.href;
-    }
-    const filename = urlToFilename(directoryUrl);
-    const htmlFileUrlCandidate = new URL(`${filename}.html`, directoryUrl);
-    if (existsSync(htmlFileUrlCandidate)) {
-      return htmlFileUrlCandidate.href;
+    const directoryEntryFileUrl = getDirectoryEntryFileUrl(directoryUrl);
+    if (directoryEntryFileUrl) {
+      return directoryEntryFileUrl;
     }
     if (!urlIsOrIsInsideOf(directoryUrl, serverRootDirectoryUrl)) {
       return null;
@@ -7857,12 +7865,10 @@ const jsenvPluginNodeRuntime = ({ runtimeCompat }) => {
 
 
 const jsenvPluginImportMetaCss = () => {
-  const importMetaCssClientFileUrl = import.meta.resolve(
-    "../client/import_meta_css/import_meta_css.js",
-  );
-  const importMetaCssBuildFileUrl = import.meta.resolve(
-    "../client/import_meta_css/import_meta_css_build.js",
-  );
+  const importMetaCssClientFileUrl = import.meta
+    .resolve("../client/import_meta_css/import_meta_css.js");
+  const importMetaCssBuildFileUrl = import.meta
+    .resolve("../client/import_meta_css/import_meta_css_build.js");
 
   return {
     name: "jsenv:import_meta_css",
@@ -8194,9 +8200,8 @@ const htmlNodeCanHotReload = (node) => {
 };
 
 const jsenvPluginImportMetaHot = () => {
-  const importMetaHotClientFileUrl = import.meta.resolve(
-    "../client/import_meta_hot/import_meta_hot.js",
-  );
+  const importMetaHotClientFileUrl = import.meta
+    .resolve("../client/import_meta_hot/import_meta_hot.js");
 
   return {
     name: "jsenv:import_meta_hot",
@@ -8988,9 +8993,8 @@ const jsenvPluginChromeDevtoolsJson = () => {
 };
 
 const jsenvPluginAutoreloadOnServerRestart = () => {
-  const autoreloadOnRestartClientFileUrl = import.meta.resolve(
-    "@jsenv/server/src/services/autoreload_on_server_restart/client/autoreload_on_server_restart.js",
-  );
+  const autoreloadOnRestartClientFileUrl = import.meta
+    .resolve("@jsenv/server/src/services/autoreload_on_server_restart/client/autoreload_on_server_restart.js");
 
   return {
     name: "jsenv:autoreload_on_server_restart",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "40.12.2",
+  "version": "40.12.4",
   "description": "Tool to develop, test and build js projects",
   "repository": {
     "type": "git",
@@ -80,8 +80,8 @@
     "@jsenv/plugin-bundling": "2.10.4",
     "@jsenv/plugin-minification": "1.7.3",
     "@jsenv/plugin-supervisor": "1.7.11",
-    "@jsenv/plugin-transpilation": "1.5.65",
-    "@jsenv/server": "16.3.4",
+    "@jsenv/plugin-transpilation": "1.5.66",
+    "@jsenv/server": "16.3.5",
     "@jsenv/sourcemap": "1.3.13",
     "react-table": "7.8.0"
   },
@@ -116,24 +116,24 @@
     "@jsenv/url-meta": "workspace:*",
     "@jsenv/urls": "workspace:*",
     "@jsenv/utils": "workspace:*",
-    "@playwright/browser-chromium": "1.56.1",
-    "@playwright/browser-firefox": "1.56.1",
-    "@playwright/browser-webkit": "1.56.1",
+    "@playwright/browser-chromium": "1.57.0",
+    "@playwright/browser-firefox": "1.57.0",
+    "@playwright/browser-webkit": "1.57.0",
     "babel-plugin-transform-async-to-promises": "0.8.18",
-    "eslint": "9.39.1",
+    "eslint": "9.39.2",
     "eslint-plugin-html": "8.1.3",
     "eslint-plugin-import-x": "4.16.1",
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-regexp": "2.10.0",
     "globals": "16.5.0",
-    "open": "10.2.0",
-    "playwright": "1.56.1",
+    "open": "11.0.0",
+    "playwright": "1.57.0",
     "preact": "11.0.0-beta.0",
-    "prettier": "3.6.2",
+    "prettier": "3.7.4",
     "prettier-plugin-css-order": "git+https://github.com/dmail-fork/prettier-plugin-css-order.git",
     "prettier-plugin-embed": "0.5.0",
     "prettier-plugin-organize-imports": "4.3.0",
-    "prettier-plugin-packagejson": "2.5.19",
+    "prettier-plugin-packagejson": "2.5.20",
     "prettier-plugin-sql": "0.19.2",
     "strip-ansi": "7.1.2"
   },

package/src/kitchen/client/inline_content.js

@@ -1,5 +1,3 @@
-/* eslint-env browser,node */
-
 /*
  * This file does not use export const InlineContent = function() {} on purpose:
  * - An export would be renamed by rollup,

package/src/kitchen/kitchen.js

@@ -25,9 +25,8 @@ import {
 import { createUrlInfoTransformer } from "./url_graph/url_info_transformations.js";
 import { urlSpecifierEncoding } from "./url_graph/url_specifier_encoding.js";
 
-const inlineContentClientFileUrl = import.meta.resolve(
-  "./client/inline_content.js",
-);
+const inlineContentClientFileUrl = import.meta
+  .resolve("./client/inline_content.js");
 
 export const createKitchen = ({
   name,

package/src/plugins/autoreload_on_server_restart/jsenv_plugin_autoreload_on_server_restart.js

@@ -1,9 +1,8 @@
 import { injectJsenvScript, parseHtml, stringifyHtmlAst } from "@jsenv/ast";
 
 export const jsenvPluginAutoreloadOnServerRestart = () => {
-  const autoreloadOnRestartClientFileUrl = import.meta.resolve(
-    "@jsenv/server/src/services/autoreload_on_server_restart/client/autoreload_on_server_restart.js",
-  );
+  const autoreloadOnRestartClientFileUrl = import.meta
+    .resolve("@jsenv/server/src/services/autoreload_on_server_restart/client/autoreload_on_server_restart.js");
 
   return {
     name: "jsenv:autoreload_on_server_restart",

package/src/plugins/html_syntax_error_fallback/jsenv_plugin_html_syntax_error_fallback.js

@@ -5,9 +5,8 @@ import { readFileSync } from "node:fs";
 import { jsenvCoreDirectoryUrl } from "../../jsenv_core_directory_url.js";
 
 export const jsenvPluginHtmlSyntaxErrorFallback = () => {
-  const htmlSyntaxErrorFileUrl = import.meta.resolve(
-    "./client/html_syntax_error.html",
-  );
+  const htmlSyntaxErrorFileUrl = import.meta
+    .resolve("./client/html_syntax_error.html");
 
   return {
     mustStayFirst: true,

package/src/plugins/import_meta_css/jsenv_plugin_import_meta_css.js

@@ -26,12 +26,10 @@
 import { applyBabelPlugins } from "@jsenv/ast";
 
 export const jsenvPluginImportMetaCss = () => {
-  const importMetaCssClientFileUrl = import.meta.resolve(
-    "./client/import_meta_css.js",
-  );
-  const importMetaCssBuildFileUrl = import.meta.resolve(
-    "./client/import_meta_css_build.js",
-  );
+  const importMetaCssClientFileUrl = import.meta
+    .resolve("./client/import_meta_css.js");
+  const importMetaCssBuildFileUrl = import.meta
+    .resolve("./client/import_meta_css_build.js");
 
   return {
     name: "jsenv:import_meta_css",

package/src/plugins/import_meta_hot/jsenv_plugin_import_meta_hot.js

@@ -5,9 +5,8 @@ import { babelPluginMetadataImportMetaHot } from "./babel_plugin_metadata_import
 import { collectHotDataFromHtmlAst } from "./html_hot_dependencies.js";
 
 export const jsenvPluginImportMetaHot = () => {
-  const importMetaHotClientFileUrl = import.meta.resolve(
-    "./client/import_meta_hot.js",
-  );
+  const importMetaHotClientFileUrl = import.meta
+    .resolve("./client/import_meta_hot.js");
 
   return {
     name: "jsenv:import_meta_hot",

package/src/plugins/protocol_file/client/directory_listing.css

@@ -10,19 +10,19 @@ p,
 button {
   margin: 0;
   padding: 0;
-  border: 0;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  border: 0;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
 /* ERROR MESSAGE */
 .error_message {
+  display: block;
+  margin: 1em;
+  padding: 1.5em 1.2em;
   background-color: #fce4e4;
   border: 1px solid #fcc2c3;
-  padding: 1.5em 1.2em;
-  margin: 1em;
-  display: block;
 }
 .error_text {
   color: #853611;
@@ -30,26 +30,26 @@ button {
   text-shadow: 1px 1px rgba(250, 250, 250, 0.3);
 }
 .hint_message {
+  display: block;
+  margin: 1em;
+  padding: 1.5em 1.2em;
   background-color: lightblue;
   border: 1px solid #fcc2c3;
-  padding: 1.5em 1.2em;
-  margin: 1em;
-  display: block;
 }
 .hint_text {
   color: black;
   font-weight: bold;
-  line-height: 2em;
   text-shadow: 1px 1px rgba(250, 250, 250, 0.3);
+  line-height: 2em;
 }
 
 /* NAV */
 .nav {
-  font-size: 16px;
-  font-weight: bold;
-  margin: 20px 25px 15px 25px;
   display: flex;
+  margin: 20px 25px 15px 25px;
   gap: 0.3em;
+  font-weight: bold;
+  font-size: 16px;
 }
 .nav_item {
   display: flex;
@@ -73,8 +73,8 @@ a.nav_item_text {
   text-decoration: none;
 }
 .nav_item[data-404] .nav_item_text {
-  background-color: yellow;
   color: #853611;
+  background-color: yellow;
 }
 .file_path_bad {
   text-decoration-line: underline;
@@ -82,13 +82,13 @@ a.nav_item_text {
   text-decoration-style: wavy;
 }
 .nav_item_badge_404 {
+  margin-right: 0.3em;
+  padding: 0.2em 0.1em;
   color: #853611;
+  font-size: 0.8em;
   text-align: center;
   background-color: yellow;
   border-radius: 5px;
-  padding: 0.2em 0.1em;
-  font-size: 0.8em;
-  margin-right: 0.3em;
 }
 
 /* CONTENT */
@@ -98,36 +98,36 @@ a.nav_item_text {
   color: #bbbbbb;
 }
 .directory_content {
+  display: flex;
   margin: 10px 15px 10px 15px;
+  flex-direction: column;
   list-style-type: none;
   border-radius: 3px;
-  display: flex;
-  flex-direction: column;
 }
 .directory_content_item {
-  display: inline-flex;
   position: relative;
-  padding: 10px 15px 10px 15px;
-  font-size: 15px;
-  min-height: 19px;
+  display: inline-flex;
   box-sizing: border-box;
+  min-height: 19px;
+  padding: 10px 15px 10px 15px;
   align-items: center;
+  font-size: 15px;
 }
 .directory_content_item_link {
   display: inline-flex;
   min-width: 0;
   max-width: 100%;
   flex: 1;
-  gap: 10px;
   align-items: center;
+  gap: 10px;
   text-decoration: none;
 }
 .directory_content_item_icon {
-  width: 15px;
-  aspect-ratio: 1/1;
   display: flex;
-  color: #f1f1f1;
+  aspect-ratio: 1/1;
+  width: 15px;
   flex-shrink: 0;
+  color: #f1f1f1;
 }
 .directory_content_item_icon img {
   width: 100%;
@@ -138,13 +138,13 @@ a.nav_item_text {
   align-items: center;
 }
 .directory_content_item:last-child {
-  border-bottom: none;
   padding-bottom: 10px;
+  border-bottom: none;
 }
 .directory_content_item_arrow {
   display: flex;
-  color: #666666;
   height: 10px;
+  color: #666666;
   stroke-width: 15%;
 }