Skip to content

fix(darkmode): make markdown tables and code blocks readable in dark …#1094

Merged
IgorTodorovskiIBM merged 2 commits intozopencommunity:mainfrom
yashisrani:fix/darkmode-text
Aug 18, 2025
Merged

fix(darkmode): make markdown tables and code blocks readable in dark …#1094
IgorTodorovskiIBM merged 2 commits intozopencommunity:mainfrom
yashisrani:fix/darkmode-text

Conversation

@yashisrani
Copy link
Copy Markdown

…theme

What type of PR is this? (check all applicable)

  • Refactor
  • Feature
  • Bug Fix
  • Optimization
  • Content Update

Category

  • zopen build framework
  • zopen package manager
  • Documentation
  • CI/CD
  • Tools

Description

  • Previously, table cells and code/pre blocks in markdown pages (e.g., Latest.md) were using light text on light backgrounds in dark mode, making them invisible.

  • This change adds CSS overrides in styles.css to:

    • Use lighter text colors for tables, table headers/cells, and code/pre blocks in dark mode
    • Remove forced light backgrounds so the dark theme background is visible
    • Adjust zebra striping for .tool-item-filterable rows in dark mode for readability
  • Outcome:

Screenshot 2025-08-13 at 11 54 25 PM

No functional changes to Docsify configuration.

Related Issues

[optional] Are there any post-deployment tasks or follow-up actions required?

…theme

Signed-off-by: GitHub Action <action@github.com>
@IgorTodorovskiIBM
Copy link
Copy Markdown
Member

Hi thank you for your contribution.

I cloned your fork and checked out your branch and ran npm install and then npm run serve. However, I'm not seeing a difference:
Screenshot 2025-08-13 at 2 41 37 PM

@yashisrani
Copy link
Copy Markdown
Author

yashisrani commented Aug 13, 2025

@IgorTodorovskiIBM please run this commands ..

cd docs
npm i
npx docsify-cli serve . or npx docsify-cli serve docs

@IgorTodorovskiIBM
Copy link
Copy Markdown
Member

npx docsify-cli serve .

Hmm, I tried that and test on firefox and chrome, but I still don't see a difference.

This is the latest commit that I see:

commit 2d80cee25c3b5fa6b7a0b307cf56a4b0aa09fede (HEAD -> fix/darkmode-text, origin/fix/darkmode-text)
Author: GitHub Action <action@github.com>
Date:   Wed Aug 13 23:57:22 2025 +0530

    fix(darkmode): make markdown tables and code blocks readable in dark theme

    Signed-off-by: GitHub Action <action@github.com>

@sachintu47 or @HarithaIBM perhaps you can test as well?

@yashisrani
Copy link
Copy Markdown
Author

yashisrani commented Aug 14, 2025

@HarithaIBM @IgorTodorovskiIBM

Screen.Recording.2025-08-14.at.10.23.58.AM.mp4

@sachintu47
Copy link
Copy Markdown
Member

@IgorTodorovskiIBM @yashisrani Even I dont see a difference

Screenshot 2025-08-14 at 4 34 26 PM

@sachintu47
Copy link
Copy Markdown
Member

It worked when my system (MAC) is in dark mode

Signed-off-by: GitHub Action <action@github.com>
@yashisrani
Copy link
Copy Markdown
Author

@IgorTodorovskiIBM @sachintu47 i added new commit, please check it out

Copy link
Copy Markdown
Member

@IgorTodorovskiIBM IgorTodorovskiIBM left a comment

Choose a reason for hiding this comment

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

Looks good now!

@IgorTodorovskiIBM IgorTodorovskiIBM merged commit caf75b5 into zopencommunity:main Aug 18, 2025
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.

4 participants