kmx.io/kmxgit

diff --git a/assets/css/app.scss b/assets/css/app.scss
index cef43a1..19904f2 100644
--- a/assets/css/app.scss
+++ b/assets/css/app.scss
@@ -9,7 +9,6 @@ $font-family-sans-serif: "Inter", sans-serif;
 $font-family-monospace: "courier_new", "Courier New", monospace;
 @import "./courier_new.scss";
 @import "../node_modules/bootstrap/scss/bootstrap.scss";
-$code-font-size: $font-size-base;
 @import "./fontawesome-5.15.4-free.scss";
 @import "./fontawesome-5.15.4-free-v4-shims.scss";
 @import "./fontawesome-5.15.4-free-v4-font-face.scss";
@@ -166,14 +165,19 @@ table.admin-properties th {
             overflow: hidden;
         }
     }
-    code[class*=language-], pre[class*=language-] {
-        font-family: courier_new;
-        font-weight: bold;
-    }
-    pre[class*=language-] {
-        margin: -0.3em;
-        padding: 0.3em;
-    }
+}
+pre {
+    margin-bottom: 0;
+}
+code, pre, code[class*=language-], pre[class*=language-] {
+    font-size: 1.1rem;
+    font-family: courier_new;
+    font-weight: bold;
+    color: #ddd;
+}
+pre[class*=language-] {
+    margin: -0.3em;
+    padding: 0.3em;
 }
 .content_html {
     margin: 0;
diff --git a/lib/kmxgit_web/templates/page/index.html.heex b/lib/kmxgit_web/templates/page/index.html.heex
index ed73bcc..cf6e356 100644
--- a/lib/kmxgit_web/templates/page/index.html.heex
+++ b/lib/kmxgit_web/templates/page/index.html.heex
@@ -22,8 +22,17 @@
         </p>
       <% end %>
 
-      <h3><%= link gettext("SSH keys fingerprint"), to: "#ssh-keys", id: "ssh-keys" %></h3>
-      <pre class="wrap"><%= render("ssh_keys_fingerprint.txt") %></pre>
+      <h3><%= gettext("Security") %></h3>
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <h5><%= link gettext("SSH keys fingerprint"), to: "#ssh-keys", id: "ssh-keys" %></h5>
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre class="wrap"><%= render("ssh_keys_fingerprint.txt") %></pre>
+          </li>
+        </ul>
+      </p>
 
       <h3><%= link gettext("Help"), to: "#help", id: "help" %></h3>
       <p>
@@ -31,33 +40,92 @@
       </p>
 
       <p>
-        <div class="highlight">
-          <pre class="wrap"><code><span class="c1"># <%= gettext "Clone repository user/path/to/repo if repo does not exist" %> :</span>
-git clone <b><%= @git_ssh_url %>:user/path/to/repo.git</b>
-cd <b>repo</b>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Clone repository user/path/to/repo if repo does not exist" %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git clone <b><%= @git_ssh_url %>:user/path/to/repo.git</b>
+cd <b>repo</b></code></pre>
+          </li>
+        </ul>
+      </p>
 
-<span class="c1"># <%= gettext "Change branch" %> :</span>
-git branch <b>master</b>
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Change branch" %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git branch <b>master</b></code></pre>
+          </li>
+        </ul>
+      </p>
 
-<span class="c1"># <%= gettext "Pull changes from remote" %> :</span>
-git pull
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Pull changes from remote" %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git pull</code></pre>
+          </li>
+        </ul>
+      </p>
 
-<span class="c1"># <%= gettext "Add local changes to next commit" %> :</span>
-git add <b>README.md static/index.html</b>
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Add local changes to next commit" %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git add <b>README.md static/index.html</b></code></pre>
+          </li>
+        </ul>
+      </p>
 
-<span class="c1"># <%= gettext "Commit" %> :</span>
-git commit -m "<b>a short and descriptive message</b>"
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Commit" %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git commit -m "<b>a short and descriptive message</b>"</code></pre>
+          </li>
+        </ul>
+      </p>
 
-<span class="c1"># <%= gettext "Push changes to remote" %> :</span>
-git push
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Push changes to remote" %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git push</code></pre>
+          </li>
+        </ul>
+      </p>
 
-<span class="c1"># <%= gettext "Or if your local repo already exists," %></span>
-<span class="c1"># <%= gettext "Add remote to existing repo" %> :</span>
-git remote add kmx <b><%= @git_ssh_url %>:user/path/to/repo.git</b>
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Or if your local repo already exists, add remote to existing repo." %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git remote add kmx <b><%= @git_ssh_url %>:user/path/to/repo.git</b></code></pre>
+          </li>
+        </ul>
+      </p>
 
-<span class="c1"># <%= gettext "Push to new remote" %> :</span>
-git push -u kmx master</code></pre>
-        </div>
+      <p>
+        <ul class="list-group">
+          <li class="list-group-item">
+            <%= gettext "Push to new remote" %> :
+          </li>
+          <li class="list-group-item bg-dark">
+            <pre><code class="language-sh">git push -u kmx master</code></pre>
+          </li>
+        </ul>
       </p>
 
       <p>
@@ -73,26 +141,31 @@ git push -u kmx master</code></pre>
         </ul>
       </p>
 
-      <hr/>
-
-      <h3><%= link gettext("Stats"), to: "#stats", id: "stats" %></h3>
-
       <div class="row">
         <div class="col col-12 col-md-5">
-          <table class="table">
-            <tr>
-              <th><%= gettext "Users" %></th>
-              <td><%= @user_count %></td>
-            </tr>
-            <tr>
-              <th><%= gettext "Organisations" %></th>
-              <td><%= @org_count %></td>
-            </tr>
-            <tr>
-              <th><%= gettext "Repositories" %></th>
-              <td><%= @repo_count %></td>
-            </tr>
-          </table>
+          <p>
+            <ul class="list-group">
+              <li class="list-group-item">
+                <h3><%= link gettext("Stats"), to: "#stats", id: "stats" %></h3>
+              </li>
+              <li class="list-group-item">
+                <table class="table">
+                  <tr>
+                    <th><%= gettext "Users" %></th>
+                    <td><%= @user_count %></td>
+                  </tr>
+                  <tr>
+                    <th><%= gettext "Organisations" %></th>
+                    <td><%= @org_count %></td>
+                  </tr>
+                  <tr>
+                    <th><%= gettext "Repositories" %></th>
+                    <td><%= @repo_count %></td>
+                  </tr>
+                </table>
+              </li>
+            </ul>
+          </p>
         </div>
       </div>
     </div>
diff --git a/lib/kmxgit_web/templates/page/ssh_keys_fingerprint.txt.eex b/lib/kmxgit_web/templates/page/ssh_keys_fingerprint.txt.eex
index a815689..34bb4e0 100644
--- a/lib/kmxgit_web/templates/page/ssh_keys_fingerprint.txt.eex
+++ b/lib/kmxgit_web/templates/page/ssh_keys_fingerprint.txt.eex
@@ -1,4 +1,3 @@
-/!\ Warning /!\ SSH keys have changed, here are the new ones :
 1024 SHA256:XCZLwzJtGSk1+H65Z2gBKp7SUezH3fEW8knzkvoBm/4 root@git.kmx.io (DSA)
  256 SHA256:Js4QV6LbverEFDM5Y5iu5nVmw59OpQ6B6Q4l9RLyv8s root@git.kmx.io (ECDSA)
  256 SHA256:g1tAJZa0Z30sPQA+OKK3H75Gox8du2Tu3IhzFGZjkCA root@git.kmx.io (ED25519)
diff --git a/priv/static/_assets/app.css b/priv/static/_assets/app.css
index 13d5122..1dbba5f 100644
--- a/priv/static/_assets/app.css
+++ b/priv/static/_assets/app.css
@@ -19405,11 +19405,19 @@ table.admin-properties th {
 .content_text .line_numbers pre {
   overflow: hidden;
 }
-.content_text code[class*=language-], .content_text pre[class*=language-] {
+
+pre {
+  margin-bottom: 0;
+}
+
+code, pre, code[class*=language-], pre[class*=language-] {
+  font-size: 1.1rem;
   font-family: courier_new;
   font-weight: bold;
+  color: #ddd;
 }
-.content_text pre[class*=language-] {
+
+pre[class*=language-] {
   margin: -0.3em;
   padding: 0.3em;
 }