From 9cc6f1908f844f683cc946e52671da60b15a1bba Mon Sep 17 00:00:00 2001
From: Simon Willison <swillison@gmail.com>
Date: Tue, 12 Mar 2024 16:54:03 -0700
Subject: [PATCH] Gradient on header and footer, closes #2302

---
 datasette/static/app.css      | 10 ++++++++--
 datasette/templates/base.html |  2 +-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/datasette/static/app.css b/datasette/static/app.css
index e4a0ee10..632204fb 100644
--- a/datasette/static/app.css
+++ b/datasette/static/app.css
@@ -269,6 +269,7 @@ header,
 footer {
     padding: 0.6rem 1rem 0.5rem 1rem;
     background-color: #276890;
+    background: linear-gradient(180deg, rgba(96,144,173,1) 0%, rgba(39,104,144,1) 50%);
     color: rgba(255,255,244,0.9);
     overflow: hidden;
     box-sizing: border-box;
@@ -346,12 +347,17 @@ details.nav-menu > summary::-webkit-details-marker {
 }
 details .nav-menu-inner {
     position: absolute;
-    top: 2rem;
+    top: 2.6rem;
     right: 10px;
     width: 180px;
     background-color: #276890;
-    padding: 1rem;
     z-index: 1000;
+    padding: 0;
+}
+.nav-menu-inner li,
+form.nav-menu-logout {
+    padding: 0.3rem 0.5rem;
+    border-top: 1px solid #ffffff69;
 }
 .nav-menu-inner a {
     display: block;
diff --git a/datasette/templates/base.html b/datasette/templates/base.html
index ceead217..afb8dcd3 100644
--- a/datasette/templates/base.html
+++ b/datasette/templates/base.html
@@ -37,7 +37,7 @@
             </ul>
             {% endif %}
             {% if show_logout %}
-            <form action="{{ urls.logout() }}" method="post">
+            <form class="nav-menu-logout" action="{{ urls.logout() }}" method="post">
                 <input type="hidden" name="csrftoken" value="{{ csrftoken() }}">
                 <button class="button-as-link">Log out</button>
             </form>{% endif %}