Remove bootstrap dependency

[mmustafasenoglu]

Closes #1867

Bootstrap 3.4.1 has known vulnerabilities and NSS only uses it for basic CSS layout (grid, panels, forms, buttons, alerts) plus a single glyphicon-remove icon. This replaces the entire dependency with a lightweight custom stylesheet.

Changes:

• common/css/solid.css: Added replacement CSS for all Bootstrap 3 classes used across templates (grid, panels, forms, buttons, alerts, progress, visibility, typography)
• common/css/bootstrap.min.css: Deleted
• lib/create-app.mjs: Removed bootstrap node_module route handlers
• package.json: Removed bootstrap dependency
• 72 template files: Dropped <link> to bootstrap.min.css

The glyphicon-remove icon is replaced with an inline SVG data URI, so no font files are needed either.

Tests pass (818 passing, 3 pre-existing EADDRINUSE failures).

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[Copilot]

Pull request overview

Copilot reviewed 75 out of 77 changed files in this pull request and generated no new comments.

Suppressed comments (5)

common/css/solid.css:110

• .col-md-* grid rules are currently applied unconditionally, which changes Bootstrap 3 behavior: templates that use only col-md-* (e.g. default-views/auth/login.hbs) are expected to stack below 992px, but will now stay split into columns on small screens. Wrap the col-md-* width/float rules in the min-width: 992px media query to preserve responsive behavior.

.col-xs-3  { width: 25%; float: left; }
.col-xs-9  { width: 75%; float: left; }
.col-md-2  { width: 16.66666667%; float: left; }
.col-md-6  { width: 50%; float: left; }
.col-md-10 { width: 83.33333333%; float: left; }

common/css/solid.css:380

• The password strength validator applies progress-bar-success|warning|danger classes (see common/js/solid.js / solid.mjs), but these variants are not defined here. As a result the meter will always use the default .progress-bar color.

.progress-bar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;

common/css/solid.css:230

• The password validator toggles .has-success|.has-warning|.has-error on .form-group (see common/js/solid.js / solid.mjs), but those state styles are missing. Without them, inputs and feedback icons won't change color/border to reflect validation state.

.form-control-feedback {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;

common/css/solid.css:451

• Only .glyphicon-remove is defined, but the password validator swaps the feedback icon between glyphicon-remove, glyphicon-ok, and glyphicon-warning-sign. Also, the current .glyphicon-remove rule overrides the 34x34 sizing from .form-control-feedback, which will misplace the icon in the input field. Define all three icons and avoid overriding .form-control-feedback sizing (use currentColor so state colors come from .has-*).

.glyphicon-remove {
  display: inline-block;
  width: 14px;
  height: 14px;
  vertical-align: text-top;

common/css/solid.css:516

• flex-wrap: row wrap; is not valid CSS (valid values are nowrap|wrap|wrap-reverse). Because it is invalid, browsers will ignore it, making the rule misleading and harder to maintain.

  position: relative;
  display: flex;
  flex-direction: column;
  flex-wrap: row wrap;
  margin: auto;

[bourgeoa]

@mmustafasenoglu Thanks for your work
Can you check Copilot comments

[mmustafasenoglu]

@bourgeoa Done! All 5 Copilot comments have been addressed:

1. col-md-* responsive grid: Wrapped .col-md-* width/float rules inside @media (min-width: 992px) to preserve Bootstrap 3's responsive stacking behavior below 992px.

2. Progress bar color variants: Added .progress-bar-success, .progress-bar-warning, and .progress-bar-danger definitions so the password strength meter colors work correctly.

3. Form validation states: Added .has-success, .has-warning, and .has-error styles including .form-control border colors, focus shadows, .help-block colors, and feedback icon colors.

4. Glyphicon icons: Added .glyphicon-ok and .glyphicon-warning-sign SVG replacements alongside .glyphicon-remove. Switched from hardcoded fill colors to currentColor so the icon color inherits from the parent .has-* state.

5. flex-wrap fix: Changed the invalid flex-wrap: row wrap to flex-wrap: wrap.