* Use `white-space: pre-wrap` for code formatting
Apparently code formatting is used for the entire user comments. Use
`white-space: pre-wrap` to avoid horizontal scrolling of the plaintext
description.
see 7d4038829e
* Unify `highlight_php()` with PhD
see php/phd@01d6beb366
* Fix markup for notes in add-note.php
If a parameter has no target to scroll to, it should not suggest
otherwise by changing the cursor to a pointer. Since the scrolling is
done via JS, we should also change the cursor via JS.[1]
While we're at it, we also fix the potential JS error where we call the
`.offset()` method on an empty `jQuery` object.
[1] <https://github.com/php/doc-en/issues/2071#issuecomment-1354497367>
The following changes are made in this commit:
**(1)** Add the WOFF2 variant of web fonts. [WOFF2 standard](https://w3c.github.io/woff/woff2/) reduces the file sizes significantly. This is important to make our website more accessible to folks with limited Internet connections.
96% of browsers support WOFF2 ([source](https://caniuse.com/?search=woff2)) and we still have WOFF and TTF/OTF/EOT formats for those edge-cases which don't support it.
Real examples of the file size reductions for php.net:
```
Fira Sans Regular: 183 KB (woff) -> 129 KB (woff2) --> 30% reduction in size
Fira Mono Regular: 87 KB (woff) -> 65 KB (woff2) --> 35% reduction in size
```
**(2)** Use `font-display: swap` for web fonts (see [MDN Docs for font-display](https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display))
This is recommended to not block the rendering the page for a long time if the web font is not available. Again, this is important for folks with suboptimal network connections.
The `swap` value is also the default option in popular font services like [Google Fonts](https://fonts.google.com/).
**(3)** Update the list of alternative font families.
I updated the sans-serif and mono font stack used in the design. The new stacks are much longer (not a problem in practice thanks to CSS variables) but they cover all common browsing devices (including smartphones). I crafted the list from the recommended font stacks of the most popular CSS frameworks and the most popular websites for developers.
PhD no longer renders NBSPs, but regular spaces instead[1]. To retain
the desired indentation, we set the CSS propery `white-space:pre`.
However, we cannot do that for the `.phpcode` class directly, because
`highlight_string()` emits additional line breaks at the top and the
bottom of the examples, so we use a more specific selector to avoid
this "padding".
[1] <87f794bafe>