When a word (or any string withtout breakpoints (spaces, dashes....), making links the most common place where this becamoes an issue) is wider than its container, the text will simply overflow any container, including the viewport. This commit fixes this behaviour by making the word-drap strategy of the browser more aggresive.
The margin property can escape the parent node and move it alongside
its child. This happens with singlePage div and the body, resulting in
scrollbars appearing as the body has the size of the viewport but
does not align with it. This phenomenon can be always observed
in the vertical axis and it can also be observed in the horizontal axis
when the viewport it’s not wide enough (mostly in mobile).
Using paddings prevents this “extra space” from scraping and displacing
the body.
Also, the value 100vw does not take into account the space taken by the
vertical scrollbar, thus making the body wider than the actual viewport,
producing a horizontal scrollbar.
The fetchData function suffer from a race condition. If the function is
called before the promise finishes, it will result in another pair of
HTTP request. This does not only make the function useless but
Actually, it makes it harmful as the data might be redownloaded twice.
Now fetchData is not a function but rather the promise by itself.
Previous callers are expected to await the variable instead, this
should be not concern as awaiting a promise multiple time in
JavaScript is completely safe.
