Skip to content

fix(theme): new-design follow-ups for time-planning, compliance report and review findings - #8065

Merged
renemadsen merged 1 commit into
stablefrom
fix/new-design-review-followups
Sep 13, 2026
Merged

fix(theme): new-design follow-ups for time-planning, compliance report and review findings#8065
renemadsen merged 1 commit into
stablefrom
fix/new-design-review-followups

Conversation

@renemadsen

Copy link
Copy Markdown
Member

What

Follow-up to #8061 ("eForm new design"). CSS only, and every rule is scoped to body.theme-workspace, so eForm Classic is unchanged.

Time-planning planning grid (.mtx-grid.time-dashboard)

The plugin draws a box around every header cell, and its day-status classes (.white-/.grey-/.green-/.red-background) force borders with !important.

  • The header now has only the tint and the single line under it: no vertical or top dividers.
  • The body keeps its day dividers, but in the row-separator colour, and there's none along the frame's right or bottom edge.

Compliance report "Rapport" grid (the first two rules apply to every mtx-grid)

  • box-sizing: border-box: a width of 100% plus the 1px frame overflowed by 2px, and a parent with overflow: hidden cut off the right frame edge.
  • Left-pinned columns: mtx-grid no longer draws a divider after them. The time-planning grid keeps its pale one.
  • Pinned header cells: they keep the --bg tint even when a plugin paints them.
  • Scrollbar: grid scrollers get a thin, themed scrollbar.

The Oversigt and Detaljer tabs of the compliance report need template changes. Those are in a separate backend-configuration plugin PR.

Review follow-ups

These come from the post-merge review of #8061 and from Copilot's comments on it:

  • Sub-header and px-3 gutter rules: now limited to the content card, so the connection-setup page (simple layout, no content card) keeps its padding.
  • Backend-configuration case page: its routed div.p-4 root no longer doubles the 24px gutter.
  • Hand-written mat-mdc-table rows: they lose the separator under the last row.
  • Tidy-ups: the radius token and :is() grouping are used, and the icon-button comment is now accurate.

Not changed, after checking each comment against the code:

  • Copilot's comments on the last-row separator, native .table-action-trigger, legacy mat-row heights and legacy striping describe CSS or markup that doesn't exist in the app.
  • The files-table header button is plugin-owned, so it's left for the plugin repo.

Note: Nunito Sans weight 500

#8061 added weight 500 to the Nunito Sans link. eForm Classic's own CSS asks for 500 in places, so that text now renders as medium instead of falling back to regular. We're keeping this on purpose.

Tests

New checks in playwright/e2e/Tests/g/application-settings.theme-new-design.spec.ts:

  • the last row's bottom edge
  • grid box-sizing
  • the pinned header tint, tested against an injected plugin-style paint with a positive control
  • the edge-to-edge content-card exception for full-bleed views
  • the time-planning dividers
  • the dividers after left-pinned columns

The last three use temporary stand-in markup that is removed after each test.

Verified locally:

  • Sass compiles
  • ng build succeeds
  • the spec type-checks
  • playwright test --list shows 10 tests

The Playwright tests themselves only run in CI. The styles were checked in the browser on a dev tree running the latest stable.

🤖 Generated with Claude Code

https://claude.ai/code/session_01HfLyiGF7BQTRixiUfSuXxD

…t and review findings

Time-planning planning grid (.mtx-grid.time-dashboard): the plugin boxes
every header cell and its status classes force !important borders. The
header now has only the tint and the bottom line; body day dividers stay
but in the row-separator colour, and none against the frame's edges.

Compliance report "Rapport" grid (and every mtx-grid):
- box-sizing: border-box, so width 100% plus the 1px frame no longer
  overflows and an overflow: hidden parent stops clipping the right edge.
- No mtx divider after left-pinned columns (time-planning keeps its pale one).
- Pinned header cells keep the --bg tint against plugin paints.
- Thin themed scrollbar on grid scrollers.

Review follow-ups (post-merge review of #8061 and Copilot's comments):
- Sub-header and px-3 gutter rules scoped to the content card, so the
  simple-layout connection-setup page keeps its padding.
- Backend-configuration case page: its routed div.p-4 root no longer
  doubles the 24px gutter.
- Hand-written mat-mdc-table rows lose the separator under the last row.
- Radius token and :is() grouping; icon-button comment made accurate.

eForm Classic is unchanged: every rule is scoped to body.theme-workspace.

Playwright (shard g): checks the last-row edge, grid box-sizing, the pinned
header tint against an injected plugin paint, the full-bleed content-card
exception, time-planning dividers and pinned-left dividers.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01HfLyiGF7BQTRixiUfSuXxD
Copilot AI lite review requested due to automatic review settings September 13, 2026 07:06

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟢 Approval recommended

No unresolved issues were identified that would block approval.

Pull request overview

Updates the workspace theme’s table/grid styling and page-gutter handling while preserving Classic theme behavior.

Changes:

  • Refines grid borders, pinned cells, scrollbars, radii, and time-planning dividers.
  • Scopes gutter overrides to content-card routes and handles backend case-page padding.
  • Expands Playwright regression coverage for the updated styles.
File summaries
File Description
eform-client/src/scss/components/_workspace-utilities.scss Updated as part of this pull request.
eform-client/src/scss/components/_workspace-patterns.scss Updated as part of this pull request.
eform-client/src/scss/components/_workspace-mat-overrides.scss Updated as part of this pull request.
eform-client/playwright/e2e/Tests/g/application-settings.theme-new-design.spec.ts Updated as part of this pull request.
Review details
  • Files reviewed: 4/4 changed files
  • Comments generated: 0
  • Review effort level: Lite

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

@renemadsen
renemadsen merged commit fa91db2 into stable Sep 13, 2026
31 of 35 checks passed
@renemadsen
renemadsen deleted the fix/new-design-review-followups branch September 13, 2026 08:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants