jamey/berrypod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

replace orphaned tailwind classes with project CSS
All checks were successful
deploy / deploy (push) Successful in 1m27s
Details

Browse Source 
auth pages (login, registration, confirmation, recover) now use
setup-page/setup-header/admin-btn-block. theme toggle indicator
gets proper CSS. cleaned up dead h-full, size-3.5, ml-2 classes.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
jamey 2026-03-04 17:12:21 +00:00
parent 7547d0d4b8
commit dd659e4c61
11 changed files with 58 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
lib/berrypod_web/components/block_editor_components.ex
View File

@ -324,7 +324,7 @@ defmodule BerrypodWeb.BlockEditorComponents do
aria-label={"Move item #{idx + 1} up"} aria-label={"Move item #{idx + 1} up"}
disabled={idx == 0} disabled={idx == 0}
> >
<.icon name="hero-chevron-up-mini" class="size-3.5" /> <.icon name="hero-chevron-up-mini" class="size-4" />
</button> </button>
<button <button
type="button" type="button"
@ -337,7 +337,7 @@ defmodule BerrypodWeb.BlockEditorComponents do
aria-label={"Move item #{idx + 1} down"} aria-label={"Move item #{idx + 1} down"}
disabled={idx == @item_count - 1} disabled={idx == @item_count - 1}
> >
<.icon name="hero-chevron-down-mini" class="size-3.5" /> <.icon name="hero-chevron-down-mini" class="size-4" />
</button> </button>
<button <button
type="button" type="button"
@ -348,7 +348,7 @@ defmodule BerrypodWeb.BlockEditorComponents do
class="admin-btn admin-btn-ghost admin-btn-icon admin-btn-xs repeater-remove-btn" class="admin-btn admin-btn-ghost admin-btn-icon admin-btn-xs repeater-remove-btn"
aria-label={"Remove item #{idx + 1}"} aria-label={"Remove item #{idx + 1}"}
> >
<.icon name="hero-x-mark-mini" class="size-3.5" /> <.icon name="hero-x-mark-mini" class="size-4" />
</button> </button>
</div> </div>
</fieldset> </fieldset>
@ -362,7 +362,7 @@ defmodule BerrypodWeb.BlockEditorComponents do
phx-value-field={@field.key} phx-value-field={@field.key}
class="admin-btn admin-btn-outline admin-btn-xs repeater-add-btn" class="admin-btn admin-btn-outline admin-btn-xs repeater-add-btn"
> >
<.icon name="hero-plus-mini" class="size-3.5" /> Add item <.icon name="hero-plus-mini" class="size-4" /> Add item
</button> </button>
</div> </div>
""" """

8
lib/berrypod_web/components/layouts.ex
View File

@ -109,14 +109,14 @@ defmodule BerrypodWeb.Layouts do
def theme_toggle(assigns) do def theme_toggle(assigns) do
~H""" ~H"""
<div class="theme-toggle"> <div class="theme-toggle">
<div class="theme-toggle-indicator absolute w-1/3 h-full rounded-full border-1 border-base-200 bg-base-100 brightness-200 left-0" /> <div class="theme-toggle-indicator" />
<button <button
class="theme-toggle-btn" class="theme-toggle-btn"
phx-click={JS.dispatch("phx:set-theme")} phx-click={JS.dispatch("phx:set-theme")}
data-phx-theme="system" data-phx-theme="system"
> >
<.icon name="hero-computer-desktop-micro" class="size-4 opacity-75 hover:opacity-100" /> <.icon name="hero-computer-desktop-micro" class="size-4" />
</button> </button>
<button <button
@ -124,7 +124,7 @@ defmodule BerrypodWeb.Layouts do
phx-click={JS.dispatch("phx:set-theme")} phx-click={JS.dispatch("phx:set-theme")}
data-phx-theme="light" data-phx-theme="light"
> >
<.icon name="hero-sun-micro" class="size-4 opacity-75 hover:opacity-100" /> <.icon name="hero-sun-micro" class="size-4" />
</button> </button>
<button <button
@ -132,7 +132,7 @@ defmodule BerrypodWeb.Layouts do
phx-click={JS.dispatch("phx:set-theme")} phx-click={JS.dispatch("phx:set-theme")}
data-phx-theme="dark" data-phx-theme="dark"
> >
<.icon name="hero-moon-micro" class="size-4 opacity-75 hover:opacity-100" /> <.icon name="hero-moon-micro" class="size-4" />
</button> </button>
</div> </div>
""" """

