content/static: add HTML/CSS changes for nested modules in the subdir…

…ectories page

This change adds the HTML and CSS changes for the subdirectories
template to include nested modules in the table with a modules badge.
This includes adding a --light-blue CSS variable to reflect the blue
background of the modules badge.

This change also deletes the _directories.tmpl helper template so that
iterating through the packages and nested modules in the HTML table is a
lot clearer.

before/after images: https://photos.app.goo.gl/2reDtNHxThVnDMiL9

Updates golang/go#38596

Change-Id: Id1dad1ba3a28881a203bf90afe1d5372ede2317c
Reviewed-on: https://go-review.googlesource.com/c/pkgsite/+/254019
Reviewed-by: Julie Qiu <julie@golang.org>
Reviewed-by: Jonathan Amsterdam <jba@google.com>
Reviewed-by: Jamal Carvalho <jamal@golang.org>

content/static/css/stylesheet.css

@@ -1381,6 +1381,13 @@ table.Directories {
   padding-right: 1rem;
   padding-bottom: 0.5rem;
 }
+.Directories-moduleTag {
+  background-color: var(--blue);
+  border-radius: 0.15rem;
+  color: var(--gray-1);
+  font-size: 0.74rem;
+  padding: 0.2rem 0.4rem;
+}
 .Directory-header {
   margin-bottom: 2rem;
 }

content/static/html/pages/subdirectories.tmpl

@@ -6,7 +6,29 @@
 
 {{define "details_content"}}
   {{if .Packages}}
-    {{template "directories" .Packages}}
+    <table class="Directories">
+      <tr>
+        <th>Path</th>
+        <th>Synopsis</th>
+      </tr>
+      {{range .Packages}}
+        <tr>
+          <td>
+            <a href="{{.URL}}">{{.PathAfterDirectory}}</a>
+          </td>
+          <td>{{.Synopsis}}</td>
+        </tr>
+      {{end}}
+      {{range .NestedModules}}
+        <tr>
+          <td>
+            <span class="Directories-moduleTag">MODULE</span>
+            <a href="/{{.ModulePath}}">{{.ModulePath}}</a>
+          </td>
+          <td></td>
+        </tr>
+      {{end}}
+    </table>
   {{else}}
     {{template "empty_content" "There are no packages in this directory!"}}
   {{end}}