update deps

2025-04-05 00:13:01 +00:00
parent 449a92e4b7
commit 37d101a71e
130 changed files with 1748 additions and 12180 deletions
--- a/lib/cannery_web/components/add_shot_record_component.html.heex
+++ b/lib/cannery_web/components/add_shot_record_component.html.heex
@ -1,6 +1,6 @@
 <div>
  <h2 class="mb-8 text-center title text-xl text-primary-600">
-    <%= gettext("Record shots") %>
+    {gettext("Record shots")}
  </h2>

  <.form
@ -16,47 +16,47 @@
      :if={@changeset.action && not @changeset.valid?}
      class="invalid-feedback col-span-3 text-center"
    >
-      <%= changeset_errors(@changeset) %>
+      {changeset_errors(@changeset)}
    </div>

-    <%= label(f, :ammo_left, gettext("Rounds left"), class: "title text-lg text-primary-600") %>
-    <%= number_input(f, :ammo_left,
+    {label(f, :ammo_left, gettext("Rounds left"), class: "title text-lg text-primary-600")}
+    {number_input(f, :ammo_left,
      min: 0,
      max: @pack.count - 1,
      placeholder: gettext("Rounds left"),
      class: "input input-primary"
-    ) %>
+    )}
    <button
      type="button"
      class="mx-2 my-1 text-sm btn btn-primary"
      phx-click={JS.dispatch("cannery:set-zero", to: "#shot-record-form_ammo_left")}
    >
-      <%= gettext("Used up!") %>
+      {gettext("Used up!")}
    </button>
-    <%= error_tag(f, :ammo_left, "col-span-3") %>
+    {error_tag(f, :ammo_left, "col-span-3")}

-    <%= label(f, :notes, gettext("Notes"), class: "title text-lg text-primary-600") %>
-    <%= textarea(f, :notes,
+    {label(f, :notes, gettext("Notes"), class: "title text-lg text-primary-600")}
+    {textarea(f, :notes,
      class: "input input-primary col-span-2",
      id: "add-shot-record-form-notes",
      maxlength: 255,
      phx_debounce: 300,
      phx_update: "ignore",
      placeholder: gettext("Really great weather")
-    ) %>
-    <%= error_tag(f, :notes, "col-span-3") %>
+    )}
+    {error_tag(f, :notes, "col-span-3")}

-    <%= label(f, :date, gettext("Date"), class: "title text-lg text-primary-600") %>
-    <%= date_input(f, :date,
+    {label(f, :date, gettext("Date"), class: "title text-lg text-primary-600")}
+    {date_input(f, :date,
      class: "input input-primary col-span-2",
      phx_update: "ignore",
      value: Date.utc_today()
-    ) %>
-    <%= error_tag(f, :notes, "col-span-3") %>
+    )}
+    {error_tag(f, :notes, "col-span-3")}

-    <%= submit(dgettext("actions", "Save"),
+    {submit(dgettext("actions", "Save"),
      class: "mx-auto btn btn-primary col-span-3",
      phx_disable_with: dgettext("prompts", "Saving...")
-    ) %>
+    )}
  </.form>
 </div>
--- a/lib/cannery_web/components/container_table_component.ex
+++ b/lib/cannery_web/components/container_table_component.ex
@ -135,7 +135,7 @@ defmodule CanneryWeb.Components.ContainerTableComponent do
     ~H"""
     <div class="flex flex-wrap justify-center items-center">
       <.link navigate={~p"/container/#{@id}"} class="link">
-         <%= @name %>
+         {@name}
       </.link>
     </div>
     """}
@ -154,7 +154,7 @@ defmodule CanneryWeb.Components.ContainerTableComponent do

    {staged,
     ~H"""
-     <%= render_slot(@range, @container) %>
+     {render_slot(@range, @container)}
     """}
  end

@ -172,7 +172,7 @@ defmodule CanneryWeb.Components.ContainerTableComponent do
     <div class="flex flex-wrap justify-center items-center">
       <.simple_tag_card :for={tag <- @container.tags} :if={@container.tags} tag={tag} />

-       <%= render_slot(@tag_actions, @container) %>
+       {render_slot(@tag_actions, @container)}
     </div>
     """}
  end
@ -181,7 +181,7 @@ defmodule CanneryWeb.Components.ContainerTableComponent do
    assigns = %{actions: actions, container: container}

    ~H"""
