Support Bootstrap CSS variables for better theming of DT tables in Bootstrap
Nobody has claimed this yet.
Assessment
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Newbie friendliness
- 45/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Stale
- Tech stack
- bootstrap, javascript
- Domain
- frontend
Research direction
Start by locating where DT filter popover styles are defined and compare the current inline values with Bootstrap 5 CSS variables. Verify the result with a Bootstrap-themed DT table, including a non-light theme, and confirm that popovers inherit the intended background, text, border, and radius styling.
Written by the indexing model from the issue text.
Description
The latest versions of Bootstrap include a layer of CSS properties that help make theming, and adapting to new themes, much easier for downstream components like DT data tables.
For instance, the popover menus for DT filters assume a light theme by default – https://github.com/rstudio/bslib/issues/267 – and cannot be themed by third parties the outside due to their use of inline styles.
Where DT currently uses the following inline styles for popovers
background-color: rgb(255, 255, 255);
border: 1px solid rgb(221, 221, 221);
border-radius: 4px;
padding: 20px 20px 10px;
it could instead (at least for BS5) use the following.
background-color: var(--bs-body-bg);
color: var(--bs-body-color);
border-color: var(--bs-border-color);
border-width: var(--bs-border-width);
border-radius: var(--bs-border-radius);
border-style: var(--bs-border-style);
- Dominant language
- JavaScript
- Stars
- 621
- Forks
- 177
- PR merge metrics
- No merged PRs in 30d
Getting set up
- No Dockerfile or Docker Compose file
- No pull request template
- Read the contributing guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from rstudio/DT
-
Unecessary "Datatables warning" alert when creating a DT with new data and same number of columnsOpen
Difficulty 4/5 3-5 days Newbie friendliness 35/100
-
Difficulty 3/5 1-2 days Newbie friendliness 45/100
-
Difficulty 3/5 1-2 days Newbie friendliness 35/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 35/100
-
Excel like filteringOpen
Difficulty 5/5 Over a week Newbie friendliness 25/100
Similar issues
-
[workshop-sim] Improve: Provide a concrete example and activity checks in agentic intro (step 5)Openfeedback simulation workshop
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
githubnext/gh-aw-workshop#5715 ·
Maintainers usually reply within 1 day
-
[prefer-expect-resolves] autofix leaves a stray ")" when the awaited expression is parenthesizedOpen
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
jest-community/eslint-plugin-jest#2052 ·
-
check:passed feeds:add
Difficulty 1/5 Under an hour Newbie friendliness 66/100
-
Wallet functions throws TypeError when the wallet has no account IDPossibly taken @Medhansh-741 claimed this today. Openbug
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
hiero-ledger/hiero-sdk-js#4781 · 1 comment ·
Maintainers usually reply within 1 day
-
Difficulty 1/5 Under an hour Newbie friendliness 88/100