pradyunsg / furo

A clean customizable documentation theme for Sphinx
https://pradyunsg.me/furo/quickstart
MIT License
2.65k stars 304 forks source link

Set overflow-wrap on headings to fix long words breaking the layout #670

Closed Eric-Arellano closed 1 year ago

Eric-Arellano commented 1 year ago

Before:

Screenshot 2023-06-20 at 3 41 34 PM

After:

Screenshot 2023-06-20 at 3 41 10 PM

This is particularly a problem for generated API docs from autodoc since the headers can get quite long.

Eric-Arellano commented 1 year ago

Turns out it's necessary to also set this for a and p. We had some long links in Qiskit docs that broke the layout similar to the PR description. But, it's not necessary for tables thanks to the horizontal scroll. So, we ended up with this SCSS:

h1,
h2,
h3,
h4,
h5,
h6,
p:not(table p),
a:not(table a) {
  overflow-wrap: break-word;
  word-break: break-word;
}

I'm not sure where those rules for p and a would belong in Furo's Sass file layout. (In qiskit-sphinx-theme, we have _layout.scss)

pradyunsg commented 1 year ago

https://github.com/pradyunsg/furo/commit/c8b51d09af3dcaac3046f7e761119e9d1b7c9e37 resolves this. Thanks for filing this PR and flagging this! ^.^