リハビリアプリを作ろう（その６）

こちらの続きです

1-25の数字押していくゲームを作りたいです
このコラムの範囲

• スタート
• 不要なヘッダを削除

スタートを追加

自身をリロードで時間をリセットする

lib/num_web/live/user_live/index.html.heex

  <div  class="w-28 h-28 m-2 bg-red-200 text-center">
  <p class="pt-7 text-5xl text-red-700 "><%= @question %></p>
  </div>
+ /<.link href="/users" class="pt-7 text-5xl ">スタート</.link>
  <p class="pt-7 text-5xl text-red-700 "><%= @time %></p>
  <br>
  <%= for {s, i} <- Enum.with_index(@num, 1) do %>
    <%= if Enum.find_index(@ok_num, fn x -> Integer.to_string(s) == x end) == nil do %>
      <div phx-click="buttno" phx-value-no={s}  class="float-left w-28 h-28 m-2 bg-blue-200 text-center ">
        <p class="pt-7 text-5xl text-blue-700 "><%= s %></p>
    <  /div>
    <% else %>
      <div  class="float-left w-28 h-28 m-2 bg-blue-100 text-center ">
      </div>
    <% end %>
    <%= if rem(i, 5) == 0 do  %>
      <br>
    <% end %>
  <% end %>

不要なヘッダーを削除

lib/num_web/components/layouts/app.html.heex

<main class="px-4 py-20 sm:px-6 lg:px-8">
  <div class="mx-auto max-w-2xl">
    <.flash_group flash={@flash} />
    <%= @inner_content %>
  </div>
</main>

現時点結果

これで完成

ソース
https://github.com/t-yamanashi/num25