fix(#3384): add v2 table border#3391
Conversation
| border-collapse: separate; | ||
| border-spacing: 0; |
There was a problem hiding this comment.
The CSS properties border-collapse and border-spacing are table-specific properties that only work on <table> elements or elements with display: table. Applying these properties to the .goatable div element will have no effect.
The styles should be split into two rules:
- Keep
border,border-radius, andoverflowon.v2.goatablefor the container styling (this part is correct) - Move
border-collapse: separateandborder-spacing: 0to a separate rule that targets the table element
For the table-specific properties, you have two options:
- Add a rule in this file:
.v2 table { border-collapse: separate; border-spacing: 0; }(for the internal table element when not using React) - Add a global rule in
components.css:goa-table[version="2"] table { border-collapse: separate; border-spacing: 0; }(works for all cases including slotted content)
bdfranck
force-pushed
the
benji/3384-fix-v2-table-border
branch
2 times, most recently
from
e5161df to
8ffe5bd
Compare
twjeffery
left a comment
twjeffery
left a comment
There was a problem hiding this comment.
Looks good to me! Thanks for jumping on this.
|
@bdfranck You will need to rebase, which should also fix your failing test issue. |
bdfranck
dismissed stale reviews from vanessatran-ddi and twjeffery
via
718451d
bdfranck
force-pushed
the
benji/3384-fix-v2-table-border
branch
from
8ffe5bd to
718451d
Compare
|
I've rebased the branch against the latest |
bdfranck
force-pushed
the
benji/3384-fix-v2-table-border
branch
from
3e23063 to
c96e4f1
Compare
|
I rebased against latest |
|
🎉 This PR is included in version 1.41.0-dev.5 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 1.11.0-dev.2 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 6.11.0-dev.4 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 4.11.0-dev.5 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 1.41.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 1.11.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 6.11.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 4.11.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 1.41.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 1.11.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 6.11.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 4.11.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 2.0.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 2.0.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 7.0.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 5.0.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 2.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 7.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 5.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
This PR fixes the v2 table border.
Before (the change)
The v2 Table doesn't have a border. 😢
After (the change)
The v2 Table has a border! 🎉