Add image icon next to thumbnail size dropdown menu.

app/components/application_component.rb

@@ -2,7 +2,7 @@
 
 class ApplicationComponent < ViewComponent::Base
   delegate :link_to_user, :time_ago_in_words_tagged, :format_text, :external_link_to, :tag_class, :current_page_path, to: :helpers
-  delegate :edit_icon, :delete_icon, :undelete_icon, :flag_icon, :upvote_icon, :downvote_icon, :link_icon, :sticky_icon, :unsticky_icon, :hashtag_icon, :caret_down_icon, to: :helpers
+  delegate :edit_icon, :delete_icon, :undelete_icon, :flag_icon, :upvote_icon, :downvote_icon, :link_icon, :sticky_icon, :unsticky_icon, :hashtag_icon, :caret_down_icon, :image_icon, to: :helpers
 
   def policy(subject)
     Pundit.policy!(current_user, subject)

app/components/comment_component/comment_component.html.erb

@@ -42,7 +42,7 @@
       <%= render "application/update_notice", record: comment %>
     <% end %>
 
-    <menu>
+    <menu class="mt-2">
       <% if votable? %>
         <li class="comment-votes">
           <% if current_user.is_anonymous? %>

app/components/comment_component/comment_component.scss

@@ -43,9 +43,4 @@ article.comment {
       width: 1.25em;
     }
   }
-
-  .popup-menu {
-    width: 1.5em;
-    height: 1.5em;
-  }
 }

app/components/forum_post_component/forum_post_component.html.erb

@@ -15,7 +15,7 @@
     </div>
     <%= render "application/update_notice", record: forum_post %>
 
-    <menu>
+    <menu class="mt-2">
       <% if policy(forum_post).reply? %>
         <% if current_user.is_anonymous? %>
           <li><%= link_to "Reply", login_path(url: request.fullpath) %></li>

app/components/popup_menu_component/popup_menu_component.html.erb

@@ -1,5 +1,5 @@
-<div class="popup-menu <%= classes %>">
-  <a class="popup-menu-button" href="javascript:void(0)">
+<div class="popup-menu inline-block <%= classes %>">
+  <a class="popup-menu-button inline-block rounded p-1" href="javascript:void(0)">
     <% if button.present? %>
       <%= button %>
     <% else %>

app/components/popup_menu_component/popup_menu_component.scss

@@ -1,16 +1,7 @@
 @import "../../javascript/src/styles/base/000_vars";
 
 div.popup-menu {
-  display: inline-block;
-
   a.popup-menu-button {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    height: 100%;
-    border-radius: 4px;
-    padding: 4px 8px;
     color: var(--muted-text-color);
 
     // the popup menu is open

app/components/preview_size_menu_component/preview_size_menu_component.html.erb

@@ -1,6 +1,6 @@
 <%= render PopupMenuComponent.new(classes: "preview-size-menu") do |menu| %>
   <% menu.button do %>
-    <span class="text-sm">Size <%= caret_down_icon %></span>
+    <%= image_icon %> <span class="text-sm">Size</span> <%= caret_down_icon(class: "text-xs") %>
   <% end %>
 
   <% menu.item do %>