Minor styling update for functions overview & edit/new pages to make it more usable after landing page changes, also started to work on making pages refreshable through htmx hx-push-url

templates/dashboard/http_functions/header.html

@@ -3,7 +3,7 @@
         <div class="flex items-center">
 
             <h1 class="font-semibold text-lg md:text-2xl" data-id="52">
-                {{ title }}: <span class="font-mono">{{ name }}</span>
+                {{ title }}{% if show_name|default(true, false) %}: <span class="font-mono">{{ name }}</span>{% endif %}
             </h1>
 
             {% if show_refresh|default(true, false) %}
@@ -56,9 +56,14 @@
 
         </div>
         <button
-            class="inline-flex items-center justify-center text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3 ml-auto"
+            class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded flex mr-2 items-center ml-auto"
             hx-get="{{ url_for('dashboard_http_functions') }}" hx-target="#container" hx-swap="innerHTML">
-            Cancel
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
+                stroke="currentColor" class="w-5 h-5 mr-2" data-darkreader-inline-stroke=""
+                style="--darkreader-inline-stroke: currentColor;">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"></path>
+            </svg>
+            <span>Cancel</span>
         </button>
     </div>