diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index ca1f6ea..3cff4b7 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -70,19 +70,23 @@ module ApplicationHelper MONOGRAM_PALETTE[index] end - # Renders an application icon as a that swaps based on the user's - # color-scheme preference. If only `icon` is attached, the same image is used - # in both modes. Caller is responsible for ensuring at least app.icon is - # attached; the monogram fallback handles the no-icon case separately. + # Renders an application icon with optional dark-mode variant. If + # `icon_dark` is attached, we render both tags and Tailwind's class- + # based `dark:` modifier hides the inactive one — so it follows the in-app + # theme toggle (.dark on ), not the OS preference. If only `icon` is + # attached, the same image is used in both modes. Caller must ensure at + # least app.icon is attached; the monogram fallback handles no-icon. def app_icon_picture(app, class:, alt: nil) img_class = binding.local_variable_get(:class) alt ||= "#{app.name} icon" - light = url_for(app.icon) - dark = app.icon_dark.attached? ? url_for(app.icon_dark) : nil - tag.picture do - sources = [] - sources << tag.source(media: "(prefers-color-scheme: dark)", srcset: dark) if dark - safe_join(sources + [image_tag(app.icon, class: img_class, alt: alt)]) + + if app.icon_dark.attached? + safe_join([ + image_tag(app.icon, class: "#{img_class} dark:hidden", alt: alt), + image_tag(app.icon_dark, class: "#{img_class} hidden dark:block", alt: alt) + ]) + else + image_tag(app.icon, class: img_class, alt: alt) end end end diff --git a/config/initializers/version.rb b/config/initializers/version.rb index 7bbcbfa..8784d6a 100644 --- a/config/initializers/version.rb +++ b/config/initializers/version.rb @@ -1,5 +1,5 @@ # frozen_string_literal: true module Clinch - VERSION = "0.14.1" + VERSION = "0.14.2" end diff --git a/test/helpers/application_helper_test.rb b/test/helpers/application_helper_test.rb index 3834ff9..da76144 100644 --- a/test/helpers/application_helper_test.rb +++ b/test/helpers/application_helper_test.rb @@ -31,4 +31,23 @@ class ApplicationHelperTest < ActionView::TestCase # not a guarantee for all pairs, but should hold for at least one pair assert_not_equal monogram_color("Kavita"), monogram_color("Navidrome") end + + test "app_icon_picture renders both icons with Tailwind dark: toggles when icon_dark is attached" do + app = applications(:kavita_app) + app.icon.attach(io: StringIO.new("light"), filename: "light.png", content_type: "image/png") + app.icon_dark.attach(io: StringIO.new("dark"), filename: "dark.png", content_type: "image/png") + + html = app_icon_picture(app, class: "h-10 w-10 rounded-lg") + assert_match(/dark:hidden/, html) + assert_match(/hidden dark:block/, html) + end + + test "app_icon_picture renders one img when no icon_dark is attached" do + app = applications(:kavita_app) + app.icon.attach(io: StringIO.new("light"), filename: "light.png", content_type: "image/png") + + html = app_icon_picture(app, class: "h-10 w-10") + refute_match(/dark:hidden/, html) + refute_match(/hidden dark:block/, html) + end end