Refactor: お品書きの画像のCSS指定を名前をつけて共通化した

momocus · Jan 20, 2025 · 3e2f2c4 · 3e2f2c4
1 parent ebbea51
commit 3e2f2c4
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -182,6 +182,13 @@ $accent: #b7282e;
   font-family: "Yuji Syuku", serif;
 }
 
+.menu-img {
+  @extend .w-25;
+  @extend .img-fluid;
+
+  min-width: "140px";
+}
+
 .accent-text {
   color: $accent;
 }

diff --git a/app/views/sakes/_menu_one_drink.html.erb b/app/views/sakes/_menu_one_drink.html.erb
@@ -10,10 +10,10 @@
   <div class="d-flex align-items-end justify-content-between">
     <% if sake.photos.any? %>
       <% photo = sake.photos.first %>
-      <%= cl_image_tag(photo.image.thumb.url, class: "rounded img-fluid w-25", style: "min-width: 140px") %>
+      <%= cl_image_tag(photo.image.thumb.url, class: "menu-img rounded") %>
 
     <% else %>
-      <%= cl_image_tag(image_url("sake-no-photo.avif"), class: "w-25 img-thumbnail", style: "min-width: 140px") %>
+      <%= cl_image_tag(image_url("sake-no-photo.avif"), class: "menu-img img-thumbnail") %>
     <% end %>
     <div class="flex-grow-1 ms-5 text-end price-tag-border fs-4">
       <%= price_tag(sake.selling_price) %>