* Improve \sqrt
Make \sqrt out of inline SVGs to ensure a perfect match at the junction between surd and viniculum.
* Tweak for kern clarity
* Fix lint error
* regenerate screenshot tests with sqrts
* Correct advance
Edit the SVG paths so that they have the correct left bearing and advance width values.
This will correct the spacing on the left side of each surd and it will also improve the placment of a root indice.
* Revise scriptstyle surds
In the `main` size, delimiters *do* scale with scriptstyle and scriptscriptstyle.
* update screenshot images containing sqrts
* Use inline SVG for stretchy elements
Replace all background-images with inline SVG code.
Pros:
* `\color` works in all browsers, even IE/Edge
* Better printing
* Much simpler CSS
* No links to background-images
* No `mask`
* No browser-detection
* No external SVG files
* Faster first rendering
Cons
* No image caching
* Heavier HTML load
* Larger JavaScript file
* `\cancel` line is in `px` units, not `em` units
* Remove static/images from make file
* Change \cancel from px to em
* regenerate screenshots for functions using inline svg
TeX and CSS treat line heights in fundamentally different ways. In
TeX, every character is treated as a box of its precise height and
depth; the line height (\baselineskip) applies after characters have
been assembled into lines. In CSS, in contrast, every character
creates a "line box" corresponding to the accompanying font. When
characters of different fonts and sizes are placed into the same
span, the resulting line box contains the line boxes of all children.
This is unfortunate because, for example, we want `\frac{1}{2}` to
behave in vertical spacing contexts like it is exactly as tall and
deep as the visible fraction (which is the TeX behavior). Given CSS
constraints, though, in most contexts the fraction has extra vertical
space: the line boxes for the numerator and denominator create
padding. For small boxes, this isn't so bad. To really see the
problem put a tall rule in the denominator of a fraction, or check
out the VerticalSpacing screenshotter test, which has way more space
than it should.
Solving this problem in CSS is difficult. There is no easy way to get
rid of the extra line boxes.
But there is *a* way, namely tables. A table-cell with vertical-align
top, bottom, or middle is ignored for the purposes of line height
calculation.
So in this commit, makeVList puts its contents into a
vertical-align:bottom table-cell (to clear unwanted line boxes), with
an extra row used to represent depth.
Many Chrome screenshotter tests change. This is because Chrome rounds
table dimensions to integral numbers of pixels, while it uses
sub-pixel positioning for non-table displayed tabs. That makes many
vlists a fraction of a pixel wider than they used to be.
