feat: overhaul webui (#135)

feat: Added Inter Variable as the default font

feat: Added a pattern to the page background.

fix(react-multi-select-component): Made the multiselect components theme-agnostic, so it works properly with the light theme now.

fix(react-select): Made the components fix the default 30px height of the rest of the input components.

fix(useToggle): Fixed a bug where the toggle didn't work due to useCallback memoizing a callback with the old value.
refactor(Base):
- Added small theme-primary gradient to the beginning of the header.
- Made the splitter border theme-agnostic.
- Increased logo size a bit.
- Moved the links a bit closer to the logo.
- Updated the default link style to look more stylish.
- Added a link to the autobrr Docs section (currently defaults to the Indexers sections, but this should lead to an "Overview" page for configuring autobrr)
- Adapted the user dropdown to match the other header links' stylesheets and removed the annoying ring focus.
- Adapted the header for theme-agnostic mobile usage.
- Removed the negative padding/margin hacks.

refactor(StatsItem): Increased shadow size/strength and made the description text a bit lighter on the dark theme.

refactor(Dashboard): Increased the heading text sizes.

refactor(Logs, Releases, Settings, Login, filters/details, filters/list): Adapted to match the previous changes and improved theme compatibility with regards to text.

refactor(RegexPlayground): Fixed match highlight for JS regex.

web/src/screens/Logs.tsx

@@ -30,15 +30,15 @@ export default function Logs() {
     }, [setLogs]);
 
     return (
-        <main className="-mt-48">
+        <main>
             <header className="py-10">
                 <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-                    <h1 className="text-3xl font-bold text-white capitalize">Logs</h1>
+                    <h1 className="text-3xl font-bold text-black dark:text-white capitalize">Logs</h1>
                 </div>
             </header>
             <div className="max-w-7xl mx-auto pb-12 px-2 sm:px-4 lg:px-8">
-                <div className="bg-white dark:bg-gray-800 rounded-lg shadow px-2 sm:px-4 py-3 sm:py-4">
-                    <div className=" overflow-y-auto p-2 rounded-lg h-96 bg-gray-900">
+                <div className="bg-white dark:bg-gray-800 rounded-lg shadow-lg px-2 sm:px-4 py-3 sm:py-4">
+                    <div className=" overflow-y-auto p-2 rounded-lg h-96 bg-gray-100 dark:bg-gray-900">
                         {logs.map((a, idx) => (
                             <p key={idx}>
                                 <span className="font-mono text-gray-600 mr-2">{a.time}</span>