diff --git a/assets/css/app.css b/assets/css/app.css index 12417166..09178b21 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -26,6 +26,7 @@ "Inter", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --animate-shake: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; + --animate-shine: shine 3s ease infinite; @keyframes shake { 10%, @@ -46,4 +47,16 @@ transform: translate3d(4px, 0, 0); } } + + @keyframes shine { + 0%, + 100% { + background-size: 200% 200%; + background-position: left center; + } + 50% { + background-size: 200% 200%; + background-position: right center; + } + } } diff --git a/lib/music_library_web/components/stats_components.ex b/lib/music_library_web/components/stats_components.ex index 01cc11e6..cfeab600 100644 --- a/lib/music_library_web/components/stats_components.ex +++ b/lib/music_library_web/components/stats_components.ex @@ -128,13 +128,7 @@ defmodule MusicLibraryWeb.StatsComponents do
- {ngettext( - "1 year ago", - "%{count} years ago", - Records.Record.released_how_long_ago?(record, @current_date) - )} -
+ <.released_how_long_ago record={record} current_date={@current_date} />
{format_label(record.format)} ยท {type_label(record.type)}
@@ -166,6 +160,36 @@ defmodule MusicLibraryWeb.StatsComponents do
"""
end
+ attr :record, Records.Record, required: true
+ attr :current_date, Date, required: true
+
+ defp released_how_long_ago(assigns) do
+ assigns =
+ assign(
+ assigns,
+ :years,
+ Records.Record.released_how_long_ago?(assigns.record, assigns.current_date)
+ )
+
+ ~H"""
+
+ {ngettext(
+ "1 year ago",
+ "%{count} years ago",
+ @years
+ )}
+