-    <%= render_slot(@actions, @container) %>
+    {render_slot(@actions, @container)}
    """
  end

--- a/lib/cannery_web/components/core_components/container_card.html.heex
+++ b/lib/cannery_web/components/core_components/container_card.html.heex
@ -2,40 +2,40 @@
  id={"container-#{@container.id}"}
  class="overflow-hidden max-w-full mx-4 mb-4 px-8 py-4
    flex flex-col justify-around items-center space-y-4
-    border border-gray-400 rounded-lg shadow-lg hover:shadow-md
+    border border-zinc-400 rounded-lg shadow-lg hover:shadow-md
    transition-all duration-300 ease-in-out"
 >
  <.link navigate={~p"/container/#{@container}"} class="link">
    <h1 class="px-4 py-2 rounded-lg title text-xl">
-      <%= @container.name %>
+      {@container.name}
    </h1>
  </.link>

  <div class="flex flex-col justify-center items-center space-y-2">
    <span :if={@container.desc} class="rounded-lg title text-lg">
-      <%= gettext("Description:") %>
-      <%= @container.desc %>
+      {gettext("Description:")}
+      {@container.desc}
    </span>

    <span class="rounded-lg title text-lg">
-      <%= gettext("Type:") %>
-      <%= @container.type %>
+      {gettext("Type:")}
+      {@container.type}
    </span>

    <span :if={@container.location} class="rounded-lg title text-lg">
-      <%= gettext("Location:") %>
-      <%= @container.location %>
+      {gettext("Location:")}
+      {@container.location}
    </span>

    <%= if Ammo.get_packs_count(@current_user, container_id: @container.id) != 0 do %>
      <span class="rounded-lg title text-lg">
-        <%= gettext("Packs:") %>
-        <%= Ammo.get_packs_count(@current_user, container_id: @container.id) %>
+        {gettext("Packs:")}
+        {Ammo.get_packs_count(@current_user, container_id: @container.id)}
      </span>

      <span class="rounded-lg title text-lg">
-        <%= gettext("Rounds:") %>
-        <%= Ammo.get_round_count(@current_user, container_id: @container.id) %>
+        {gettext("Rounds:")}
+        {Ammo.get_round_count(@current_user, container_id: @container.id)}
      </span>
    <% end %>

@ -45,7 +45,7 @@
    >
      <.simple_tag_card :for={tag <- @container.tags} tag={tag} />

-      <%= if @tag_actions, do: render_slot(@tag_actions) %>
+      {if @tag_actions, do: render_slot(@tag_actions)}
    </div>
  </div>

@ -53,6 +53,6 @@
    :if={assigns |> Map.has_key?(:inner_block)}
    class="flex space-x-4 justify-center items-center"
  >
-    <%= render_slot(@inner_block) %>
+    {render_slot(@inner_block)}
  </div>
 </div>
--- a/lib/cannery_web/components/core_components/date.html.heex
+++ b/lib/cannery_web/components/core_components/date.html.heex
@ -1,3 +1,3 @@
 <time :if={@date} id={@id} datetime={Date.to_iso8601(@date, :extended)} phx-hook="Date">
-  <%= Date.to_iso8601(@date, :extended) %>
+  {Date.to_iso8601(@date, :extended)}
 </time>
--- a/lib/cannery_web/components/core_components/date_range.html.heex
+++ b/lib/cannery_web/components/core_components/date_range.html.heex
@ -1,13 +1,13 @@
 <div class="flex items-center mx-4 my-2 space-x-1">
  <input
-    class="w-36 text-center input input-primary"
+    class="w-40 text-center input input-primary"
    name={"#{@name}_start"}
    type="date"
    value={@start_date}
  />
  <span>—</span>
  <input
-    class="w-36 text-center input input-primary"
+    class="w-40 text-center input input-primary"
    name={"#{@name}_end"}
    type="date"
    value={@end_date}
--- a/lib/cannery_web/components/core_components/datetime.html.heex
+++ b/lib/cannery_web/components/core_components/datetime.html.heex
@ -1,3 +1,3 @@
 <time :if={@datetime} id={@id} datetime={cast_datetime(@datetime)} phx-hook="DateTime">
-  <%= cast_datetime(@datetime) %>
+  {cast_datetime(@datetime)}
 </time>
--- a/lib/cannery_web/components/core_components/invite_card.html.heex
+++ b/lib/cannery_web/components/core_components/invite_card.html.heex
@ -1,24 +1,24 @@
 <div class="mx-4 my-2 px-8 py-4 flex flex-col justify-center items-center space-y-4
-  border border-gray-400 rounded-lg shadow-lg hover:shadow-md
+  border border-zinc-400 rounded-lg shadow-lg hover:shadow-md
  transition-all duration-300 ease-in-out">
  <h1 class="title text-xl">
-    <%= @invite.name %>
+    {@invite.name}
  </h1>

  <%= if @invite.disabled_at |> is_nil() do %>
    <h2 class="title text-md">
      <%= if @invite.uses_left do %>
-        <%= gettext(
+        {gettext(
          "Uses Left: %{uses_left_count}",
          uses_left_count: @invite.uses_left
-        ) %>
+        )}
      <% else %>
-        <%= gettext("Uses Left: Unlimited") %>
+        {gettext("Uses Left: Unlimited")}
      <% end %>
    </h2>
  <% else %>
    <h2 class="title text-md">
-      <%= gettext("Invite Disabled") %>
+      {gettext("Invite Disabled")}
    </h2>
  <% end %>

@ -28,19 +28,19 @@
  />

  <h2 :if={@use_count && @use_count != 0} class="title text-md">
-    <%= gettext("Uses: %{uses_count}", uses_count: @use_count) %>
+    {gettext("Uses: %{uses_count}", uses_count: @use_count)}
  </h2>

  <div class="flex flex-row flex-wrap justify-center items-center">
    <code
      id={"code-#{@invite.id}"}
-      class="mx-2 my-1 text-xs px-4 py-2 rounded-lg text-center break-all text-gray-100 bg-primary-800"
+      class="mx-2 my-1 text-xs px-4 py-2 rounded-lg text-center break-all text-zinc-100 bg-primary-800"
      phx-no-format
    ><%= url(CanneryWeb.Endpoint, ~p"/users/register?invite=#{@invite.token}") %></code>
-    <%= if @code_actions, do: render_slot(@code_actions) %>
+    {if @code_actions, do: render_slot(@code_actions)}
  </div>

  <div :if={@inner_block} class="flex space-x-4 justify-center items-center">
-    <%= render_slot(@inner_block) %>
+    {render_slot(@inner_block)}
  </div>
 </div>
--- a/lib/cannery_web/components/core_components/modal.html.heex
+++ b/lib/cannery_web/components/core_components/modal.html.heex
@ -29,7 +29,7 @@
      patch={@return_to}
      id="close"
      class="absolute top-8 right-10
-        text-gray-500 hover:text-gray-800
+        text-zinc-500 hover:text-zinc-800
        transition-all duration-500 ease-in-out"
      phx-remove={hide_modal()}
      aria-label={gettext("Close modal")}
@ -38,7 +38,7 @@
    </.link>

    <div class="overflow-x-hidden overflow-y-auto w-full p-8 flex flex-col space-y-4 justify-start items-center">
-      <%= render_slot(@inner_block) %>
+      {render_slot(@inner_block)}
    </div>
  </div>
 </div>
--- a/lib/cannery_web/components/core_components/pack_card.html.heex
+++ b/lib/cannery_web/components/core_components/pack_card.html.heex
@ -2,66 +2,66 @@
  id={"pack-#{@pack.id}"}
  class="mx-4 my-2 px-8 py-4
    flex flex-col justify-center items-center
-    border border-gray-400 rounded-lg shadow-lg hover:shadow-md
+    border border-zinc-400 rounded-lg shadow-lg hover:shadow-md
    transition-all duration-300 ease-in-out"
 >
  <.link navigate={~p"/ammo/show/#{@pack}"} class="mb-2 link">
    <h1 class="title text-xl title-primary-500">
-      <%= @pack.type.name %>
+      {@pack.type.name}
    </h1>
  </.link>

  <div class="flex flex-col justify-center items-center">
    <span class="rounded-lg title text-lg">
-      <%= gettext("Count:") %>
-      <%= if @pack.count == 0, do: gettext("Empty"), else: @pack.count %>
+      {gettext("Count:")}
+      {if @pack.count == 0, do: gettext("Empty"), else: @pack.count}
    </span>

    <span :if={@original_count && @original_count != @pack.count} class="rounded-lg title text-lg">
-      <%= gettext("Original Count:") %>
-      <%= @original_count %>
+      {gettext("Original Count:")}
+      {@original_count}
    </span>

    <span :if={@pack.notes} class="rounded-lg title text-lg">
-      <%= gettext("Notes:") %>
-      <%= @pack.notes %>
+      {gettext("Notes:")}
+      {@pack.notes}
    </span>

    <span :if={@pack.purchased_on} class="rounded-lg title text-lg">
-      <%= gettext("Purchased on:") %>
+      {gettext("Purchased on:")}
      <.date id={"#{@pack.id}-purchased-on"} date={@pack.purchased_on} />
    </span>

    <span :if={@last_used_date} class="rounded-lg title text-lg">
-      <%= gettext("Last used on:") %>
+      {gettext("Last used on:")}
      <.date id={"#{@pack.id}-last-used-on"} date={@last_used_date} />
    </span>

    <span :if={@pack.price_paid} class="rounded-lg title text-lg">
-      <%= gettext("Price paid:") %>
-      <%= gettext("$%{amount}", amount: display_currency(@pack.price_paid)) %>
+      {gettext("Price paid:")}
+      {gettext("$%{amount}", amount: display_currency(@pack.price_paid))}
    </span>

    <span :if={@cpr} class="rounded-lg title text-lg">
-      <%= gettext("CPR:") %>
-      <%= gettext("$%{amount}", amount: display_currency(@cpr)) %>
+      {gettext("CPR:")}
+      {gettext("$%{amount}", amount: display_currency(@cpr))}
    </span>

    <span :if={@pack.lot_number} class="rounded-lg title text-lg">
-      <%= gettext("Lot number:") %>
-      <%= @pack.lot_number %>
+      {gettext("Lot number:")}
+      {@pack.lot_number}
    </span>

    <span :if={@container} class="rounded-lg title text-lg">
-      <%= gettext("Container:") %>
+      {gettext("Container:")}

      <.link navigate={~p"/container/#{@container}"} class="link">
-        <%= @container.name %>
+        {@container.name}
      </.link>
    </span>
  </div>

  <div :if={@inner_block} class="mt-4 flex space-x-4 justify-center items-center">
-    <%= render_slot(@inner_block) %>
+    {render_slot(@inner_block)}
  </div>
 </div>
--- a/lib/cannery_web/components/core_components/simple_tag_card.html.heex
+++ b/lib/cannery_web/components/core_components/simple_tag_card.html.heex
@ -2,5 +2,5 @@
  class="inline-block break-all mx-2 my-1 px-4 py-2 rounded-lg title text-xl"
  style={"color: #{@tag.text_color}; background-color: #{@tag.bg_color}"}
 >
-  <%= @tag.name %>
+  {@tag.name}
 </h1>
--- a/lib/cannery_web/components/core_components/tag_card.html.heex
+++ b/lib/cannery_web/components/core_components/tag_card.html.heex
@ -1,9 +1,9 @@
 <div
  id={"tag-#{@tag.id}"}
  class="mx-4 mb-4 px-8 py-4 space-x-4 flex justify-center items-center
-    border border-gray-400 rounded-lg shadow-lg hover:shadow-md
+    border border-zinc-400 rounded-lg shadow-lg hover:shadow-md
    transition-all duration-300 ease-in-out"
 >
  <.simple_tag_card tag={@tag} />
-  <%= render_slot(@inner_block) %>
+  {render_slot(@inner_block)}
 </div>
--- a/lib/cannery_web/components/core_components/toggle_button.html.heex
+++ b/lib/cannery_web/components/core_components/toggle_button.html.heex
@ -1,4 +1,4 @@
-<label for={@id || @action} class="relative inline-flex items-center cursor-pointer">
+<label for={@id || @action} class="inline-flex relative items-center cursor-pointer">
  <input
    id={@id || @action}
    type="checkbox"
@ -12,19 +12,17 @@
        else: %{"phx-click": @action, "phx-value-value": @value}
    }
  />
-  <div class="w-11 h-6 bg-gray-300 rounded-full peer
-    peer-focus:ring-4 peer-focus:ring-teal-300 dark:peer-focus:ring-teal-800
-    peer-checked:bg-gray-600
-    peer-checked:after:translate-x-full peer-checked:after:border-white
-    after:content-[''] after:absolute after:top-1 after:left-[2px] after:bg-white after:border-gray-300
+  <div class="w-11 h-6 bg-zinc-300 rounded-full peer
+    peer-checked:bg-zinc-600 peer-checked:after:translate-x-full peer-checked:after:border-white
+    after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-zinc-300
    after:border after:rounded-full after:h-5 after:w-5
    after:transition-all after:duration-250 after:ease-in-out
    transition-colors duration-250 ease-in-out">
  </div>
  <span
    id={"#{@id || @action}-label"}
-    class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300 whitespace-nowrap"
+    class="ml-3 text-sm font-medium whitespace-nowrap text-zinc-900 dark:text-zinc-300"
  >
-    <%= render_slot(@inner_block) %>
+    {render_slot(@inner_block)}
  </span>
 </label>
--- a/lib/cannery_web/components/core_components/topbar.html.heex
+++ b/lib/cannery_web/components/core_components/topbar.html.heex
@ -14,7 +14,7 @@
        <span class="mx-2 my-1">
          |
        </span>
-        <%= @title_content %>
+        {@title_content}
      <% end %>
    </div>

@ -25,37 +25,37 @@
      <%= if @current_user do %>
        <li class="mx-2 my-1">
          <.link navigate={~p"/tags"} class="text-white hover:underline">
-            <%= gettext("Tags") %>
+            {gettext("Tags")}
          </.link>
        </li>
        <li class="mx-2 my-1">
          <.link navigate={~p"/containers"} class="text-white hover:underline">
-            <%= gettext("Containers") %>
+            {gettext("Containers")}
          </.link>
        </li>
        <li class="mx-2 my-1">
          <.link navigate={~p"/catalog"} class="text-white hover:underline">
-            <%= gettext("Catalog") %>
+            {gettext("Catalog")}
          </.link>
        </li>
        <li class="mx-2 my-1">
          <.link navigate={~p"/ammo"} class="text-white hover:underline">
-            <%= gettext("Ammo") %>
+            {gettext("Ammo")}
          </.link>
        </li>
        <li class="mx-2 my-1">
          <.link navigate={~p"/range"} class="text-white hover:underline">
-            <%= gettext("Range") %>
+            {gettext("Range")}
          </.link>
        </li>
        <li :if={@current_user |> Accounts.already_admin?()} class="mx-2 my-1">
          <.link navigate={~p"/invites"} class="text-white hover:underline">
-            <%= gettext("Invites") %>
+            {gettext("Invites")}
          </.link>
        </li>
        <li class="mx-2 my-1">
          <.link href={~p"/users/settings"} class="text-white hover:underline truncate">
-            <%= @current_user.email %>
+            {@current_user.email}
          </.link>
        </li>
        <li class="mx-2 my-1">
@ -86,12 +86,12 @@
      <% else %>
        <li :if={Accounts.allow_registration?()} class="mx-2 my-1">
          <.link href={~p"/users/register"} class="text-white hover:underline truncate">
-            <%= dgettext("actions", "Register") %>
+            {dgettext("actions", "Register")}
          </.link>
        </li>
        <li class="mx-2 my-1">
          <.link href={~p"/users/log_in"} class="text-white hover:underline truncate">
-            <%= dgettext("actions", "Log in") %>
+            {dgettext("actions", "Log in")}
          </.link>
        </li>
      <% end %>
--- a/lib/cannery_web/components/core_components/user_card.html.heex
+++ b/lib/cannery_web/components/core_components/user_card.html.heex
@ -1,36 +1,36 @@
 <div
  id={"user-#{@user.id}"}
  class="mx-4 my-2 px-8 py-4 flex flex-col justify-center items-center text-center
-    border border-gray-400 rounded-lg shadow-lg hover:shadow-md
+    border border-zinc-400 rounded-lg shadow-lg hover:shadow-md
    transition-all duration-300 ease-in-out"
 >
  <h1 class="px-4 py-2 rounded-lg title text-xl break-all">
-    <%= @user.email %>
+    {@user.email}
  </h1>

  <h3 class="px-4 py-2 rounded-lg title text-lg">
    <p>
      <%= if @user.confirmed_at do %>
-        <%= gettext(
+        {gettext(
          "User was confirmed at%{confirmed_datetime}",
          confirmed_datetime: ""
-        ) %>
+        )}
        <.datetime id={"#{@user.id}-confirmed-at"} datetime={@user.confirmed_at} />
      <% else %>
-        <%= gettext("Email unconfirmed") %>
+        {gettext("Email unconfirmed")}
      <% end %>
    </p>

    <p>
-      <%= gettext(
+      {gettext(
        "User registered on%{registered_datetime}",
        registered_datetime: ""
-      ) %>
+      )}
      <.datetime id={"#{@user.id}-inserted-at"} datetime={@user.inserted_at} />
    </p>
  </h3>

  <div :if={@inner_block} class="px-4 py-2 flex space-x-4 justify-center items-center">
-    <%= render_slot(@inner_block) %>
+    {render_slot(@inner_block)}
  </div>
 </div>
--- a/lib/cannery_web/components/email_html/confirm_email.html.heex
+++ b/lib/cannery_web/components/email_html/confirm_email.html.heex
@ -1,23 +1,23 @@
 <div style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
  <span style="margin-bottom: 0.75em; font-size: 1.5em;">
-    <%= dgettext("emails", "Hi %{email},", email: @user.email) %>
+    {dgettext("emails", "Hi %{email},", email: @user.email)}
  </span>

  <br />

  <span style="margin-bottom: 1em; font-size: 1.25em;">
-    <%= dgettext("emails", "Welcome to Cannery") %>
+    {dgettext("emails", "Welcome to Cannery")}
  </span>

  <br />

-  <%= dgettext("emails", "You can confirm your account by visiting the URL below:") %>
+  {dgettext("emails", "You can confirm your account by visiting the URL below:")}

  <br />

-  <a style="margin: 1em; color: rgb(31, 31, 31);" href={@url}><%= @url %></a>
+  <a style="margin: 1em; color: rgb(31, 31, 31);" href={@url}>{@url}</a>

  <br />

-  <%= dgettext("emails", "If you didn't create an account at Cannery, please ignore this.") %>
+  {dgettext("emails", "If you didn't create an account at Cannery, please ignore this.")}
 </div>
--- a/lib/cannery_web/components/email_html/reset_password.html.heex
+++ b/lib/cannery_web/components/email_html/reset_password.html.heex
@ -1,17 +1,17 @@
 <div style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
  <span style="margin-bottom: 0.5em; font-size: 1.5em;">
-    <%= dgettext("emails", "Hi %{email},", email: @user.email) %>
+    {dgettext("emails", "Hi %{email},", email: @user.email)}
  </span>

  <br />

-  <%= dgettext("emails", "You can reset your password by visiting the URL below:") %>
+  {dgettext("emails", "You can reset your password by visiting the URL below:")}

  <br />

-  <a style="margin: 1em; color: rgb(31, 31, 31);" href={@url}><%= @url %></a>
+  <a style="margin: 1em; color: rgb(31, 31, 31);" href={@url}>{@url}</a>

  <br />

-  <%= dgettext("emails", "If you didn't request this change from Cannery, please ignore this.") %>
+  {dgettext("emails", "If you didn't request this change from Cannery, please ignore this.")}
 </div>
--- a/lib/cannery_web/components/email_html/update_email.html.heex
+++ b/lib/cannery_web/components/email_html/update_email.html.heex
@ -1,20 +1,20 @@
 <div style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
  <span style="margin-bottom: 0.5em; font-size: 1.5em;">
-    <%= dgettext("emails", "Hi %{email},", email: @user.email) %>
+    {dgettext("emails", "Hi %{email},", email: @user.email)}
  </span>

  <br />

-  <%= dgettext("emails", "You can change your email by visiting the URL below:") %>
+  {dgettext("emails", "You can change your email by visiting the URL below:")}

  <br />

-  <a style="margin: 1em; color: rgb(31, 31, 31);" href={@url}><%= @url %></a>
+  <a style="margin: 1em; color: rgb(31, 31, 31);" href={@url}>{@url}</a>

  <br />

-  <%= dgettext(
+  {dgettext(
    "emails",
    "If you didn't request this change from Cannery, please ignore this."
-  ) %>
+  )}
 </div>
--- a/lib/cannery_web/components/layouts/app.html.heex
+++ b/lib/cannery_web/components/layouts/app.html.heex
@ -10,7 +10,7 @@
        phx-click="lv:clear-flash"
        phx-value-key="info"
      >
-        <%= Phoenix.Flash.get(@flash, :info) %>
+        {Phoenix.Flash.get(@flash, :info)}
      </p>

      <p
@ -20,13 +20,13 @@
        phx-click="lv:clear-flash"
        phx-value-key="error"
      >
-        <%= Phoenix.Flash.get(@flash, :error) %>
+        {Phoenix.Flash.get(@flash, :error)}
      </p>
    </div>
  </header>

  <div class="mx-4 sm:mx-8 md:mx-16 flex flex-col justify-center items-stretch">
-    <%= @inner_content %>
+    {@inner_content}
  </div>
 </main>

@ -40,6 +40,6 @@
  <i class="fas fa-fade text-md fa-satellite-dish"></i>

  <h1 class="title text-md title-primary-500">
-    <%= gettext("Reconnecting...") %>
+    {gettext("Reconnecting...")}
  </h1>
 </div>
--- a/lib/cannery_web/components/layouts/email_html.html.heex
+++ b/lib/cannery_web/components/layouts/email_html.html.heex
@ -1,19 +1,19 @@
 <html>
  <head>
    <title>
-      <%= @email.subject %>
+      {@email.subject}
    </title>
  </head>
  <body style="padding: 2em; color: rgb(31, 31, 31); background-color: rgb(220, 220, 228); font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; text-align: center;">
-    <%= @inner_content %>
+    {@inner_content}

    <hr style="margin: 2em auto; border-width: 1px; border-color: rgb(212, 212, 216); width: 100%; max-width: 42rem;" />

    <a style="color: rgb(31, 31, 31);" href={~p"/"}>
-      <%= dgettext(
+      {dgettext(
        "emails",
        "This email was sent from Cannery, the self-hosted firearm tracker website."
-      ) %>
+      )}
    </a>
  </body>
 </html>
--- a/lib/cannery_web/components/layouts/empty.html.heex
+++ b/lib/cannery_web/components/layouts/empty.html.heex
@ -1 +1 @@
-<%= @inner_block %>
+{@inner_block}
--- a/lib/cannery_web/components/layouts/root.html.heex
+++ b/lib/cannery_web/components/layouts/root.html.heex
@ -1,20 +1,19 @@
 <!DOCTYPE html>
-<html lang="en" class="m-0 p-0 w-full h-full bg-white">
+<html lang="en" class="p-0 m-0 w-full h-full bg-white [scrollbar-gutter:stable]">
  <head>
    <meta charset="utf-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <%= csrf_meta_tag() %>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="csrf-token" content={get_csrf_token()} />
    <link rel="shortcut icon" type="image/jpg" href={~p"/images/cannery.svg"} />
    <.live_title suffix={" | #{gettext("Cannery")}"}>
-      <%= assigns[:page_title] || gettext("Cannery") %>
+      {assigns[:page_title] || gettext("Cannery")}
    </.live_title>
-    <link phx-track-static rel="stylesheet" href={~p"/css/app.css"} />
-    <script defer phx-track-static type="text/javascript" src={~p"/js/app.js"}>
+    <link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />
+    <script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
    </script>
  </head>

-  <body class="m-0 p-0 w-full h-full subpixel-antialiased">
-    <%= @inner_content %>
+  <body class="p-0 m-0 w-full h-full subpixel-antialiased">
+    {@inner_content}
  </body>
 </html>
--- a/lib/cannery_web/components/move_pack_component.ex
+++ b/lib/cannery_web/components/move_pack_component.ex
@ -74,17 +74,17 @@ defmodule CanneryWeb.Components.MovePackComponent do
    ~H"""
    <div class="w-full flex flex-col space-y-8 justify-center items-center">
      <h2 class="mb-8 text-center title text-xl text-primary-600">
