Refactor/styles separate css

[SharonStrats]

Followed contacts-pane and profile pane to move styles into css files. Also copied over the dev globals for the development environment.

Retested in solid-panes with local issue-pane.

[Copilot]

Pull request overview

This PR refactors UI styling by moving inline styles into dedicated CSS files and updates the webpack build/dev setup to bundle CSS, aligning this pane with patterns used in other panes (contacts/profile) and adding local-development global styles.

Changes:

• Introduced shared webpack moduleRules (including CSS + CSS modules handling) and wired it into both prod and dev webpack configs.
• Replaced multiple inline style assignments with semantic class names and new CSS files across tracker/issue/board UI.
• Updated development environment defaults (dev global CSS overrides, Node version guidance via .nvmrc/README, package metadata).

Reviewed changes

Copilot reviewed 18 out of 20 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
webpack.module.rules.mjs	New shared webpack module rules, including CSS handling.
webpack.dev.config.mjs	Uses shared moduleRules instead of local duplication.
webpack.config.mjs	Uses shared moduleRules for production builds.
package.json	Marks CSS as side-effectful and adds loaders / Node engine constraint.
.nvmrc	Updates the Node version used for development.
README.md	Adds development setup instructions (Node + start commands).
dev/index.js	Imports dev-global CSS and changes default dev tracker URL.
dev/dev-global.css	Adds local-dev global styling variables/resets and accessibility-focused defaults.
src/newTracker.js	Replaces inline styling with a CSS class and imports the stylesheet.
src/newIssue.js	Adds CSS import, replaces innerHTML with DOM construction, and adds close/cancel behavior.
src/issuePane.js	Imports CSS and replaces inline styles with classes (board/table/new issue/overlay/login button).
src/issue.js	Imports CSS and replaces many inline styles with classes; adjusts overlay structure.
src/board.js	Imports CSS and replaces inline styles with classes for board/table/cards.
src/styles/newTracker.css	New CSS for tracker creation button spacing.
src/styles/newIssue.css	New CSS for new issue form/title input styling.
src/styles/issuePane.css	New CSS for issue pane controls and overlay container.
src/styles/issue.css	New CSS for issue overlay/panel and related subcomponents.
src/styles/board.css	New CSS for board/table/card layout.
src/styles/csvButton.css	Added (currently empty).

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

Pull request overview

Copilot reviewed 18 out of 23 changed files in this pull request and generated 12 comments.

Comments suppressed due to low confidence (2)

src/issuePane.js:504

• newIssueButton is disabled on click, but the new newIssueForm now supports an onCancel callback (close button) and the call site doesn’t pass it. If a user closes the form, the button stays disabled until a successful create. Pass an onCancel that re-enables the button (and/or removes the form) when the close button is used.

      newIssueButton.addEventListener(
        'click',
        function (_event) {
          newIssueButton.disabled = true
          container.appendChild(newIssueForm(dom, kb, tracker, null, showNewIssue))
        },
        false

src/issue.js:400

• Avoid using innerHTML with classLabel (derived from RDF data) because it can allow HTML injection if the label contains markup. Use textContent for the button label instead.

    subIssuePanel.appendChild(b)
    const classLabel = utils.label(states)
    b.innerHTML = 'New sub ' + classLabel
    b.addEventListener(
      'click',
      function (_event) {
        subIssuePanel.insertBefore(newIssueForm(dom, kb, tracker, issue, listOfSubs.refresh), b.nextSibling) // Pop form just after button
      },