feat: add dark mode

lib/exmr_web/components/core_components.ex

@@ -202,9 +202,12 @@ defmodule ExmrWeb.CoreComponents do
   def simple_form(assigns) do
     ~H"""
     <.form :let={f} for={@for} as={@as} {@rest}>
-      <div class="mt-10 space-y-8 bg-white">
+      <div class="mt-10 space-y-8 bg-white dark:bg-zinc-950">
         <%= render_slot(@inner_block, f) %>
-        <div :for={action <- @actions} class="mt-2 flex items-center justify-between gap-6">
+        <div
+          :for={action <- @actions}
+          class="mt-2 flex items-center justify-between gap-6 dark:text-zinc-100"
+        >
           <%= render_slot(action, f) %>
         </div>
       </div>
@@ -310,7 +313,7 @@ defmodule ExmrWeb.CoreComponents do
 
     ~H"""
     <div>
-      <label class="flex items-center gap-4 text-sm leading-6 text-zinc-600">
+      <label class="flex items-center gap-4 text-sm leading-6 text-zinc-600 dark:text-zinc-200">
         <input type="hidden" name={@name} value="false" disabled={@rest[:disabled]} />
         <input
           type="checkbox"
@@ -396,7 +399,7 @@ defmodule ExmrWeb.CoreComponents do
 
   def label(assigns) do
     ~H"""
-    <label for={@for} class="block text-sm font-semibold leading-6 text-zinc-800">
+    <label for={@for} class="block text-sm font-semibold leading-6 text-zinc-800 dark:text-zinc-200">
       <%= render_slot(@inner_block) %>
     </label>
     """

lib/exmr_web/live/user_forgot_password_live.ex

@@ -14,7 +14,7 @@ defmodule ExmrWeb.UserForgotPasswordLive do
       <.simple_form for={@form} id="reset_password_form" phx-submit="send_email">
         <.input field={@form[:email]} type="email" placeholder="Email" required />
         <:actions>
-          <.button phx-disable-with="Sending..." class="w-full">
+          <.button phx-disable-with="Sending..." class="w-full dark:text-black dark:bg-red-600">
             Send password reset instructions
           </.button>
         </:actions>

lib/exmr_web/live/user_login_live.ex

@@ -26,7 +26,7 @@ defmodule ExmrWeb.UserLoginLive do
           </.link>
         </:actions>
         <:actions>
-          <.button phx-disable-with="Logging in..." class="w-full">
+          <.button phx-disable-with="Logging in..." class="w-full dark:bg-teal-600">
             Log in <span aria-hidden="true">→</span>
           </.button>
         </:actions>

lib/exmr_web/live/user_registration_live.ex

@@ -6,7 +6,7 @@ defmodule ExmrWeb.UserRegistrationLive do
 
   def render(assigns) do
     ~H"""
-    <div class="mx-auto max-w-sm">
+    <div class="mx-auto max-w-sm dark:bg-zinc-950">
       <.header class="text-center">
         Register for an account
         <:subtitle>
@@ -35,7 +35,9 @@ defmodule ExmrWeb.UserRegistrationLive do
         <.input field={@form[:password]} type="password" label="Password" required />
 
         <:actions>
-          <.button phx-disable-with="Creating account..." class="w-full">Create an account</.button>
+          <.button phx-disable-with="Creating account..." class="w-full dark:bg-green-800">
+            Create an account
+          </.button>
         </:actions>
       </.simple_form>
     </div>