-        <%= dgettext("actions", "Move ammo") %>
+        {dgettext("actions", "Move ammo")}
      </h2>

      <%= if @containers |> Enum.empty?() do %>
        <h2 class="title text-xl text-primary-600">
-          <%= gettext("No other containers") %>
-          <%= display_emoji("😔") %>
+          {gettext("No other containers")}
+          {display_emoji("😔")}
        </h2>

        <.link navigate={~p"/containers/new"} class="btn btn-primary">
-          <%= dgettext("actions", "Add another container!") %>
+          {dgettext("actions", "Add another container!")}
        </.link>
      <% else %>
        <.live_component
@ -120,7 +120,7 @@ defmodule CanneryWeb.Components.MovePackComponent do
        phx-target={@myself}
        phx-value-container_id={@container.id}
      >
-        <%= dgettext("actions", "Select") %>
+        {dgettext("actions", "Select")}
      </button>
    </div>
    """
--- a/lib/cannery_web/components/pack_table_component.ex
+++ b/lib/cannery_web/components/pack_table_component.ex
@ -170,7 +170,7 @@ defmodule CanneryWeb.Components.PackTableComponent do

    {type_name,
     ~H"""
-     <%= render_slot(@type_block, @type) %>
+     {render_slot(@type_block, @type)}
     """}
  end

@ -196,7 +196,7 @@ defmodule CanneryWeb.Components.PackTableComponent do
     <%= if @last_used_date do %>
       <.date id={"#{@id}-last-used-date"} date={@last_used_date} />
     <% else %>
-       <%= gettext("Never used") %>
+       {gettext("Never used")}
     <% end %>
     """}
  end