4
lib/berrypod_web/components/layouts/admin_root.html.heex
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" class="h-full"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
@ -28,7 +28,7 @@
<script defer phx-track-static src={~p"/assets/js/app.js"}> <script defer phx-track-static src={~p"/assets/js/app.js"}>
</script> </script>
</head> </head>
<body class="h-full"> <body>
<div class="themed" data-mood={@theme_settings.mood} style="min-height:100%"> <div class="themed" data-mood={@theme_settings.mood} style="min-height:100%">
{@inner_content} {@inner_content}
</div> </div>

4
lib/berrypod_web/components/layouts/root.html.heex
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" class="h-full"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
@ -27,7 +27,7 @@
<script defer phx-track-static src={~p"/assets/js/app.js"}> <script defer phx-track-static src={~p"/assets/js/app.js"}>
</script> </script>
</head> </head>
<body class="h-full"> <body>
<div class="themed" data-mood={@theme_settings.mood} style="min-height:100%"> <div class="themed" data-mood={@theme_settings.mood} style="min-height:100%">
{@inner_content} {@inner_content}
</div> </div>

2
lib/berrypod_web/components/shop_components/content.ex
View File

@ -928,12 +928,10 @@ defmodule BerrypodWeb.ShopComponents.Content do
## Attributes ## Attributes
* `text` - Required. The title text. * `text` - Required. The title text.
* `class` - Optional. Additional CSS classes.
## Examples ## Examples
<.page_title text="Your basket" /> <.page_title text="Your basket" />
<.page_title text="Order History" class="mb-4" />
""" """
attr :text, :string, required: true attr :text, :string, required: true

6
lib/berrypod_web/controllers/error_html.ex
View File

@ -111,7 +111,7 @@ defmodule BerrypodWeb.ErrorHTML do
~H""" ~H"""
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" class="h-full"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
@ -121,9 +121,9 @@ defmodule BerrypodWeb.ErrorHTML do
<%= Phoenix.HTML.raw(@generated_css) %> <%= Phoenix.HTML.raw(@generated_css) %>
</style> </style>
</head> </head>
<body class="h-full"> <body>
<div <div
class="shop-root themed h-full" class="shop-root themed"
data-mood={@theme_settings.mood} data-mood={@theme_settings.mood}
data-typography={@theme_settings.typography} data-typography={@theme_settings.typography}
data-shape={@theme_settings.shape} data-shape={@theme_settings.shape}

2
lib/berrypod_web/live/admin/pages/index.ex
View File

@ -109,7 +109,7 @@ defmodule BerrypodWeb.Admin.Pages.Index do
<span class="page-card-info"> <span class="page-card-info">
<span class="page-card-title"> <span class="page-card-title">
{page.title} {page.title}
<span :if={!page.published} class="admin-badge admin-badge-warning ml-2"> <span :if={!page.published} class="admin-badge admin-badge-warning ml-1">
Draft Draft
</span> </span>
</span> </span>

18
lib/berrypod_web/live/auth/confirmation.ex
View File

