rootstock icon indicating copy to clipboard operation
rootstock copied to clipboard

Figure caption hard to distinguish from normal text

Open phiresky opened this issue 4 years ago • 4 comments

Example: image

It's hard to see what's part of the figure and what isn't. I'd suggest the following style additions:

  figure {
    padding: 1ex;
    border: 1px solid gray;
  }
  figcaption {
    font-style: italic;
  }

example: image

As a comparison, in LaTeX the figure caption is indented to make it more clear and has more space to the text:

image

It would also be possible to do something similar to that with e.g.

figcaption {
margin-left: 5em;
text-indent: -5em;
}

though to make that perfect the HTML would probably have to be changed to a flexbox or a table.

phiresky avatar Jul 26 '21 16:07 phiresky

Modifying the figure display to better distinguish figure captions from text makes sense to me. I prefer the box over the indentation, which adds a fair amount of whitespace.

@vincerubinetti what do you think?

agitter avatar Jul 27 '21 02:07 agitter

From an aesthetic pov, I can't condone the box. You can use that solution for your own manuscript, but I wouldn't make the change to rootstock.

The indent is okay (some whitespace will be necessary to visually distinguish the caption), but to make it align properly we would have to change the html output. The arrow button and "Figure X" elements would have to be in one container, and the figure title and paragraph text in another container. This would involve modifying the fig-nos plugin, the pandoc formatting, and/or the jump-to-first manubot plugin.

A simpler solution would be to just add some horizontal space on both sides, and maybe a little extra on the bottom:

image

figcaption {
  padding: 0 30px 10px 30px;
}

vincerubinetti avatar Aug 02 '21 15:08 vincerubinetti

If you really wanted a line, you could do this:

figure {
  border-bottom: solid 1px #bdbdbd;
  padding-bottom: 20px;
}

Basically giving the appearance of an <hr> below each figure.

image

vincerubinetti avatar Aug 02 '21 15:08 vincerubinetti

the version with padding looks pretty good to me as well

phiresky avatar Aug 03 '21 17:08 phiresky