b4um_generators 0.2.8 → 0.2.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4ac1397c02b6a4475966dd32cae4aa31b251ac3b6e29cbc0fda6994a3e325a3f
-  data.tar.gz: fd7a685c7cbd61c96c9fd2e54ffd622b0b4593f83c0e27257d1afec24d0375ff
+  metadata.gz: 4554ba68c9377451369455eee637d0ebf9b05926d17f1cca4e7846ed9a3e7ffe
+  data.tar.gz: 52c056de9b177de1f0e790ede1d7c13fcd5888c18eb95e02d5e93895c2827040
 SHA512:
-  metadata.gz: 43445dcd341aa92ebca76c14eafd500bfa993110e58e203f7f8ea2b0af22127e24c97374e95c33c336cb90f10220175dbf277168edd4e31f55de2fdd1392f87b
-  data.tar.gz: '00147389d26a82e439a634c6712f4b42c7561f99593451c80ddf5d6b23205feb377d6f569ceb2adf2dbd82fec8335d29436451c7dad21515a22619464421c0ae'
+  metadata.gz: c2758a16ff6d6fdfc220c7c49c8c698d09628ba53ecf45054f446bf062d291dfed85c5ca2a31d50e69e3d6a77521500d01805eaa21ff07cc8bf1adabe6ec0566
+  data.tar.gz: 22027e9c4911cbc9b16f8ad15132ff9681c32eaa4b53760c4e7c5838f7ff86e609879d94450bf19e975a105a48c196864d7c5bdcbea351266901c109563399e8

data/lib/b4um_generators/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module B4umGenerators
-  VERSION = "0.2.8"
+  VERSION = "0.2.9"
 end

data/lib/generators/b4um/install/templates/b4um/lightbox.css

@@ -1,7 +1,9 @@
 /* -------------------------------------------------------
    Image lightbox
 ------------------------------------------------------- */
