Dashboard Redesign (#48)

* feat: add user_template setting

* style: header

* style: page padding

* style: header

* feat: header now time

* style: login page

* feat: nav indicator

* style: button inset shadow

* style: footer text size

* feat: header show login_ip

* fix: error toast

* fix: frontend_templates setting

* fix: lint

* feat: pr auto format

* chore: auto-fix linting and formatting issues

---------

Co-authored-by: hamster1963 <hamster1963@users.noreply.github.com>

src/hooks/useMediaQuery.tsx

@@ -1,19 +1,19 @@
 import * as React from "react"
 
 export function useMediaQuery(query: string) {
-  const [value, setValue] = React.useState(false)
+    const [value, setValue] = React.useState(false)
 
-  React.useEffect(() => {
-    function onChange(event: MediaQueryListEvent) {
-      setValue(event.matches)
-    }
+    React.useEffect(() => {
+        function onChange(event: MediaQueryListEvent) {
+            setValue(event.matches)
+        }
 
-    const result = matchMedia(query)
-    result.addEventListener("change", onChange)
-    setValue(result.matches)
+        const result = matchMedia(query)
+        result.addEventListener("change", onChange)
+        setValue(result.matches)
 
-    return () => result.removeEventListener("change", onChange)
-  }, [query])
+        return () => result.removeEventListener("change", onChange)
+    }, [query])
 
-  return value
+    return value
 }