cloud/music_library
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Animate copy icon

Browse Source
This commit is contained in:
Claudio Ortolina
2024-11-01 10:55:05 +00:00
parent 9daaaadb46
commit 0ccb165235
4 changed files with 39 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/tailwind.config.js
+19
View File
@@ -20,6 +20,25 @@ module.exports = {
fontFamily: {
sans: ['Inter', ...defaultTheme.fontFamily.sans],
},
animation:{
'shake': 'shake 0.82s cubic-bezier(.36,.07,.19,.97) both',
},
keyframes: {
'shake' : {
'10%, 90%': {
transform: 'translate3d(-1px, 0, 0)'
},
'20%, 80%' : {
transform: 'translate3d(2px, 0, 0)'
},
'30%, 50%, 70%': {
transform: 'translate3d(-4px, 0, 0)'
},
'40%, 60%': {
transform: 'translate3d(4px, 0, 0)'
}
}
}
},
},
plugins: [
lib/music_library_web/live/record_live/show.html.heex
+4 -6
View File
@@ -60,12 +60,10 @@
<a href={musicbrainz_url(@record)}>
<code id={"mb-#{@record.musicbrainz_id}"}><%= @record.musicbrainz_id %></code>
</a>
<button
class="transition-colors"
phx-click={
JS.dispatch("music_library:clipcopy", to: "#mb-" <> @record.musicbrainz_id)
}
>
<button phx-click={
JS.dispatch("music_library:clipcopy", to: "#mb-" <> @record.musicbrainz_id)
|> JS.transition("animate-shake")
}>
<span class="sr-only"><%= gettext("Copy MusicBrainz ID to clipboard") %></span>
<.icon
name="hero-clipboard-document"
lib/music_library_web/live/wishlist_live/show.html.heex
+5 -6
View File
@@ -42,6 +42,7 @@
) %> · <%= Records.Record.type_long_label(@record.type) %>
</p>
</div>
<div>
<dl class="mt-4 divide-y divide-gray-100 dark:divide-slate-300/30">
<div class="py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
@@ -60,12 +61,10 @@
<a href={musicbrainz_url(@record)}>
<code id={"mb-#{@record.musicbrainz_id}"}><%= @record.musicbrainz_id %></code>
</a>
<button
class="transition-colors"
phx-click={
JS.dispatch("music_library:clipcopy", to: "#mb-" <> @record.musicbrainz_id)
}
>
<button phx-click={
JS.dispatch("music_library:clipcopy", to: "#mb-" <> @record.musicbrainz_id)
|> JS.transition("animate-shake")
}>
<span class="sr-only"><%= gettext("Copy MusicBrainz ID to clipboard") %></span>
<.icon
name="hero-clipboard-document"
priv/gettext/default.pot
+11 -11
View File
@@ -29,12 +29,12 @@ msgstr ""
msgid "Attempting to reconnect"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:109
#: lib/music_library_web/live/record_live/show.html.heex:107
#, elixir-autogen, elixir-format
msgid "Back to records"
msgstr ""
#: lib/music_library_web/live/wishlist_live/show.html.heex:101
#: lib/music_library_web/live/wishlist_live/show.html.heex:100
#, elixir-autogen, elixir-format
msgid "Back to wishlist"
msgstr ""
@@ -103,7 +103,7 @@ msgid "Formats"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:49
#: lib/music_library_web/live/wishlist_live/show.html.heex:49
#: lib/music_library_web/live/wishlist_live/show.html.heex:50
#, elixir-autogen, elixir-format
msgid "Genres"
msgstr ""
@@ -125,8 +125,8 @@ msgstr ""
msgid "Import from MusicBrainz"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:89
#: lib/music_library_web/live/wishlist_live/show.html.heex:81
#: lib/music_library_web/live/record_live/show.html.heex:87
#: lib/music_library_web/live/wishlist_live/show.html.heex:80
#, elixir-autogen, elixir-format
msgid "Inserted at"
msgstr ""
@@ -152,7 +152,7 @@ msgid "Logout"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:57
#: lib/music_library_web/live/wishlist_live/show.html.heex:57
#: lib/music_library_web/live/wishlist_live/show.html.heex:58
#, elixir-autogen, elixir-format
msgid "MusicBrainz ID"
msgstr ""
@@ -201,7 +201,7 @@ msgstr ""
msgid "Purchased at"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:81
#: lib/music_library_web/live/record_live/show.html.heex:79
#, elixir-autogen, elixir-format
msgid "Purchased on"
msgstr ""
@@ -307,8 +307,8 @@ msgstr ""
msgid "Types"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:97
#: lib/music_library_web/live/wishlist_live/show.html.heex:89
#: lib/music_library_web/live/record_live/show.html.heex:95
#: lib/music_library_web/live/wishlist_live/show.html.heex:88
#, elixir-autogen, elixir-format
msgid "Updated at"
msgstr ""
@@ -346,8 +346,8 @@ msgstr ""
msgid "close"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:69
#: lib/music_library_web/live/wishlist_live/show.html.heex:69
#: lib/music_library_web/live/record_live/show.html.heex:67
#: lib/music_library_web/live/wishlist_live/show.html.heex:68
#, elixir-autogen, elixir-format
msgid "Copy MusicBrainz ID to clipboard"
msgstr ""