@ -7,8 +7,8 @@ defmodule BerrypodWeb.Auth.Confirmation do
def render(assigns) do def render(assigns) do
~H""" ~H"""
<Layouts.app flash={@flash} current_scope={@current_scope}> <Layouts.app flash={@flash} current_scope={@current_scope}>
<div class="mx-auto max-w-sm"> <div class="setup-page">
<div class="text-center"> <div class="setup-header">
<.header>Welcome {@user.email}</.header> <.header>Welcome {@user.email}</.header>
</div> </div>
@ -27,11 +27,11 @@ defmodule BerrypodWeb.Auth.Confirmation do
value="true" value="true"
phx-disable-with="Confirming..." phx-disable-with="Confirming..."
variant="primary" variant="primary"
class="w-full" class="admin-btn-block"
> >
Confirm and stay logged in Confirm and stay logged in
</.button> </.button>
<.button phx-disable-with="Confirming..." class="w-full mt-2"> <.button phx-disable-with="Confirming..." class="admin-btn-block">
Confirm and log in only this time Confirm and log in only this time
</.button> </.button>
</.form> </.form>
@ -47,7 +47,7 @@ defmodule BerrypodWeb.Auth.Confirmation do
> >
<input type="hidden" name={@form[:token].name} value={@form[:token].value} /> <input type="hidden" name={@form[:token].name} value={@form[:token].value} />
<%= if @current_scope do %> <%= if @current_scope do %>
<.button phx-disable-with="Logging in..." variant="primary" class="w-full"> <.button phx-disable-with="Logging in..." variant="primary" class="admin-btn-block">
Log in Log in
</.button> </.button>
<% else %> <% else %>
@ -56,19 +56,19 @@ defmodule BerrypodWeb.Auth.Confirmation do
value="true" value="true"
phx-disable-with="Logging in..." phx-disable-with="Logging in..."
variant="primary" variant="primary"
class="w-full" class="admin-btn-block"
> >
Keep me logged in on this device Keep me logged in on this device
</.button> </.button>
<.button phx-disable-with="Logging in..." class="w-full mt-2"> <.button phx-disable-with="Logging in..." class="admin-btn-block">
Log me in only this time Log me in only this time
</.button> </.button>
<% end %> <% end %>
</.form> </.form>
<p :if={!@user.confirmed_at} class="admin-alert admin-alert-outline mt-8"> <div :if={!@user.confirmed_at} class="admin-alert admin-alert-outline">
Tip: If you prefer passwords, you can enable them in the user settings. Tip: If you prefer passwords, you can enable them in the user settings.
</p> </div>
</div> </div>
</Layouts.app> </Layouts.app>
""" """

27
lib/berrypod_web/live/auth/login.ex
View File

@ -7,10 +7,10 @@ defmodule BerrypodWeb.Auth.Login do
def render(assigns) do def render(assigns) do
~H""" ~H"""
<Layouts.app flash={@flash} current_scope={@current_scope}> <Layouts.app flash={@flash} current_scope={@current_scope}>
<div class="mx-auto max-w-sm flex flex-col gap-4"> <div class="setup-page">
<div class="text-center"> <div class="setup-header">
<.header> <.header>
<p>Log in</p> Log in
<:subtitle> <:subtitle>
<%= if @current_scope do %> <%= if @current_scope do %>
You need to reauthenticate to perform sensitive actions on your account. You need to reauthenticate to perform sensitive actions on your account.
@ -26,7 +26,7 @@ defmodule BerrypodWeb.Auth.Login do
<div> <div>
<p>You are running the local mail adapter.</p> <p>You are running the local mail adapter.</p>
<p> <p>
To see sent emails, visit <.link href="/dev/mailbox" class="underline">the mailbox page</.link>. To see sent emails, visit <.link href="/dev/mailbox" class="admin-link">the mailbox page</.link>.
</p> </p>
</div> </div>
</div> </div>
@ -48,8 +48,8 @@ defmodule BerrypodWeb.Auth.Login do
required required
phx-mounted={JS.focus()} phx-mounted={JS.focus()}
/> />
<.button variant="primary" class="w-full"> <.button variant="primary" class="admin-btn-block">
Log in with email <span aria-hidden="true">→</span> Log in with email <span aria-hidden="true">&rarr;</span>
</.button> </.button>
</.form> </.form>
@ -78,17 +78,22 @@ defmodule BerrypodWeb.Auth.Login do
label="Password" label="Password"
autocomplete="current-password" autocomplete="current-password"
/> />
<.button variant="primary" class="w-full" name={@form[:remember_me].name} value="true"> <.button
Log in and stay logged in <span aria-hidden="true">→</span> variant="primary"
class="admin-btn-block"
name={@form[:remember_me].name}
value="true"
>
Log in and stay logged in <span aria-hidden="true">&rarr;</span>
</.button> </.button>
<.button class="w-full mt-2"> <.button class="admin-btn-block">
Log in only this time Log in only this time
</.button> </.button>
</.form> </.form>
<p :if={!@email_configured} class="text-sm text-center text-base-content/60"> <p :if={!@email_configured} class="setup-footer">
Locked out? Locked out?
<.link navigate={~p"/recover"} class="font-semibold text-brand hover:underline"> <.link navigate={~p"/recover"} class="admin-link">
Recover with setup secret Recover with setup secret
</.link> </.link>
</p> </p>

