RFR: 8316159: Update BoxLayout sample image for crispier edges

[Alexey Ivanov]

**Problem**

On a standard display with the scale of 100%, the BoxLayout sample has blurred edges.

It is the result of how SVG is rendered: the strokes fall between the pixel grid, therefore a 1-pixel wide stroke is blurred between the previous and the following pixels with 50% of colour on each pixel. It doesn't look as good.

**Fix**

Move all rectangles half a pixel to make edges crisp. The edges of the rectangles look crisp in 100% and 200%.

For more information see answers to the following questions on Stack Overflow:

- [Why is my SVG line blurry or 2px in height when I specified 1px?](https://stackoverflow.com/a/34229584/572834)
- [Avoiding lines between adjacent SVG rectangles](https://stackoverflow.com/a/23376793/572834)

-------------

Commit messages:
 - 8316159: Update BoxLayout sample image for crispier edges

Changes: https://git.openjdk.org/jdk/pull/15703/files
 Webrev: https://webrevs.openjdk.org/?repo=jdk&pr=15703&range=00
  Issue: https://bugs.openjdk.org/browse/JDK-8316159
  Stats: 5 lines in 1 file changed: 0 ins; 0 del; 5 mod
  Patch: https://git.openjdk.org/jdk/pull/15703.diff
  Fetch: git fetch https://git.openjdk.org/jdk.git pull/15703/head:pull/15703

PR: https://git.openjdk.org/jdk/pull/15703