Skip to content

fix: table styling#7712

Open
fikrydev wants to merge 2 commits into
mainfrom
fix/table-styling
Open

fix: table styling#7712
fikrydev wants to merge 2 commits into
mainfrom
fix/table-styling

Conversation

@fikrydev

Copy link
Copy Markdown
Contributor

Summary

On Lighthouse the .client-js class is missing (i am not sure about the significance), so this PR removes it and make it so that the styles is deteced by lighthouse. Also it adds a border-collapse styling so that the table doesnt have a thick border.

How did you test this change?

I removed .client-js on the production wiki by overriding the style and it works.

@fikrydev fikrydev self-assigned this Jun 30, 2026
@fikrydev fikrydev requested a review from a team as a code owner June 30, 2026 15:31
Copilot AI review requested due to automatic review settings June 30, 2026 15:31
@fikrydev fikrydev requested a review from a team as a code owner June 30, 2026 15:31
@fikrydev fikrydev added the stylesheets Changes to stylesheets label Jun 30, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

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 common SCSS styling to (1) remove reliance on the client-js class for collapsible behaviors and (2) adjust table border rendering by adding border-collapse: collapse.

Changes:

  • Added a global border-collapse: collapse rule intended to prevent “double/thick” table borders.
  • Removed html.client-js gating from Prizepooltable collapsed-row hiding rules.
  • Removed html.client-js gating from NavFrame and generic .collapsible collapsed-content hiding rules.

Reviewed changes

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

File Description
stylesheets/commons/Tables.scss Adds border-collapse: collapse rule for tables/wikitables.
stylesheets/commons/Prizepooltable.scss Changes collapsed-row hiding selector from html.client-js to html.
stylesheets/commons/NavFrame.scss Changes NavFrame/collapsible collapsed-content hiding selectors from html.client-js to html.

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


@for $i from 0 through 32 {
html.client-js .prizepooltable.collapsed[ data-cutafter="#{$i}" ] tr:nth-child( n + #{ $i + 3 } ) {
html .prizepooltable.collapsed[ data-cutafter="#{$i}" ] tr:nth-child( n + #{ $i + 3 } ) {
}

html.client-js .NavFrame.collapsed .NavContent {
html .NavFrame.collapsed .NavContent {
Comment on lines +77 to +81
html .collapsible.collapsed > thead > tr:nth-child( n+2 ),
html .collapsible.collapsed > thead + tbody,
html .collapsible.collapsed > tbody > tr:nth-child( n+2 ),
html .collapsible.collapsed > tfoot,
html .collapsible.collapsed > tr:nth-child( n+2 ) {
Comment on lines +247 to +250
table,
.wikitable {
border-collapse: collapse;
}
@hjpalpha

hjpalpha commented Jul 1, 2026

Copy link
Copy Markdown
Collaborator

as copilot already mentioned
won't we get issues for users that have js disabled/blocked that they e.g. can't uncollapse several components?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

stylesheets Changes to stylesheets

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants