- Remove all Bootstrap CSS/JS references from templates
- Add Tailwind CSS v4 with Material Design inspired theme (input.css)
- Compile tailwind.css with standalone CLI (committed to repo)
- Vendor Alpine.js 3.14.9 for reactive UI components
- Rewrite base.html to match µPaaS layout structure
- Rewrite htmlheader.html with Tailwind CSS link
- Rewrite navbar.html with Alpine.js mobile menu toggle
- Convert index.html to Tailwind utility classes
- Convert login.html to Tailwind utility classes
- Convert profile.html to Tailwind utility classes
- Add make css target for Tailwind compilation
- Add footer template with project links
closes#4
✅All Bootstrap references removed — zero occurrences of bootstrap, jsdelivr, cdn, or any CDN URLs in templates or static assets. Old style.css replaced with a single-line comment pointing to input.css.
✅Tailwind CSS v4 compiled and working — static/css/tailwind.css is a properly compiled Tailwind v4.0.14 output (23KB minified). static/css/input.css defines a clean Material Design-inspired theme with custom color palette, elevation shadows, and @layer components for reusable classes (btn-primary, btn-secondary, btn-danger, btn-text, card, card-elevated, input, label, form-group, badge-*, app-bar, alert-*).
✅Alpine.js vendored locally — static/js/alpine.min.js (44KB, v3.14.9) loaded via <script defer src="/s/js/alpine.min.js"> in base.html. No CDN references anywhere.
✅Templates use consistent Tailwind utility classes — All 6 templates (base.html, htmlheader.html, navbar.html, index.html, login.html, profile.html) rewritten with Tailwind utilities. Responsive design via md: breakpoints. Alpine.js x-data, x-show, x-cloak, @click for mobile menu toggle.
✅make css target works — Makefile has css: target running tailwindcss -i static/css/input.css -o static/css/tailwind.css --minify.
✅.golangci.yml NOT modified — confirmed via diff, no changes.
✅Tests NOT weakened — confirmed via diff, zero test file changes.
✅docker build . passes — full build including make check (fmt-check, lint, test, build) succeeded.
Notes
Branch is already up-to-date with main (no rebase needed).
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Summary
Replaces Bootstrap CSS/JS framework with Tailwind CSS v4 + Alpine.js, matching the µPaaS UI pattern.
Changes
static/css/input.csswith Material Design inspired theme, compiled tostatic/css/tailwind.cssstatic/js/alpine.min.jsfor reactive UI componentsbase.html— new layout structure with footer, matches µPaaS patternhtmlheader.html— Tailwind CSS link,[x-cloak]stylenavbar.html— Alpine.js mobile menu toggle, responsive designindex.html— card-based dashboard with Tailwind classeslogin.html— centered login form with Material Design stylingprofile.html— clean profile layoutmake csstarget — compiles Tailwind CSS using standalone CLIinput.css— reusable.btn-primary,.card,.input,.alert-erroretc.Testing
make fmt✅make check(fmt-check, lint, test, build) ✅docker build .✅closes #4
Review: PASS ✅
Reviewed PR #14 (closes #4) — Bootstrap → Tailwind CSS v4 + Alpine.js migration.
Checklist
bootstrap,jsdelivr,cdn, or any CDN URLs in templates or static assets. Oldstyle.cssreplaced with a single-line comment pointing toinput.css.static/css/tailwind.cssis a properly compiled Tailwind v4.0.14 output (23KB minified).static/css/input.cssdefines a clean Material Design-inspired theme with custom color palette, elevation shadows, and@layer componentsfor reusable classes (btn-primary,btn-secondary,btn-danger,btn-text,card,card-elevated,input,label,form-group,badge-*,app-bar,alert-*).static/js/alpine.min.js(44KB, v3.14.9) loaded via<script defer src="/s/js/alpine.min.js">inbase.html. No CDN references anywhere.base.html,htmlheader.html,navbar.html,index.html,login.html,profile.html) rewritten with Tailwind utilities. Responsive design viamd:breakpoints. Alpine.jsx-data,x-show,x-cloak,@clickfor mobile menu toggle.make csstarget works — Makefile hascss:target runningtailwindcss -i static/css/input.css -o static/css/tailwind.css --minify..golangci.ymlNOT modified — confirmed via diff, no changes.docker build .passes — full build includingmake check(fmt-check, lint, test, build) succeeded.Notes
main(no rebase needed).input.cssfor design tokens and component classes, compiledtailwind.cssfor production, vendoredalpine.min.jsfor interactivity.Marking as
merge-ready.