Skip to content

Conversation

@gordonwoodhull
Copy link
Contributor

@gordonwoodhull gordonwoodhull commented Mar 13, 2025

Enables the cell attribute

#| renderings: [light, dark]

If the cell contains two div.cell-output-display, the content will be put in a div.light-content and a div.dark-content instead.

Then .dark-content is hidden when body has .quarto-light, and vice-versa.

To do:

  • Warn if caption or label on the same cell, as they won't work right
  • Add has_renderings flag in flags.lua and check in main.lua
  • Use .quarto-dark instead of .quarto-light if dark theme is default

@gordonwoodhull gordonwoodhull force-pushed the feature/cell-light-dark-renderings branch 2 times, most recently from 434487f to 0ed3bf1 Compare March 13, 2025 06:26
@gordonwoodhull gordonwoodhull changed the title Feature: cell renderings attribute, light and dark Feature: cell renderings, light and dark Mar 13, 2025
@gordonwoodhull
Copy link
Contributor Author

gordonwoodhull commented Mar 13, 2025

It's not as easy as I thought to detect captions and labels, due to the same complexities that make them difficult to handle properly. I think it could be done succinctly with walks, but I will leave it out and document it for now.

You'll get this warning for the cross-refs, letting you know that the expected cell-output-display structure is not there:

need 2 cell-output-display for renderings light,dark; got 0

No warning for the caption, but it will only show in light mode.

@gordonwoodhull gordonwoodhull force-pushed the feature/cell-light-dark-renderings branch from 0ed3bf1 to be24adb Compare March 13, 2025 20:20
@gordonwoodhull gordonwoodhull marked this pull request as ready for review March 13, 2025 20:21
@gordonwoodhull gordonwoodhull force-pushed the feature/cell-light-dark-renderings branch from be24adb to 587dbbc Compare March 13, 2025 20:45
@gordonwoodhull

This comment was marked as resolved.

a filter to detect e.g. renderings: [light, dark]

retain any cell content before the first cell-output-display
then any div.cell-output-display are given the rendering names

formats choose what to do with these in the filter
currently HTML uses light and dark and classes them .light-content and .dark-content
and the other formats just use light rendering

applies body.quarto-light or body.quarto-dark based on default theme
for a decent NoJS experience
@gordonwoodhull gordonwoodhull force-pushed the feature/cell-light-dark-renderings branch from d59b6d3 to e90cddc Compare March 14, 2025 05:42
@gordonwoodhull gordonwoodhull merged commit 1abab5b into main Mar 14, 2025
49 checks passed
@gordonwoodhull gordonwoodhull deleted the feature/cell-light-dark-renderings branch March 14, 2025 06:35
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.

2 participants