Add Bootstrap, Alpine.js, Tippy.js with SASS support#1
Merged
Conversation
Installs Bootstrap (latest), Alpine.js, Tippy.js, and @popperjs/core as UI dependencies. Adds sass for SCSS compilation in Vite. Switches the main CSS entry point from app.css to resources/assets/scss/app.scss (importing Bootstrap), wires Alpine and Tippy globally in App.js, and silences Bootstrap's Dart Sass 3.0 deprecation warnings in vite config. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
Clones and builds the main branch of coldbox-vite-plugin (v4.0.0) from source, vendoring the compiled dist into vendor/coldbox-vite-plugin. Switches the devDependency to file:vendor/coldbox-vite-plugin so the build works without depending on a published npm release. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
…lugin Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
- Install @phosphor-icons/web for icon font (regular weight) - Add Alpine stores: theme (light/dark + localStorage) and sidebar (collapse/drawer + localStorage) - SCSS architecture: _variables.scss (brand palette + Bootstrap overrides), _base.scss (CSS custom properties for both themes), layouts/_auth.scss, layouts/_admin.scss, components/_sidebar.scss, components/_topbar.scss - Three BXM layouts: AuthCenter (centered card), AuthSplit (two-column brand panel + form), Admin (fixed sidebar + sticky topbar) - Dark mode uses Bootstrap 5.3 data-bs-theme attribute; inline FOUC-prevention script in each layout's <head> prevents color flash on load - Sidebar collapses to 64px icon strip on desktop, slides in as drawer on mobile Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
Replaces file:resources/coldbox-vite-plugin with a direct GitHub tag reference (ColdBox/coldbox-vite-plugin#v4.0.0). The tag includes the built dist, so no local build step is needed. Removes the bundled local copy from the repo entirely. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
…ence Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
Test Results15 tests 14 ✅ 2s ⏱️ For more details on these errors, see this check. Results for commit 280fdd0. ♻️ This comment has been updated with latest results. |
- vite.config.mjs: switch refresh from true (flat layout paths) to appRefreshPaths so the dev server hot-reloads on changes under app/layouts/**, app/views/**, and app/config/Router.bx - app/layouts/Main.bxm: replace Hello World placeholder with a minimal theme-aware shell consistent with the other layouts (FOUC script, Alpine theme store init, renderView injection) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
- Auth handler: login, register, forgotPassword, resetPassword, logout with mock session auth - Dashboard handler: auth guard, populates prc.authUser + stat/activity/quickAction mock data - Auth views: login, register, forgotPassword, resetPassword with Alpine-driven validation, password strength indicator (bars + requirements checklist), show/hide toggles, server-side error display, and loading states - Dashboard view: stat cards, activity feed, quick actions grid, user mini-card - Alpine components: PasswordStrength.js and AuthForm.js in resources/assets/js/components/ - Admin layout: replace prc.currentUser method calls with prc.authUser struct; fix logout link from /logout to /auth/logout - SCSS: _auth-forms.scss and views/_dashboard.scss partials added to app.scss pipeline Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
- Delete app/views/main/index.bxm (stock ColdBox welcome page, uses Bootstrap Icons which are not installed) - Coldbox.bx: change defaultEvent from Main.index to Auth.login so visiting / lands on the login page - box.json: add cbcsrf ^2 as explicit dependency with installPath (cbsecurity bundles it, but explicit is clearer) - Auth handler: call csrfVerify( rc._token ) at the top of every POST block; on failure set prc.error and return the view without processing - All four auth form views: add hidden _token input via csrfToken(); login/register/resetPassword gain a prc.error alert block for general errors (CSRF expiry, etc.) alongside the existing prc.errors field-level block; forgotPassword already had prc.error support Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
- New `app/views/_partials/` directory with BXM partials: includes, mainNav, header, footer, notificationBell, logo, messagebox - MessageBox Alpine component with auto-dismiss, 4 type variants (info/success/warning/error), dismiss button, dark mode support - Logo partial with inline SVG gradient mark and unique gradient IDs - Header partial uses <ul>/<li> so notificationBell slots in semantically - Admin.bxm refactored to use mainNav/header/footer/includes partials - AuthCenter, AuthSplit, Main layouts use includes partial - _topbar.scss: add <ul>/<li> support for .topbar-right; add .topbar-divider-item - _admin.scss: add .app-footer styles, update .topbar-right for list semantics - Remove explicit cbcsrf from box.json (bundled with cbsecurity v3) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
The Vite manifest (public/includes/build/.vite/manifest.json) must exist before the BoxLang server starts, otherwise vite-helpers throws on every request and integration tests fail. Add Node.js setup and npm ci + npm run build steps between box install and server start. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
4. Flash scope: replace manual session.flash read/write with ColdBox
flash scope (flash.put / rc.flash via inflateToRC)
5. Messagebox partial: replace inline alert divs in all four auth views
(login, register, forgotPassword, resetPassword) with
#view("_partials/messagebox", ...)# calls
6. Logo partial: replace duplicate inline SVG logos in AuthCenter and
AuthSplit layouts with #view("_partials/logo")# calls
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Installs Bootstrap (latest), Alpine.js, Tippy.js, and @popperjs/core as
UI dependencies. Adds sass for SCSS compilation in Vite. Switches the
main CSS entry point from app.css to resources/assets/scss/app.scss
(importing Bootstrap), wires Alpine and Tippy globally in App.js, and
silences Bootstrap's Dart Sass 3.0 deprecation warnings in vite config.
Co-Authored-By: Claude Sonnet 4.6 noreply@anthropic.com
Claude-Session: https://claude.ai/code/session_01Ewf54RqUdHJTzyyPqtYX4i