NodeSecure · fraxken · Oct 14, 2021 · Oct 14, 2021
diff --git a/FLAGS.md b/FLAGS.md
@@ -93,7 +93,7 @@ Under the hood we use the npm package [is-minified-code](https://github.com/Mart
 Files can be found in the **Minified Files** list items of the left menu.
 
 
-![](https://i.imgur.com/e8BbBeb.png)</details> <details><summary>👀 hasMissingOrUnusedDependency</summary>
+![](https://i.imgur.com/e8BbBeb.png)</details><details><summary>👀 hasMissingOrUnusedDependency</summary>
 
 The package has a missing dependency (in package.json) or a dependency that is not used in the code (this may happen if the AST Analysis fail!)
 
@@ -171,7 +171,7 @@ For more information on deprecation please check the official [npm documentation
 Indicate that the package is **also used somewhere else in the dependency tree** but with a different version (like in the screenshot with **yallist**).
 
 
-![](https://camo.githubusercontent.com/933ca23e59bb1ed0159a7b444b783ce740224426/68747470733a2f2f7265732e636c6f7564696e6172792e636f6d2f70726163746963616c6465762f696d6167652f66657463682f732d2d43477a4e5f4977362d2d2f635f6c696d6974253243665f6175746f253243666c5f70726f6772657373697665253243715f6175746f253243775f3838302f68747470733a2f2f692e696d6775722e636f6d2f3730796e6674542e706e67)</details> <details><summary>☁️ isGit</summary>
+![](https://camo.githubusercontent.com/933ca23e59bb1ed0159a7b444b783ce740224426/68747470733a2f2f7265732e636c6f7564696e6172792e636f6d2f70726163746963616c6465762f696d6167652f66657463682f732d2d43477a4e5f4977362d2d2f635f6c696d6974253243665f6175746f253243666c5f70726f6772657373697665253243715f6175746f253243775f3838302f68747470733a2f2f692e696d6775722e636f6d2f3730796e6674542e706e67)</details><details><summary>☁️ isGit</summary>
 
 The project has been detected as a GIT repository. Sometimes a dependency on the package.json link to a GIT repository, example:
 

diff --git a/scripts/generateFlags.js b/scripts/generateFlags.js
@@ -18,13 +18,13 @@ const allFlagsContent = await Promise.all(
 
 const turndownService = new TurndownService();
 
-turndownService.addRule("summary", {
-  filter: "summary",
+turndownService.addRule("h1", {
+  filter: "h1",
   replacement: (content) => `<summary>${content}</summary>`
 });
 
-turndownService.addRule("details", {
-  filter: "details",
+turndownService.addRule("div", {
+  filter: "div",
   replacement: (content) => `<details>${content}</details>`
 });
 

diff --git a/src/flags/hasBannedFile.html b/src/flags/hasBannedFile.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>🌍 hasBannedFile</summary>
+<div>
+    <h1>🌍 hasBannedFile</h1>
     <p>
         The project has at least one sensitive file (or a file with sensitive information in it).
     </p>
@@ -12,5 +12,5 @@
         <li>.env</li>
         <li>files with extension like .key or .pem</li>
     </ul>
-</details>
+</div>
 
diff --git a/src/flags/hasCustomResolver.html b/src/flags/hasCustomResolver.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>💎 hasCustomResolver</summary>
+<div>
+    <h1>💎 hasCustomResolver</h1>
     <p>
         The package has custom dependencies resolver such as <span>+git</span> or
         <span>+ssh</span> or a local file with <span>file:</span>. In this kind of case it is better to check the package.json.
@@ -13,4 +13,4 @@
         Documentation:
         <a href="https://docs.npmjs.com/cli/install" rel="nofollow">npm-install</a>
     </p>
-</details>
+</div>
diff --git a/src/flags/hasExternalCapacity.html b/src/flags/hasExternalCapacity.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>🌍 hasExternalCapacity</summary>
+<div>
+    <h1>🌍 hasExternalCapacity</h1>
     <p>
         The package use a Node.js core package that allow to access the network.
         These core package are:
@@ -14,5 +14,5 @@
     <p class="note">
         ⚠️ This flag only work if the AST analysis as successfully retrieved all dependencies as expected.
     </p>
-</details>
+</div>
 
diff --git a/src/flags/hasIndirectDependencies.html b/src/flags/hasIndirectDependencies.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>🌲 hasIndirectDependencies</summary>
+<div>
+    <h1>🌲 hasIndirectDependencies</h1>
     <p>
         The package has indirect (or also called transitive) dependencies. This
         means that the child dependencies of the package also have dependencies.
@@ -50,4 +50,4 @@
             >
         </li>
     </ul>    
-</details>
+</div>
diff --git a/src/flags/hasManyPublishers.html b/src/flags/hasManyPublishers.html
@@ -1,8 +1,8 @@
-<details>
-    <summary>👥 hasManyPublishers</summary>
+<div>
+    <h1>👥 hasManyPublishers</h1>
     <p>
         The package has been published on npm by multiple unique users. There is no
         big deal here, just mean the package is maintained by a group of people.
     </p>
-</details>
+</div>
 
diff --git a/src/flags/hasMinifiedCode.html b/src/flags/hasMinifiedCode.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>🔬 hasMinifiedCode</summary>
+<div>
+    <h1>🔬 hasMinifiedCode</h1>
     <p>
         Has one or many files that has been detected as minified JavaScript code. We
         use a package that will tell us if the code is minified (in case the file as
@@ -25,4 +25,4 @@
     <p>Files can be found in the <b>Minified Files</b> list items of the left menu.</p>
     <br />
     <img src="https://i.imgur.com/e8BbBeb.png">
-</details>
+</div>
diff --git a/src/flags/hasMissingOrUnusedDependency.html b/src/flags/hasMissingOrUnusedDependency.html
@@ -1,6 +1,6 @@
-<details>
-    <summary>👀 hasMissingOrUnusedDependency</summary>
+<div>
+    <h1>👀 hasMissingOrUnusedDependency</h1>
     <p>
         The package has a missing dependency (in package.json) or a dependency that is not used in the code (this may happen if the AST Analysis fail!)
     </p>
-</details>
+</div>
diff --git a/src/flags/hasMultipleLicenses.html b/src/flags/hasMultipleLicenses.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>📚 hasMultipleLicenses</summary>
+<div>
+    <h1>📚 hasMultipleLicenses</h1>
     <p>
         We have detected different licenses in <b>package.json</b> and
         other licenses files (<b>LICENSE</b>,
@@ -16,4 +16,4 @@
     <p>
         Under the hood we use <a href="https://github.com/cutenode/conformance#readme">conformance</a> to parse licenses !
     </p>
-</details>
+</div>
diff --git a/src/flags/hasNativeCode.html b/src/flags/hasNativeCode.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>🐲 hasNativeCode</summary>
+<div>
+    <h1>🐲 hasNativeCode</h1>
     <p>
         The package use native components (package, file, configuration) like <b>binding.gyp</b> or npm package for native addon like <b>node-addon-api</b>.
     </p>
@@ -12,4 +12,4 @@
         <li>- One of the package dependency is known for building native addons.</li>
         <li>- The package.json file has the property "gypfile" set to&nbsp;<b>true</b>.</li>
     </ul>
-</details>
+</div>
diff --git a/src/flags/hasNoLicense.html b/src/flags/hasNoLicense.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>📜 hasNoLicense</summary>
+<div>
+    <h1>📜 hasNoLicense</h1>
     <p>
         This flag mean that we have not detected any licenses in the npm Tarball (or
         something went wrong in the detection). For detecting licenses we are reading
@@ -21,4 +21,4 @@
     <p class="note">
         ⚠️ we are working to stabilize this flag !
     </p>
-</details>
+</div>
diff --git a/src/flags/hasScript.html b/src/flags/hasScript.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>📦 hasScript</summary>
+<div>
+    <h1>📦 hasScript</h1>
     <p>
         The package has pre and/or post script in the
         <b>package.json</b> file. These script will be executed before or
@@ -23,4 +23,4 @@
             >
         </li>
     </ul>
-</details>
+</div>
diff --git a/src/flags/hasWarnings.html b/src/flags/hasWarnings.html
@@ -1,8 +1,8 @@
-<details>
-    <summary>⚠ hasWarnings</summary>
+<div>
+    <h1>⚠ hasWarnings</h1>
     <p>
         This means that the <a href="https://www.gartner.com/en/information-technology/glossary/static-application-security-testing-sast" target="_blank">SAST</a> Scanner
         has detected several problems by analyzing the <b>Abstract Syntax Tree (AST)</b> of a JavaScript source code.
         All warnings are accurately documented <a href="https://github.com/fraxken/js-x-ray#warnings-legends-v20" target="_blank">here</a>.
     </p> 
-</details>
+</div>
diff --git a/src/flags/isDead.html b/src/flags/isDead.html
@@ -1,10 +1,10 @@
-<details>
-    <summary>💀 isDead</summary>
+<div>
+    <h1>💀 isDead</h1>
     <p>
         The dependency (package) has not received update <b>from at least one year</b> and has at least one dependency that need to be updated.
     </p>
     <br />
     <p>
         It probably means it's dangerous to use (or continue to) because the author doesn't seem to update the package anymore (even worst if you want him to implement a new version / security patch).
     </p>
-</details>
+</div>
diff --git a/src/flags/isDeprecated.html b/src/flags/isDeprecated.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>⛔️ isDeprecated</summary>
+<div>
+    <h1>⛔️ isDeprecated</h1>
     <p>
         The given npm package has been deprecated by his author (it must be updated
         or replaced with an equivalent if there is no new version available).
@@ -13,4 +13,4 @@
             >npm documentation</a
         >.
     </p>    
-</details>
+</div>
diff --git a/src/flags/isDuplicated.html b/src/flags/isDuplicated.html
@@ -1,8 +1,8 @@
-<details>
-    <summary>🎭 isDuplicate</summary>
+<div>
+    <h1>🎭 isDuplicate</h1>
     <p>
         Indicate that the package is <b>also used somewhere else in the dependency tree</b> but with a different version (like in the screenshot with <b>yallist</b>).
     </p>
     <br />
     <img width="200" src="https://camo.githubusercontent.com/933ca23e59bb1ed0159a7b444b783ce740224426/68747470733a2f2f7265732e636c6f7564696e6172792e636f6d2f70726163746963616c6465762f696d6167652f66657463682f732d2d43477a4e5f4977362d2d2f635f6c696d6974253243665f6175746f253243666c5f70726f6772657373697665253243715f6175746f253243775f3838302f68747470733a2f2f692e696d6775722e636f6d2f3730796e6674542e706e67" />
-</details>
+</div>
diff --git a/src/flags/isGit.html b/src/flags/isGit.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>☁️ isGit</summary>
+<div>
+    <h1>☁️ isGit</h1>
     <p>
         The project has been detected as a GIT repository. Sometimes a dependency on
         the package.json link to a GIT repository, example:
@@ -12,4 +12,4 @@
         <a href="https://github.com/npm/pacote#readme">pacote</a> to fetch and
         extract packages we are supporting this given pattern.
     </p>
-</details>
+</div>
diff --git a/src/flags/isOutdated.html b/src/flags/isOutdated.html
@@ -1,5 +1,5 @@
-<details>
-    <summary>⌚️ isOutdated</summary>
+<div>
+    <h1>⌚️ isOutdated</h1>
     <p>
         The <b>current</b> package version is not equal to the <b>latest</b> version of the package (Compared to the versions we retrieve from the npm registry).<br />
     </p>
@@ -12,4 +12,4 @@
         <li>@beta</li>
         <li>@next</li>
     </ul>
-</details>
+</div>
diff --git a/src/flags/vulnerabilities.html b/src/flags/vulnerabilities.html
@@ -1,10 +1,10 @@
-<details>
-    <summary>🚨 Vulnerabilities</summary>
+<div>
+    <h1>🚨 Vulnerabilities</h1>
     <p>
         Vulnerabilities has been detected for the given package
         <strong>version</strong>. We are fetching vulnerabilities from the official
         <a href="https://github.com/nodejs/security-wg"
             >Node.js Security-WG repository</a
         >
     </p>    
-</details>
+</div>