Refactor usage of Browser specific APIs within a Hook

[ovflowd]

As rule-of-hooks (from React) and general best practices, React Components should not be aware of contexts outside of the Component. (Eg.: global variables). This also includes `window, document, navigator, et cetera).

The reasoning is that within some environments (Unit Testing without Jest DOM, Server-Side Rendering, Node.js) those variables will not be available, and their results/expectancies will not be fulfilled.

The idea is to create a Hook that handles those Browser API calls. We already have one for media queries, which is the useMediaQuery.

The goal of this issue is to have one hook per specific task. Eg.:

• A hook for setting the color-schema of the document.documentElement
• A hook for localStorage (and a fake localStorage when the real doesn't exist)
• A hook for when clicking outside of the React Element
• And others as needed.