Merge pull request #1435 from basecamp/bar-icon-align

Align bar shortcuts better

app/assets/stylesheets/trays.css

@@ -87,6 +87,10 @@
       display: none;
     }
 
+    .tray__toggle-text {
+      display: contents;
+    }
+
     @media (max-width: 799px) {
       /* When collapsed on mobile, make it small */
       .tray__dialog:not([open]) ~ & {

app/views/bar/_bar.html.erb

@@ -3,7 +3,7 @@
   <div class="flex justify-center bar__placeholder" data-bar-target="buttonsContainer">
     <%= tag.button class: "btn btn--plain", data: {
           controller: "hotkey", action: "bar#search keydown.k@document->hotkey#click" } do %>
-      <span>Search <% if platform.desktop? -%><kbd>K</kbd><% end %></span>
+      <span class="display-contents">Search <% if platform.desktop? -%><kbd>K</kbd><% end %></span>
     <% end %>
   </div>
 

app/views/my/pins/_tray.html.erb

@@ -1,10 +1,10 @@
 <%= turbo_stream_from Current.user, :pins_tray %>
 
 <section class="tray tray--pins" data-controller="dialog">
-  <%= tag.dialog id: "pin-tray", class: "tray__dialog", data: { 
+  <%= tag.dialog id: "pin-tray", class: "tray__dialog", data: {
       action: "keydown->navigable-list#navigate dialog:show@document->navigable-list#reset keydown.esc->dialog#close:stop click@document->dialog#closeOnClickOutside",
-      controller: "navigable-list", 
-      dialog_target: "dialog",  
+      controller: "navigable-list",
+      dialog_target: "dialog",
       navigable_list_actionable_items_value: "true",
       navigable_list_reverse_navigation_value: "true" },
       turbo_permanent: true do %>