@ -205,7 +205,7 @@ defmodule CanneryWeb.Components.PackTableComponent do
    assigns = %{range: range, pack: pack}

    ~H"""
-    <%= render_slot(@range, @pack) %>
+    {render_slot(@range, @pack)}
    """
  end

@ -222,7 +222,7 @@ defmodule CanneryWeb.Components.PackTableComponent do
    assigns = %{actions: actions, pack: pack}

    ~H"""
-    <%= render_slot(@actions, @pack) %>
+    {render_slot(@actions, @pack)}
    """
  end

@ -243,7 +243,7 @@ defmodule CanneryWeb.Components.PackTableComponent do

    {container_name,
     ~H"""
-     <%= render_slot(@container_block, {@pack, @container}) %>
+     {render_slot(@container_block, {@pack, @container})}
     """}
  end

--- a/lib/cannery_web/components/shot_record_table_component.ex
+++ b/lib/cannery_web/components/shot_record_table_component.ex
@ -99,7 +99,7 @@ defmodule CanneryWeb.Components.ShotRecordTableComponent do
    {pack.type.name,
     ~H"""
     <.link navigate={~p"/ammo/show/#{@pack}"} class="link">
-       <%= @pack.type.name %>
+       {@pack.type.name}
     </.link>
     """}
  end
