diff --git a/app/assets/stylesheets/components/form.css b/app/assets/stylesheets/components/form.css index c129e6a..738a51c 100644 --- a/app/assets/stylesheets/components/form.css +++ b/app/assets/stylesheets/components/form.css @@ -29,50 +29,28 @@ input[type=submit], input[type=button] { display: flex; align-items: center; gap: var(--spacing-2); - - &::before { - font-family: "Font Awesome 6 Free"; - font-weight: 900; - font-size: var(--font-size-md); - } } .flash.alert { background-color: var(--color-danger-soft); color: var(--color-danger); border: var(--border-width) solid var(--color-danger); - - &::before { - content: "\f071"; /* fa-triangle-exclamation */ - } } .flash.notice { background-color: var(--color-success-soft); color: var(--color-success); border: var(--border-width) solid var(--color-success); - - &::before { - content: "\f00c"; /* fa-check */ - } } .flash.warning { background-color: var(--color-warning-bg); color: var(--color-warning-text); border: var(--border-width) solid var(--color-warning); - - &::before { - content: "\f06a"; /* fa-circle-exclamation */ - } } .flash.info { background-color: var(--color-info-soft); color: var(--color-info); border: var(--border-width) solid var(--color-info); - - &::before { - content: "\f05a"; /* fa-circle-info */ - } } diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index c67eaab..57966bb 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -116,4 +116,16 @@ def can_remove_note_mention?(mention, user) false end end + + def flash_icon(type) + icon_class = case type.to_s + when "alert" then "fa-solid fa-triangle-exclamation" + when "notice" then "fa-solid fa-check" + when "warning" then "fa-solid fa-circle-exclamation" + when "info" then "fa-solid fa-circle-info" + end + return unless icon_class + + content_tag(:i, "", class: icon_class, aria: { hidden: "true" }) + end end diff --git a/app/views/layouts/application.html.slim b/app/views/layouts/application.html.slim index 11c01f9..4103b92 100644 --- a/app/views/layouts/application.html.slim +++ b/app/views/layouts/application.html.slim @@ -135,11 +135,13 @@ html data-theme="light" main.container - flash.each do |type, message| .flash class=type + = flash_icon(type) = message = yield - else main.container - flash.each do |type, message| .flash class=type + = flash_icon(type) = message = yield