Skip to content

Post milestone3m#395

Open
timea-solid wants to merge 31 commits into
mainfrom
post-milestone3m
Open

Post milestone3m#395
timea-solid wants to merge 31 commits into
mainfrom
post-milestone3m

Conversation

@timea-solid
Copy link
Copy Markdown
Member

No description provided.

SharonStrats and others added 18 commits May 2, 2026 19:43
The shell's outer `#MainContent` wrapper was a <main>, but each pane
also rendered its own <main> (profile-pane, mainPage) or inherited one
from solid-ui's tab widget body. That produced multiple <main>
landmarks per page, which is invalid per HTML semantics and triggers
accessibility warnings.

Promote `.app-view` to <main id="MainContent"> so there is exactly one
page-level landmark, encompassing the outline view and global
dashboard but excluding the application sidebar nav and menu overlay.
The skip-link target `#MainContent` is preserved.

Paired with:
- SolidOS/solid-ui: demote tab-widget body from <main> to <div>
- SolidOS/profile-pane: drop inner <main> from ProfileView/EditProfileView

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
When the id `MainContent` was moved from the outer wrapper to
`.app-view`, the existing rule `#MainContent { display: flex }`
started applying to the new element, whose children are
`#OutlineView` and `#GlobalDashboard`. Both became row-direction
flex items and `#GlobalDashboard` collapsed to ~36px wide, so
clicking sidebar items ("Your profile" etc.) rendered the pane
content into an invisible column.

Remove `display: flex` from the `#MainContent` rule (the outer
wrapper was the only thing that needed to be a flex container),
add `min-width: 0` so it still cooperates as a flex child of
`.app-shell`, and update the stale `.app-view` comment.

Also strip the redundant `role="main"` from
`static/browse-test.html` to match `browse.html`.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copilot AI review requested due to automatic review settings May 14, 2026 12:37
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR updates the databrowser/static browse layout semantics and expands styling theme tokens for newer UI components.

Changes:

  • Removes redundant role="main" from some <main> elements and restructures src/databrowser.html.
  • Adds and adjusts light/dark theme CSS variables for buttons, dialogs, text, borders, and focus styles.
  • Tweaks app-shell/main layout styles and utility input/label colors.

Reviewed changes

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

Show a summary per file
File Description
static/browse.html Removes explicit role="main" from the browse main landmark.
static/browse-test.html Mirrors the browse page landmark update.
src/styles/themes/light.css Adds new light-theme design tokens and adjusts status/border colors.
src/styles/themes/dark.css Adds dark-theme token counterparts and updates dark color values.
src/styles/mash.css Adjusts main/app-shell flex behavior and removes legacy pane CSS blocks.
src/styles/mash-utilities.css Switches input and label text colors to theme variables.
src/databrowser.html Moves the main landmark inside the app shell and wraps live-region behavior.

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

Comment thread src/databrowser.html
</aside>

<div class="app-view">
<main id="MainContent" class="app-view">
Copy link
Copy Markdown
Member Author

@timea-solid timea-solid May 14, 2026

Choose a reason for hiding this comment

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

@m5x5 what is your opinion on this?
Remark that now skip-link is not active in the code.

Comment thread src/styles/mash-utilities.css
Comment thread src/styles/themes/dark.css
Comment thread src/styles/mash.css
Comment thread src/styles/themes/dark.css
Comment thread src/styles/themes/light.css Outdated
Comment thread src/styles/mash.css Outdated
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: No status

Development

Successfully merging this pull request may close these issues.

4 participants