reorganize contributors css. add edit on github button below

Author: pikinier20

docs/_layouts/static-site-main.html

@@ -43,5 +43,12 @@
   <div class="content-contributors hidden">
     <h1 class="h200">Contributors to this page</h1>
     <div id="documentation-contributors" class="contributors-container"></div>
+    {% if urls.editSource %}
+    <div class="github-edit-button">
+      <a class="text-button with-link body-small" href="{{ urls.editSource }}">
+        Edit this page on GitHub
+      </a>
+    </div>
+    {% endif %}
   </div>
 </div>

scaladoc-js/contributors/css/content-contributors.css

@@ -1,24 +1,51 @@
 .content-contributors.hidden {
   display: none;
 }
+
+.content-contributors .contributors-container div a {
+  vertical-align: middle;
+  padding: 3px;
+  text-decoration: none;
+}
+
+.content-contributors {
+  background-color: var(--background-neutral);
+  padding: calc(3 * var(--base-spacing));
+  border-radius: 4px;
+}
+
 .content-contributors .contributors-container {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   padding-bottom: 25px;
+  row-gap: calc(3 * var(--base-spacing));
+  column-gap: calc(4 * var(--base-spacing));
 }
-.content-contributors .contributors-container div {
-  margin: 5px;
-}
-.content-contributors .contributors-container div a {
-  vertical-align: middle;
-  padding: 3px;
-  text-decoration: none;
+
+.content-contributors h1 {
+  color: var(--text-primary);
+  padding-bottom: calc(3 * var(--base-spacing));
 }
+
 .content-contributors .contributors-container div img {
   vertical-align: middle;
   width: 35px;
   height: 35px;
   margin-bottom: 0;
-  border-radius: 7px;
+  border-radius: 50%;
+  margin-right: calc(1.5 * var(--base-spacing));
+}
+
+#content .content-contributors .contributors-container div a {
+  text-decoration: none;
+  border-bottom: none;
+}
+
+.content-contributors .contributors-container {
+  padding: 0;
+}
+
+.content-contributors .github-edit-button {
+  padding-top: calc(2 * var(--base-spacing));
 }

scaladoc-testcases/docs/_layouts/static-site-main.html

@@ -1,38 +1,47 @@
 ---
-extraJS:
-  - js/contributors.js
-extraCSS:
-  - css/bootstrap.min.css
-  - css/content-contributors.css
+layout: main
 ---
 
-<div class="container">
+<div class="site-container">
+  <div id="site-header"></div>
   {{ content }}
-  <nav class="arrows-wrapper" aria-label="Page navigation">
+  <div class="divider" />
+  <nav class="arrow-navigation" aria-label="Page navigation">
     {% if page.previous %}
-    <a
-      rel="prev"
-      href="{{ page.previous.url }}"
-      class="arrows previous"
-      aria-keyshortcuts="Left"
-    >
-      <span>{{ page.previous.title }}</span>
-      <i class="fa fa-angle-left"></i>
-    </a>
+    <div>
+      <span class="body-small">Previous</span>
+      <a
+        rel="prev"
+        href="{{ page.previous.url }}"
+        aria-keyshortcuts="Left"
+        class="body-medium"
+      >
+        <span class="body-medium">{{ page.previous.title }}</span>
+      </a>
+    </div>
     {% endif %} {% if page.next %}
-    <a
-      rel="next"
-      href="{{ page.next.url }}"
-      class="arrows next"
-      aria-keyshortcuts="Right"
-    >
-      <span>{{ page.next.title }}</span>
-      <i class="fa fa-angle-right"></i>
-    </a>
+    <div>
+      <span class="body-small">Next</span>
+      <a
+        rel="next"
+        href="{{ page.next.url }}"
+        aria-keyshortcuts="Right"
+        class="body-medium"
+      >
+        <span class="body-medium">{{ page.next.title }}</span>
+      </a>
+    </div>
     {% endif %}
   </nav>
   <div class="content-contributors hidden">
     <h1 class="h200">Contributors to this page</h1>
     <div id="documentation-contributors" class="contributors-container"></div>
+    {% if urls.editSource %}
+    <div class="github-edit-button">
+      <a class="text-button with-link body-small" href="{{ urls.editSource }}">
+        Edit this page on GitHub
+      </a>
+    </div>
+    {% endif %}
   </div>
 </div>