remove Tailwind + DaisyUI theme + heroicons plugin, admin fully custom CSS (Phase 7)

replace Tailwind CLI with esbuild for admin CSS bundling. admin now uses
hand-written utility classes (admin/utilities.css), static heroicon CSS
generated by mix generate_admin_icons, plain CSS colour themes extracted
from DaisyUI plugin config, and minimal resets. rename app.css to admin.css
for clarity alongside shop.css. delete vendor/daisyui-theme.js and
vendor/heroicons.js. no Tailwind dependency remains in the project.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
jamey
2026-02-18 01:15:28 +00:00
parent af0b0c217f
commit 82583822f5
21 changed files with 1614 additions and 319 deletions

View File

@@ -393,8 +393,8 @@ defmodule SimpleshopThemeWeb.CoreComponents do
You can customize the size and colors of the icons by setting
width, height, and background color classes.
Icons are extracted from the `deps/heroicons` directory and bundled within
your compiled app.css by the plugin in `assets/vendor/heroicons.js`.
Icons are extracted from the `deps/heroicons` directory and bundled into
`admin/icons.css` by `mix generate_admin_icons`.
## Examples

View File

@@ -98,14 +98,14 @@ defmodule SimpleshopThemeWeb.Layouts do
end
@doc """
Provides dark vs light theme toggle based on themes defined in app.css.
Provides dark vs light theme toggle based on themes defined in admin.css.
See <head> in root.html.heex which applies the theme before page load.
"""
def theme_toggle(assigns) do
~H"""
<div class="card relative flex flex-row items-center border-2 border-base-300 bg-base-300 rounded-full">
<div class="absolute w-1/3 h-full rounded-full border-1 border-base-200 bg-base-100 brightness-200 left-0 [[data-theme=light]_&]:left-1/3 [[data-theme=dark]_&]:left-2/3 transition-[left]" />
<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" />
<button
class="flex p-2 cursor-pointer w-1/3"

View File

@@ -11,7 +11,7 @@
<style>
@layer properties, reset, primitives, tokens, theme, base, components, layout, utilities, overrides;
</style>
<link phx-track-static rel="stylesheet" href={~p"/assets/css/app.css"} />
<link phx-track-static rel="stylesheet" href={~p"/assets/css/admin.css"} />
<link phx-track-static rel="stylesheet" href={~p"/assets/css/shop.css"} />
<script defer phx-track-static src={~p"/assets/js/app.js"}>
</script>

View File

@@ -7,7 +7,7 @@
<.live_title default="SimpleshopTheme" suffix=" · Phoenix Framework">
{assigns[:page_title]}
</.live_title>
<link phx-track-static rel="stylesheet" href={~p"/assets/css/app.css"} />
<link phx-track-static rel="stylesheet" href={~p"/assets/css/admin.css"} />
<script defer phx-track-static src={~p"/assets/js/app.js"}>
</script>
<script>

View File

@@ -66,7 +66,7 @@ defmodule SimpleshopThemeWeb.ErrorHTML do
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>{@error_code} - {@error_title}</title>
<link phx-track-static rel="stylesheet" href={~p"/assets/css/app.css"} />
<link phx-track-static rel="stylesheet" href={~p"/assets/css/admin.css"} />
<style id="theme-css">
<%= Phoenix.HTML.raw(@generated_css) %>
</style>