@ -115,7 +115,7 @@ defmodule CanneryWeb.Components.ShotRecordTableComponent do
    assigns = %{actions: actions, shot_record: shot_record}

    ~H"""
-    <%= render_slot(@actions, @shot_record) %>
+    {render_slot(@actions, @shot_record)}
    """
  end

--- a/lib/cannery_web/components/table_component.ex
+++ b/lib/cannery_web/components/table_component.ex
@ -76,7 +76,7 @@ defmodule CanneryWeb.Components.TableComponent do
        sort_mode: initial_sort_mode
      )
      |> assign_new(:row_class, fn -> "bg-white" end)
-      |> assign_new(:alternate_row_class, fn -> "bg-gray-200" end)
+      |> assign_new(:alternate_row_class, fn -> "bg-zinc-200" end)

    {:ok, socket}
  end
--- a/lib/cannery_web/components/table_component.html.heex
+++ b/lib/cannery_web/components/table_component.html.heex
@ -1,4 +1,4 @@
-<div id={@id} class="w-full overflow-x-auto border border-gray-600 rounded-lg shadow-lg bg-white">
+<div id={@id} class="w-full overflow-x-auto border border-zinc-600 rounded-lg shadow-lg bg-white">
  <table class="min-w-full table-auto text-center bg-white">
    <thead class="border-b border-primary-600">
      <tr>
