TailwindCSS production.

This commit is contained in:
Clive
2026-08-19 22:22:56 +10:00
parent e8e03a855a
commit 152a998311
7 changed files with 1207 additions and 23 deletions
+4 -4
View File
@@ -12,14 +12,15 @@ Run from the repo root (the solution directory).
- Build: `dotnet build plushealthtech.sln`
- Run locally: `dotnet run --project plushealthtech` → https://localhost:7070 (http: 5047, per the `https` profile in `Properties/launchSettings.json`); use `dotnet watch --project plushealthtech` for hot reload
- Docker image (build context is the repo root, not the project folder): `docker build . -t plushealthtech:latest -f plushealthtech/Dockerfile`
- CSS: `npm install` once, then `npm run build:css` compiles the Tailwind v4 bundle into `plushealthtech/wwwroot/css/tailwind.css` (use `npm run watch:css` while editing pages). The layout links this local file — never load the Tailwind Play CDN from markup.
- Docker image (build context is the repo root, not the project folder): `docker build . -t plushealthtech:latest -f plushealthtech/Dockerfile` — the Dockerfile's node stage builds the CSS itself, so no local `npm run build:css` is needed before a Docker build.
- There is no test project and no linter/formatter configuration.
## Architecture
- `plushealthtech/` is the only project. `Program.cs` is the entire pipeline: `AddRazorPages()`, HTTPS redirect, static files — new services would be registered there.
- Pages use the Razor Pages convention: `Pages/<Name>.cshtml` + `<Name>.cshtml.cs` (a PageModel). Existing: `Index` (logo hero), `Privacy`, `Error`, and the shared `Shared/_Layout.cshtml`. There are no areas or controllers.
- Shared chrome and branding: `Pages/Shared/_Layout.cshtml` (navbar with Home + external blog link, footer) and `wwwroot/css/site.css` (CSS custom properties; `.bg-blue` = `#1c8098` is the brand color used on the navbar). The layout `<head>` loads an external analytics script from analytics.rokoh.com.
- Shared chrome and branding: `Pages/Shared/_Layout.cshtml` (navbar with Home + external blog link, footer). Styling is a **Tailwind v4** bundle: source `wwwroot/css/tailwind.input.css` (CSS-first `@theme` with brand colors — `brand` `#1c8098`, `brand-dark` `#145f72`, `brand-light` `#e6f2f5`, `brand-accent` `#0ea5e9`, `brand-vet` `#0d9488`), built by the Tailwind CLI into `wwwroot/css/tailwind.css` and linked in the layout `<head>`. `wwwroot/css/site.css` holds legacy CSS custom properties (`.bg-blue` = `#1c8098`). The layout `<head>` also loads an external analytics script from analytics.rokoh.com.
- Brand and UI design guidelines live in `Design.MD` (color palette with `#1c8098` as brand core, typography, component/layout conventions) — follow it when adding or restyling pages.
- Client libraries (Bootstrap, jQuery, jquery-validation) are vendored in `wwwroot/lib`; logo and favicon are in `wwwroot/img/`.
@@ -27,5 +28,4 @@ Run from the repo root (the solution directory).
- Pushes to Gitea (gitea.rokoh.com) run the Gitea Actions workflow: build the Docker image → push `registry.rokoh.com/plushealthtech:latest` → SSH into `10.10.0.90` and run the container with `-p 7000:80 --restart=always`. Registry and server credentials come from Gitea secrets, not the repo.
- The workflow file exists in **two identical copies**: `.gitea/workflows/default.yml` (the one Gitea reads) and `plushealthtech/.gitea/workflows/default.yml` (referenced from the csproj as `<None Include>`). Keep them in sync when editing either.
- The Dockerfile is multi-stage (restore → build → publish → aspnet runtime), exposes 80/443, entrypoint `dotnet plushealthtech.dll`.
- **Known inconsistency**: the project targets `net10.0`, but the Dockerfile still pins .NET 7 base images (`mcr.microsoft.com/dotnet/{aspnet,sdk}:7.0`), so `docker build` fails as-is. When touching the Dockerfile, bump the base images to .NET 10 to match the TFM.
- The Dockerfile is multi-stage (node frontend → restore → build → publish → aspnet runtime), exposes 80/443, entrypoint `dotnet plushealthtech.dll`. The `frontend` stage runs `npm ci && npm run build:css` and feeds the generated `wwwroot/css/tailwind.css` into the dotnet build, so the image always ships freshly compiled CSS.