-
+.lupe {
+  cursor: zoom-in;
+}
 .resource-image__button,
 .resource-images__button {
   display: block;
@@ -38,7 +40,11 @@
   padding: 70px 90px 110px;
   box-sizing: border-box;
 
-  background-color: rgba(0, 0, 0, 0.92);
+  background: var(--b4um-hero-teaser-background);
+  color: var(--b4um-hero-teaser-text);
+
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
 }
 
 .image-lightbox[hidden] {
@@ -121,7 +127,7 @@ body.image-lightbox-open {
   top: 28px;
   left: 28px;
 
-  color: #ffffff;
+  color: var(--b4um-hero-teaser-text);
 
   font-size: 0.9rem;
   font-weight: 500;
@@ -146,7 +152,7 @@ body.image-lightbox-open {
   border: 0;
 
   background: transparent;
-  color: #ffffff;
+  color: var(--b4um-hero-teaser-text);
 
   font: inherit;
   font-size: 2.5rem;
@@ -165,11 +171,11 @@ body.image-lightbox-open {
   justify-content: center;
 
   width: 56px;
-  height: 72px;
-  padding: 0;
+  height: 56px;
+  padding-bottom: 12px;
 
   border: 0;
-  border-radius: 8px;
+  border-radius: 50%;
 
   background-color: rgba(0, 0, 0, 0.35);
   color: #ffffff;
@@ -181,7 +187,7 @@ body.image-lightbox-open {
 
   cursor: pointer;
 
-  transform: translateY(-50%);
+  transform: translateY(-100%);
 
   transition:
     background-color 0.18s ease,
@@ -189,7 +195,7 @@ body.image-lightbox-open {
 }
 
 .image-lightbox__navigation:hover {
-  background-color: rgba(255, 255, 255, 0.16);
+  background-color: rgba(0, 0, 0, 0.16);
 }
 
 .image-lightbox__navigation--previous {
@@ -212,7 +218,7 @@ body.image-lightbox-open {
   bottom: 24px;
   left: 20px;
 
-  color: #ffffff;
+  color: var(--b4um-hero-teaser-text);
 
   font-size: 0.85rem;
   text-align: center;
@@ -220,6 +226,82 @@ body.image-lightbox-open {
   overflow-wrap: anywhere;
 }
 
+/* -------------------------------------------------------
+   Thumbnails
+------------------------------------------------------- */
+
+.image-lightbox__thumbnails {
+  position: absolute;
+  right: 6rem;
+  bottom: 2rem;
+  left: 6rem;
+  z-index: 3;
+
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  gap: 0.75rem;
+
+  overflow-x: auto;
+  overflow-y: hidden;
+
+  padding: 0.5rem;
+
+  scrollbar-width: none;
+}
+
+.image-lightbox__thumbnails::-webkit-scrollbar {
+  display: none;
+}
+
+.image-lightbox__thumbnail {
+  flex: 0 0 auto;
+
+  width: 72px;
+  height: 52px;
+
+  padding: 3px;
+
+  overflow: hidden;
+
+  border: 2px solid transparent;
+  border-radius: 10px;
+
+  background: rgba(255, 255, 255, 0.12);
+
+  opacity: 0.55;
+  cursor: pointer;
+
+  transition:
+    opacity 0.2s ease,
+    border-color 0.2s ease,
+    transform 0.2s ease;
+}
+
+.image-lightbox__thumbnail:hover {
+  opacity: 0.85;
+}
+
+.image-lightbox__thumbnail.is-active {
+  border-color: var(--b4um-hero-teaser-text);
+
+  opacity: 1;
+
+  transform: scale(1.06);
+}
+
+.image-lightbox__thumbnail img {
+  display: block;
+
+  width: 100%;
+  height: 100%;
+
+  border-radius: 6px;
+
+  object-fit: cover;
+}
+
 @media (prefers-reduced-motion: reduce) {
   .image-lightbox__image--sliding {
     transition: none;

data/lib/generators/b4um/install/templates/b4um/theme.css

@@ -62,6 +62,10 @@
   --b4um-primary-shadow: rgba(46, 71, 210, 0.22);
   --b4um-primary-shadow-soft: rgba(46, 71, 210, 0.12);
   --b4um-danger-shadow: rgba(204, 0, 0, 0.18);
+
+  --b4um-hero-teaser-background: rgba(255, 255, 255, 0.55);
+  --b4um-hero-teaser-text: rgba(20, 20, 20, 0.9);
+  --b4um-hero-teaser-border: rgba(255, 255, 255, 0.3);
 }
 
 /* -------------------------------------------------------
@@ -128,5 +132,9 @@
   --b4um-primary-shadow-soft: rgba(142, 162, 255, 0.14);
   --b4um-danger-shadow: rgba(255, 133, 133, 0.18);
 
+  --b4um-hero-teaser-background: rgba(20, 20, 20, 0.55);
+  --b4um-hero-teaser-text: rgba(255, 255, 255, 0.85);
+  --b4um-hero-teaser-border: rgba(255, 255, 255, 0.18);
+
   color-scheme: dark;
 }

data/lib/generators/b4um/install/templates/image_lightbox_controller.js

@@ -1,7 +1,17 @@
 import { Controller } from '@hotwired/stimulus'
 
 export default class extends Controller {
-  static targets = ['item', 'overlay', 'stage', 'image', 'caption', 'counter', 'previousButton', 'nextButton']
+  static targets = [
+    'item',
+    'overlay',
+    'stage',
+    'image',
+    'caption',
+    'counter',
+    'previousButton',
+    'nextButton',
+    'thumbnails'
+  ]
 
   connect() {
     this.currentIndex = 0
@@ -22,6 +32,7 @@ export default class extends Controller {
     if (index === -1) return
 
     this.currentIndex = index
+    this.buildThumbnails()
     this.showCurrentImage()
 
     this.overlayTarget.hidden = false
@@ -30,6 +41,64 @@ export default class extends Controller {
     this.overlayTarget.focus()
   }
 
+  buildThumbnails() {
+    if (!this.hasThumbnailsTarget) return
+
+    this.thumbnailsTarget.innerHTML = ''
+
+    this.itemTargets.forEach((item, index) => {
+      const button = document.createElement('button')
+      button.type = 'button'
+      button.className = 'image-lightbox__thumbnail'
+      button.setAttribute('aria-label', `Bild ${index + 1} anzeigen`)
+
+      const image = document.createElement('img')
+      image.src = item.dataset.imageLightboxUrl
+      image.alt = item.dataset.imageLightboxAlt || ''
+
+      button.appendChild(image)
+
+      button.addEventListener('click', (event) => {
+        event.stopPropagation()
+
+        if (index === this.currentIndex) return
+        if (this.isSliding) return
+
+        const direction = index > this.currentIndex ? 'next' : 'previous'
+
+        this.updateThumbnails(index)
+        this.slideTo(index, direction)
+      })
+
+      this.thumbnailsTarget.appendChild(button)
+    })
+
+    this.updateThumbnails()
+  }
+
+  updateThumbnails(activeIndex = this.currentIndex) {
+    if (!this.hasThumbnailsTarget) return
+
+    const thumbnails = Array.from(this.thumbnailsTarget.querySelectorAll('.image-lightbox__thumbnail'))
+
+    thumbnails.forEach((thumbnail, index) => {
+      const active = index === activeIndex
+
+      thumbnail.classList.toggle('is-active', active)
+      thumbnail.setAttribute('aria-current', active ? 'true' : 'false')
+    })
+
+    const activeThumbnail = thumbnails[activeIndex]
+
+    if (activeThumbnail) {
+      activeThumbnail.scrollIntoView({
+        behavior: this.prefersReducedMotion() ? 'auto' : 'smooth',
+        block: 'nearest',
+        inline: 'center'
+      })
+    }
+  }
+
   close() {
     if (this.isSliding) return
 
@@ -37,13 +106,6 @@ export default class extends Controller {
     document.body.classList.remove('image-lightbox-open')
   }
 
-  /*
-  closeOnBackground(event) {
-    if (event.target !== this.overlayTarget) return
-
-    this.close()
-  }*/
-
   closeOnBackground(event) {
     if (this.isDragging || this.isSliding) return
 
@@ -207,6 +269,7 @@ export default class extends Controller {
 
       this.currentIndex = newIndex
       this.updateInformation()
+      this.updateThumbnails()
 
       this.dragPreviousImage = null
       this.dragNextImage = null
@@ -361,6 +424,7 @@ export default class extends Controller {
 
           this.currentIndex = index
           this.updateInformation()
+          this.updateThumbnails()
 
           this.isSliding = false
         }

data/lib/generators/b4um/scaffold/templates/_bento.html.erb.tt

@@ -1,20 +1,22 @@
 <div id="<%= plural_table_name %>" class="b4um-grid">
   <%% <%= plural_table_name %>.each_with_index do |<%= singular_table_name %>, index| %>
-    <%% card_class =
-      case index % 5
-      when 0
-        "b4um-card b4um-card--wide"
-      when 1
-        "b4um-card b4um-card--soft"
-      when 3
-        "b4um-card b4um-card--large"
-      else
-        "b4um-card"
-      end
-    %>
+    <%% card_class, preview_length =
+        case index % 5
+        when 0
+          ["b4um-card b4um-card--wide", 240]
+        when 1
+          ["b4um-card b4um-card--soft", 58]
+        when 3
+          ["b4um-card b4um-card--large", 1600]
+        else
+          ["b4um-card", 58]
+        end
+      %>
 
     <article class="<%%= card_class %>">
-      <%%= render <%= singular_table_name %>, compact: true %>
+      <%%= render <%= singular_table_name %>,
+            compact: true,
+            preview_length: preview_length %>
 
       <div class="b4um-card__actions">
         <%%= link_to "Show",

data/lib/generators/b4um/scaffold/templates/_form.html.erb.tt

@@ -76,11 +76,21 @@
     <%%= form.label :<%= attribute.name %>, class: "form-label" %>
   </div>
 
-<% elsif [:integer, :float, :decimal].include?(attribute.type) -%>
+<% elsif attribute.type == :integer -%>
   <div class="form-field">
     <%%= form.number_field :<%= attribute.name %>,
           class: "form-input",
-          placeholder: " " %>
+          placeholder: " ",
+          step: 1 %>
+    <%%= form.label :<%= attribute.name %>, class: "form-label" %>
+  </div>
+
+<% elsif [:float, :decimal].include?(attribute.type) -%>
+  <div class="form-field">
+    <%%= form.number_field :<%= attribute.name %>,
+          class: "form-input",
+          placeholder: " ",
+          step: "any" %>
     <%%= form.label :<%= attribute.name %>, class: "form-label" %>
   </div>
 

data/lib/generators/b4um/scaffold/templates/_resource.html.erb.tt

@@ -49,6 +49,8 @@
                  alt="">
           </div>
 
+          <div class="image-lightbox__thumbnails" data-image-lightbox-target="thumbnails"></div>
+
           <div class="image-lightbox__caption"
                data-image-lightbox-target="caption"></div>
         </div>
@@ -119,6 +121,8 @@
             &#8250;
           </button>
 
+          <div class="image-lightbox__thumbnails" data-image-lightbox-target="thumbnails"></div>
+
           <div class="image-lightbox__caption"
                data-image-lightbox-target="caption"></div>
         </div>
@@ -131,11 +135,23 @@
 <% elsif attribute.type == :text -%>
     <span class="resource-value">
       <%% if local_assigns[:compact] %>
-        <%%= truncate(<%= singular_table_name %>.<%= attribute.name %>, length: 160) %>
+        <%%= truncate(
+              <%= singular_table_name %>.<%= attribute.name %>,
+              length: local_assigns.fetch(:preview_length, 160)
+            ) %>
       <%% else %>
         <%%= <%= singular_table_name %>.<%= attribute.name %> %>
       <%% end %>
     </span>
+<% elsif attribute.type == :decimal -%>
+    <span class="resource-value">
+      <%%= number_with_precision(
+            <%= singular_table_name %>.<%= attribute.name %>,
+            precision: 2,
+            delimiter: ".",
+            separator: ","
+          ) %>
+    </span>
 <% else -%>
     <span class="resource-value"><%%= <%= singular_table_name %>.<%= attribute.name %> %></span>
 <% end -%>

data/lib/generators/b4um/scaffold/templates/_table.html.erb.tt

@@ -20,6 +20,13 @@
             </span>
 <% elsif attribute.type == :text -%>
             <%%= truncate(<%= singular_table_name %>.<%= attribute.name %>, length: 100) %>
+<% elsif attribute.type == :decimal -%>
+            <%%= number_with_precision(
+                  <%= singular_table_name %>.<%= attribute.name %>,
+                  precision: 2,
+                  delimiter: ".",
+                  separator: ","
+                ) %>
 <% else -%>
             <%%= <%= singular_table_name %>.<%= attribute.name %> %>
 <% end -%>

data/lib/generators/b4um/trix/templates/b4um_rich_text_helper.rb

@@ -10,7 +10,8 @@ module B4umRichTextHelper
     first_element = document.element_children.first
     heading = b4um_preview_heading(first_element)
 
-    plain_text = rich_text.to_plain_text.strip
+    document.css("action-text-attachment").remove
+    plain_text = document.text.strip
 
     if heading
       heading_text = heading.text.strip

data/lib/generators/b4um/trix/templates/b4um_trix.js

@@ -43,6 +43,7 @@ configureHeadingAttributes()
 configureAlignmentAttributes()
 configureContainerAttributes()
 configureColorAttributes()
+preserveNestedContainerHtmlAttributes()
 registerAlignmentElements()
 
 document.addEventListener('trix-initialize', (event) => {
@@ -77,6 +78,8 @@ function insertContainer(editor, tagName) {
     return
   }
 
+  const selectedText = editor.getDocument().toString().slice(selectedRange[0], selectedRange[1]).trim()
+
   const id = window.prompt('Bitte geben Sie die ID ein:')
 
   if (id === null) return
@@ -91,14 +94,23 @@ function insertContainer(editor, tagName) {
   editor.recordUndoEntry(`Insert ${tagName.toUpperCase()} Container`)
 
   editor.setSelectedRange(selectedRange)
+  editor.activateAttribute(tagName)
 
-  const attributeName = tagName === 'div' ? 'b4umDiv' : tagName
+  const documentModel = editor.getDocument()
 
-  editor.activateAttribute(attributeName)
+  const block = documentModel.getBlocks().find((block) => {
+    return block.getAttributes().includes(tagName) && block.toString().includes(selectedText)
+  })
 
-  editor.composition.setHTMLAtributeAtPosition(selectedRange[0], 'id', trimmedId)
+  if (!block) {
+    console.error('b4um Trix: Container-Block wurde nicht gefunden.')
+    return
+  }
 
-  editor.setSelectedRange(selectedRange)
+  const newBlock = block.addHTMLAttribute('id', trimmedId)
+  const newDocument = documentModel.replaceBlock(block, newBlock)
+
+  editor.loadDocument(newDocument)
 }
 
 /* -------------------------------------------------------------------------- */
@@ -106,8 +118,6 @@ function insertContainer(editor, tagName) {
 /* -------------------------------------------------------------------------- */
 
 function allowB4umHtmlAttributes() {
-  const originalSetHTML = Trix.HTMLSanitizer.setHTML
-
   Trix.HTMLSanitizer.setHTML = function (element, html, options = {}) {
     const allowedAttributes = [
       'style',
@@ -121,10 +131,14 @@ function allowB4umHtmlAttributes() {
       ...(options.allowedAttributes || [])
     ]
 
-    return originalSetHTML.call(this, element, html, {
+    const sanitizedElement = this.sanitize(html, {
       ...options,
       allowedAttributes: [...new Set(allowedAttributes)]
     })
+
+    const sanitizedHtml = sanitizedElement.getHTML ? sanitizedElement.getHTML() : sanitizedElement.outerHTML
+
+    element.innerHTML = sanitizedHtml
   }
 }
 
@@ -152,22 +166,17 @@ function configureAlignmentAttributes() {
 }
 
 function configureContainerAttributes() {
-  Trix.config.blockAttributes.default.htmlAttributes = ['id']
-
-  Trix.config.blockAttributes.b4umDiv = {
-    tagName: 'div',
+  Trix.config.blockAttributes.section = {
+    tagName: 'section',
     parse: true,
     nestable: false,
     exclusive: true,
     group: false,
-    htmlAttributes: ['id'],
-    test(element) {
-      return element.hasAttribute('id')
-    }
+    htmlAttributes: ['id']
   }
 
-  Trix.config.blockAttributes.section = {
-    tagName: 'section',
+  Trix.config.blockAttributes.article = {
+    tagName: 'article',
     parse: true,
     nestable: false,
     exclusive: true,
@@ -175,8 +184,8 @@ function configureContainerAttributes() {
     htmlAttributes: ['id']
   }
 
-  Trix.config.blockAttributes.article = {
-    tagName: 'article',
+  Trix.config.blockAttributes.div = {
+    tagName: 'div',
     parse: true,
     nestable: false,
     exclusive: true,
@@ -185,6 +194,40 @@ function configureContainerAttributes() {
   }
 }
 
+function preserveNestedContainerHtmlAttributes() {
+  const prototype = Trix.HTMLParser.prototype
+
+  if (prototype.b4umPreservesNestedContainerHtmlAttributes) return
+
+  const originalAppendBlockForAttributesWithElement = prototype.appendBlockForAttributesWithElement
+
+  prototype.appendBlockForAttributesWithElement = function (attributes, element, htmlAttributes = {}) {
+    let mergedHtmlAttributes = { ...htmlAttributes }
+    let parentElement = element.parentElement
+
+    while (parentElement && parentElement !== this.containerElement) {
+      const tagName = parentElement.tagName.toLowerCase()
+
+      const isB4umContainer = ['section', 'article', 'div'].includes(tagName)
+
+      if (isB4umContainer && parentElement.hasAttribute('id')) {
+        mergedHtmlAttributes = {
+          id: parentElement.getAttribute('id'),
+          ...mergedHtmlAttributes
+        }
+
+        break
+      }
+
+      parentElement = parentElement.parentElement
+    }
+
+    return originalAppendBlockForAttributesWithElement.call(this, attributes, element, mergedHtmlAttributes)
+  }
+
+  prototype.b4umPreservesNestedContainerHtmlAttributes = true
+}
+
 function configureColorAttributes() {
   FOREGROUND_COLORS.forEach((color, index) => {
     Trix.config.textAttributes[`fgColor${index + 1}`] = {
@@ -312,9 +355,7 @@ function installContainerButtonHandlers(editorElement, toolbar) {
   if (!editor) return
 
   toolbar
-    .querySelectorAll(
-      '[data-trix-attribute="b4umDiv"], [data-trix-attribute="section"], [data-trix-attribute="article"]'
-    )
+    .querySelectorAll('[data-trix-attribute="section"], [data-trix-attribute="article"], [data-trix-attribute="div"]')
     .forEach((button) => {
       if (button.dataset.b4umContainerHandler === 'true') return
 
@@ -334,9 +375,7 @@ function installContainerButtonHandlers(editorElement, toolbar) {
           event.preventDefault()
           event.stopImmediatePropagation()
 
-          const tagName = attributeName === 'b4umDiv' ? 'div' : attributeName
-
-          insertContainer(editor, tagName)
+          insertContainer(editor, attributeName)
         },
         true
       )
@@ -447,15 +486,6 @@ function containerButtonsTemplate() {
     <span
       class="trix-button-group trix-button-group--container-tools"
       data-trix-button-group="container-tools">
-      <button
-        type="button"
-        class="trix-button"
-        data-trix-attribute="b4umDiv"
-        title="DIV"
-        aria-label="DIV"
-        tabindex="-1">
-        div
-      </button>
       <button
         type="button"
         class="trix-button"
@@ -474,6 +504,15 @@ function containerButtonsTemplate() {
         tabindex="-1">
         article
       </button>
+      <button
+        type="button"
+        class="trix-button"
+        data-trix-attribute="div"
+        title="DIV"
+        aria-label="DIV"
+        tabindex="-1">
+        div
+      </button>
     </span>
   `
 }

data/lib/generators/b4um/trix/trix_generator.rb

@@ -151,16 +151,49 @@ module B4um
 
         resource_name = name.underscore
 
+        preview_length =
+          'local_assigns\.fetch\(:preview_length,\s*160\)'
+
+        resource_attribute =
+          "#{Regexp.escape(resource_name)}\\.#{Regexp.escape(attribute)}"
+
+        rich_text_pattern =
+          /truncate\(\s*#{resource_attribute},\s*length:\s*#{preview_length}\s*\)/m
+
+        plain_text_pattern =
+          /truncate\(\s*#{resource_attribute}\.to_plain_text,\s*length:\s*#{preview_length}\s*\)/m
+
+        replacement =
+          "b4um_rich_text_preview(" \
+          "#{resource_name}.#{attribute}, " \
+          "length: local_assigns.fetch(:preview_length, 160))"
+
+        legacy_replacement =
+          "b4um_rich_text_preview(" \
+          "#{resource_name}.#{attribute}, length: 160)"
+
+        gsub_file(
+          resource_partial_path,
+          rich_text_pattern,
+          replacement
+        )
+
+        gsub_file(
+          resource_partial_path,
+          plain_text_pattern,
+          replacement
+        )
+
         gsub_file(
           resource_partial_path,
           "truncate(#{resource_name}.#{attribute}, length: 160)",
-          "b4um_rich_text_preview(#{resource_name}.#{attribute}, length: 160)"
+          legacy_replacement
         )
 
         gsub_file(
           resource_partial_path,
           "truncate(#{resource_name}.#{attribute}.to_plain_text, length: 160)",
-          "b4um_rich_text_preview(#{resource_name}.#{attribute}, length: 160)"
+          legacy_replacement
         )
 
         partial = File.read(resource_partial_path)
@@ -243,7 +276,7 @@ module B4um
         unless partial.include?("blob.video?")
           gsub_file(
             action_text_blob_partial_path,
-            /<% if blob\.representable\? %>\s*(<%= image_tag .+? %>)\s*<% end %>/m,
+            /<% if blob\.representable\? %>\s*<%= image_tag .+? %>\s*<% end %>/m,
             <<~ERB.chomp
               <% if blob.video? %>
                 <%= video_tag rails_blob_path(blob, disposition: "inline"),
@@ -251,8 +284,8 @@ module B4um
                       playsinline: true,
                       preload: "metadata",
                       class: "b4um-rich-text-video" %>
-              <% elsif blob.representable? %>
-                \\1
+              <% elsif blob.image? %>
+                <%= image_tag rails_blob_path(blob, disposition: "inline") %>
               <% end %>
             ERB
           )
@@ -266,13 +299,14 @@ module B4um
           action_text_blob_partial_path,
           /<%= image_tag (.+?) %>/,
           <<~ERB.chomp
-            <%= image_tag \\1,
+            <%= image_tag rails_blob_path(blob, disposition: "inline"),
                   data: {
                     image_lightbox_target: "item",
                     image_lightbox_url: rails_blob_path(blob, only_path: true),
                     image_lightbox_alt: blob.filename.to_s,
                     action: "click->image-lightbox#open"
-                  } %>
+                  },
+                  class: "lupe" %>
           ERB
         )
       end

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification
 name: b4um_generators
 version: !ruby/object:Gem::Version
-  version: 0.2.8
+  version: 0.2.9
 platform: ruby
 authors:
 - Alexander Baum
 bindir: exe
 cert_chain: []
-date: 2026-09-28 00:00:00.000000000 Z
+date: 2026-10-04 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties