Phoenix.HTML.Form、Phoenix.LiveView.Helpersにclassを任意の引数として指定する例をいくつか。
tailwind css、daisyUIをPhoenixアプリに追加したとき、classの指定のやり方が分からなかったので備忘録
結論:optsにclassを指定するとよい
Phoenix.HTML.Form.htmlやPhoenix.LiveView.Helpers.htmlで各フォームヘルパーの関数が紹介されています。
text_input(form, field, opts \ [])
であれば、optにあたる引数にclassを渡してあげればよいです。
以下、いくつか例を紹介していきます。
Phoenix.HTML.Form
text_input(form, field, opts \ [])
classを1つ指定する場合。
<%= text_input f, :display_name, class: "input") %>
classを複数渡す場合は文字列のリストで渡します。
他のフォームヘルパーも同様です。
<%= text_input f, :display_name, class: ~w(input input-bordered input-accent) %>
textarea(form, field, opts \ [])
<%= textarea f, :message, class: ~w(textarea textarea-accent w-10/12) %>
submit(value, opts \ [])
<%= submit "感想を投稿", class: ~w(btn btn-success) %>
Phoenix.LiveView.Helpers
live_patch(text, opts)
<%= live_patch "感想を投稿する", to: Routes.message_index_path(@socket, :new), class: ~w(btn btn-success) %>