UI Improvements v5

This commit is contained in:
2026-03-08 15:24:47 -04:00
parent b46c70a221
commit c35f312f8c
6 changed files with 143 additions and 22 deletions

View File

@@ -27,16 +27,20 @@ module CommunityLanding
parts.any? ? " style=\"#{parts.join(' ')}\"" : ""
end
def logo_img(url, alt, css_class, height)
"<img src=\"#{url}\" alt=\"#{e(alt)}\" class=\"#{css_class}\" style=\"height: #{height}px;\">"
def logo_img(url, alt, css_class, height, accent: false)
if accent
"<span class=\"#{css_class} cl-logo--accent\" style=\"height: #{height}px; -webkit-mask-image: url('#{url}'); mask-image: url('#{url}');\"><img src=\"#{url}\" alt=\"#{e(alt)}\" style=\"height: #{height}px; visibility: hidden;\"></span>"
else
"<img src=\"#{url}\" alt=\"#{e(alt)}\" class=\"#{css_class}\" style=\"height: #{height}px;\">"
end
end
def render_logo(dark_url, light_url, site_name, base_class, height)
def render_logo(dark_url, light_url, site_name, base_class, height, accent: false)
if dark_url && light_url
logo_img(dark_url, site_name, "#{base_class} cl-logo--dark", height) +
logo_img(light_url, site_name, "#{base_class} cl-logo--light", height)
logo_img(dark_url, site_name, "#{base_class} cl-logo--dark", height, accent: accent) +
logo_img(light_url, site_name, "#{base_class} cl-logo--light", height, accent: accent)
else
logo_img(dark_url || light_url, site_name, base_class, height)
logo_img(dark_url || light_url, site_name, base_class, height, accent: accent)
end
end
end

View File

@@ -165,8 +165,9 @@ module CommunityLanding
html << "<div class=\"cl-navbar__inner\">\n"
html << "<div class=\"cl-navbar__left\">"
html << "<a href=\"/\" class=\"cl-navbar__brand\">"
logo_accent = (@s.logo_use_accent_color rescue false)
if has_logo?
html << render_logo(logo_dark_url, logo_light_url, site_name, "cl-navbar__logo", logo_height)
html << render_logo(logo_dark_url, logo_light_url, site_name, "cl-navbar__logo", logo_height, accent: logo_accent)
else
html << "<span class=\"cl-navbar__site-name\">#{e(site_name)}</span>"
end
@@ -291,13 +292,22 @@ module CommunityLanding
html << "</div>\n"
hero_image_urls_raw = (@s.hero_image_urls.presence rescue nil)
hero_multi = (@s.hero_multiple_images_enabled rescue false)
if hero_multi
hero_image_urls_raw = (@s.hero_image_urls.presence rescue nil)
else
hero_image_urls_raw = (@s.hero_image_url.presence rescue nil)
end
hero_video = (@s.hero_video_url.presence rescue nil)
blur_attr = (@s.hero_video_blur_on_hover rescue true) ? " data-blur-hover=\"true\"" : ""
has_images = false
if hero_image_urls_raw
urls = hero_image_urls_raw.split(/[|\n\r]+/).map(&:strip).reject(&:empty?).first(5)
if hero_multi
urls = hero_image_urls_raw.split(/[|\n\r]+/).map(&:strip).reject(&:empty?).first(5)
else
urls = [hero_image_urls_raw.strip]
end
if urls.any?
has_images = true
img_max_h = @s.hero_image_max_height rescue 500
@@ -685,10 +695,11 @@ module CommunityLanding
html << "<div class=\"cl-footer__brand\">"
flogo = @s.footer_logo_url.presence
footer_accent = (@s.logo_use_accent_color rescue false)
if flogo
html << "<img src=\"#{flogo}\" alt=\"#{e(site_name)}\" class=\"cl-footer__logo\" style=\"height: #{logo_height}px;\">"
html << logo_img(flogo, site_name, "cl-footer__logo", logo_height, accent: footer_accent)
elsif has_logo?
html << render_logo(logo_dark_url, logo_light_url, site_name, "cl-footer__logo", logo_height)
html << render_logo(logo_dark_url, logo_light_url, site_name, "cl-footer__logo", logo_height, accent: footer_accent)
else
html << "<span class=\"cl-footer__site-name\">#{e(site_name)}</span>"
end