@ -12,7 +12,7 @@
                phx-target={@myself}
              >
                <i class="w-0 float-right fas fa-sm fa-chevron-up opacity-0"></i>
-                <span class={if @last_sort_key == key, do: "underline"}><%= label %></span>
+                <span class={if @last_sort_key == key, do: "underline"}>{label}</span>
                <%= if @last_sort_key == key do %>
                  <%= case @sort_mode do %>
                    <% :asc -> %>
@ -27,7 +27,7 @@
            </th>
          <% else %>
            <th class={["p-2 cursor-not-allowed", column[:class]]}>
-              <%= label %>
+              {label}
            </th>
          <% end %>
        <% end %>
@ -41,9 +41,9 @@
        <td :for={%{key: key} = value <- @columns} class={["p-2", value[:class]]}>
          <%= case values |> Map.get(key) do %>
            <% {_custom_sort_value, value} -> %>
-              <%= value %>
+              {value}
            <% value -> %>
-              <%= value %>
+              {value}
          <% end %>
        </td>
      </tr>
--- a/lib/cannery_web/components/type_table_component.ex
+++ b/lib/cannery_web/components/type_table_component.ex
@ -278,7 +278,7 @@ defmodule CanneryWeb.Components.TypeTableComponent do
    {type_name,
     ~H"""
     <.link navigate={~p"/type/#{@id}"} class="link">
-       <%= @name %>
+       {@name}
     </.link>
     """}
  end
@ -287,7 +287,7 @@ defmodule CanneryWeb.Components.TypeTableComponent do
    assigns = %{actions: actions, type: type}

    ~H"""
-    <%= render_slot(@actions, @type) %>
+    {render_slot(@actions, @type)}
    """
  end