kno10
commented
7 months ago width:50% is already a decent enough approximation of .5\linewidth (which is better to use than pagewidth even in tex)
CSS scale can break various things, unfortunately, so I try to avoid it where possible.
E.g., the jupyter editor component "codemirror" used by thebe does its own coordinate computations that are not aware of CSS transform - as unfortunately used by reveal.js to scale the entire slide - and this breaks various selection and highlighting: https://github.com/codemirror/codemirror5/issues/2443
For my use case, I only need this for images, and would prefer a solution that reads the size from the image file when processing the Markdown, scales the size, and puts the scaled size into the output HTML. The key problem is that I have images of different but consistent size, that I want to be rescaled consistently (so that font sizes and line widths agree), so I cannot use any of the percent scalings of CSS.
It was requested we add a scalebox-esque feature to allow users to simply scale up parts of a slide they deem too small.
The exact functionality is actually not possible to be implemented with the CSS transform operations as it explicitly does NOT modify the transformed block's bounding box while in LaTeX it does.
To achieve this, I added a bit of code in the
text-and-scalebranch that searches for DOM elements with the "scale" attribute.For each of these attributes you take the bounding box and scale it down to its actual size by dividing by the slide's zoom factor.
Then you multiply the original sizes by the scale factor.
Then you create a wrapper DOM element that gets the new size assigned to itself. The wrapper gets the original element which is then scaled up with the CSS transform. This should reflow the page according to the scaled up object's size.
The only issue I encountered are with inline elements and elements with margin: auto; that get wrapped in a scaled box. The previously centered elements have to be put into the default flow in order to have the scaling make sense.
I also added some classes to resize elements according to reveal's slide-width. Examples are in the back of the
text-style-deck.mdtest. (@kno10 allowing for exact LaTeX-like syntax like ".5\pagewidth" is not trivially realisable but you may want to look into width="calc(factor * var(--slide-width))")