✨ Extraie ImageFileInput et IconFileInput

Depuis Hedwige

Author: cprodhomme

captive-theme/app/assets/stylesheets/captive-theme/forms/_icon_file.scss

@@ -0,0 +1,17 @@
+
+@mixin icon() {
+  object-fit: cover;
+  border-radius: 3px;
+}
+
+.icon-preview {
+  @include icon;
+  width: 78px;
+  height: 78px;
+
+  &__small {
+    @include icon;
+    width: 36px;
+    height: 36px;
+  }
+}

captive-theme/app/inputs/icon_file_input.rb

@@ -0,0 +1,8 @@
+class IconFileInput < ImageFileInput
+  def image_preview_html_options
+    options = super
+    options[:class] ||= ''
+    options[:class] += ' icon-preview'
+    options
+  end
+end

captive-theme/app/inputs/image_file_input.rb

@@ -0,0 +1,27 @@
+class ImageFileInput < Formtastic::Inputs::FileInput
+  def to_html
+    input_wrapping do
+      label_html <<
+        builder.file_field(method, input_html_options) <<
+        image_preview_html
+    end
+  end
+
+  def image_preview_html
+    if object.send(method)&.attached?
+      builder.template.image_tag(object.send(method), image_preview_html_options)
+    else
+      ''
+    end
+  end
+
+  def input_html_options
+    {
+      accept: 'image/*',
+    }.merge(super)
+  end
+
+  def image_preview_html_options
+    options[:image_preview_html] ||= { style: 'max-width: 100%;' }
+  end
+end