Generated monogram fallback + optional dark-mode icon per application
Some checks failed
Some checks failed
When an application has no icon attached, render a deterministic monogram SVG instead of the generic picture-frame placeholder. Initials are picked from capital letters in the name (ShelfLife -> SL); fall back to the first two letters when fewer than two capitals exist (Audiobookshelf -> AU). Background colour is hashed from the name for stable per-app identity across visits. Adds an optional second icon attachment, icon_dark, alongside the main icon. When present, render a <picture> with a prefers-color-scheme: dark source so the browser swaps automatically; when absent, the main icon is used in both modes. The SVG sanitization, content-type fix, and size/format validation now run over both attachments uniformly. Bumps to 0.14.0. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
18
app/views/shared/_app_monogram.html.erb
Normal file
18
app/views/shared/_app_monogram.html.erb
Normal file
@@ -0,0 +1,18 @@
|
||||
<%# Renders a deterministic monogram SVG for an Application that has no icon.
|
||||
Locals:
|
||||
name - the application name (required)
|
||||
class - css classes for the <svg> element (e.g. "h-12 w-12 rounded-lg")
|
||||
%>
|
||||
<% initials = monogram_initials(name) %>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"
|
||||
class="<%= local_assigns[:class] || "h-12 w-12 rounded-lg" %>"
|
||||
role="img" aria-label="<%= name %> icon">
|
||||
<rect width="40" height="40" fill="<%= monogram_color(name) %>" />
|
||||
<text x="50%" y="52%" dominant-baseline="middle" text-anchor="middle"
|
||||
font-family="ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif"
|
||||
font-weight="600" fill="#ffffff"
|
||||
font-size="<%= initials.length == 1 ? 22 : 17 %>"
|
||||
letter-spacing="-0.5">
|
||||
<%= initials %>
|
||||
</text>
|
||||
</svg>
|
||||
Reference in New Issue
Block a user