Add site logo to header.

app/javascript/src/styles/common/page_header.scss

@@ -6,6 +6,14 @@ header#top {
   #app-name-header {
     font-size: var(--text-xxl);
     margin: 0 30px;
+
+    #app-logo img {
+      width: 1.25em;
+
+      &:hover {
+        opacity: 0.8;
+      }
+    }
   }
 
   menu {

app/views/layouts/default.html.erb

@@ -71,7 +71,10 @@
   <% end %>
 
   <header id="top" class="mb-4">
-    <%= link_to Danbooru.config.app_name, root_path, id: "app-name-header", class: "font-bold font-header leading-normal" %>
+    <div id="app-name-header" class="font-bold font-header leading-normal inline-flex items-center gap-1">
+      <%= link_to image_pack_tag("static/danbooru-logo-128x128.png"), root_path, id: "app-logo" %>
+      <%= link_to Danbooru.config.app_name, root_path, id: "app-name" %>
+    </div>
 
     <div id="maintoggle" class="mobile-only">
       <a href="#"><%= menu_icon(id: "maintoggle-on") %></a>