10
lib/berrypod_web/live/auth/registration.ex
View File

@ -8,15 +8,13 @@ defmodule BerrypodWeb.Auth.Registration do
def render(assigns) do def render(assigns) do
~H""" ~H"""
<Layouts.app flash={@flash} current_scope={@current_scope}> <Layouts.app flash={@flash} current_scope={@current_scope}>
<div class="mx-auto max-w-sm"> <div class="setup-page">
<div class="text-center"> <div class="setup-header">
<.header> <.header>
Register for an account Register for an account
<:subtitle> <:subtitle>
Already registered? Already registered?
<.link navigate={~p"/users/log-in"} class="font-semibold text-brand hover:underline"> <.link navigate={~p"/users/log-in"} class="admin-link">Log in</.link>
Log in
</.link>
to your account now. to your account now.
</:subtitle> </:subtitle>
</.header> </.header>
@ -32,7 +30,7 @@ defmodule BerrypodWeb.Auth.Registration do
phx-mounted={JS.focus()} phx-mounted={JS.focus()}
/> />
<.button phx-disable-with="Creating account..." variant="primary" class="w-full"> <.button phx-disable-with="Creating account..." variant="primary" class="admin-btn-block">
Create an account Create an account
</.button> </.button>
</.form> </.form>

12
lib/berrypod_web/live/setup/recover.ex
View File

@ -69,13 +69,15 @@ defmodule BerrypodWeb.Setup.Recover do
def render(assigns) do def render(assigns) do
~H""" ~H"""
<Layouts.app flash={@flash} current_scope={@current_scope}> <Layouts.app flash={@flash} current_scope={@current_scope}>
<div class="mx-auto max-w-sm flex flex-col gap-4"> <div class="setup-page">
<div class="setup-header">
<.header> <.header>
Account recovery Account recovery
<:subtitle> <:subtitle>
Reset your admin password using the setup secret from your server logs. Reset your admin password using the setup secret from your server logs.
</:subtitle> </:subtitle>
</.header> </.header>
</div>
<div class="admin-alert admin-alert-info"> <div class="admin-alert admin-alert-info">
<.icon name="hero-information-circle" class="size-6 shrink-0" /> <.icon name="hero-information-circle" class="size-6 shrink-0" />
@ -100,14 +102,14 @@ defmodule BerrypodWeb.Setup.Recover do
autocomplete="new-password" autocomplete="new-password"
required required
/> />
<p class="text-xs text-base-content/60 -mt-2">Minimum 12 characters</p> <p class="setup-hint">Minimum 12 characters</p>
<.button variant="primary" class="w-full"> <.button variant="primary" class="admin-btn-block">
Reset password and log in Reset password and log in
</.button> </.button>
</.form> </.form>
<p class="text-sm text-center text-base-content/60"> <p class="setup-footer">
<.link navigate={~p"/users/log-in"} class="font-semibold text-brand hover:underline"> <.link navigate={~p"/users/log-in"} class="admin-link">
Back to login Back to login
</.link> </.link>
</p> </p>