Migrate to Mantine v8 and Design Changes (#961)

* mantine v8 migration

* various design changes and improvements

src/shared/components/divider/divider.module.css

@@ -0,0 +1,3 @@
+.root {
+    --divider-color: var(--theme-colors-border);
+}

src/shared/components/divider/divider.tsx

@@ -0,0 +1,19 @@
+import { Divider as MantineDivider, DividerProps as MantineDividerProps } from '@mantine/core';
+import { forwardRef } from 'react';
+
+import styles from './divider.module.css';
+
+export interface DividerProps extends MantineDividerProps {}
+
+export const Divider = forwardRef<HTMLDivElement, DividerProps>(
+    ({ classNames, style, ...props }, ref) => {
+        return (
+            <MantineDivider
+                classNames={{ root: styles.root, ...classNames }}
+                ref={ref}
+                style={{ ...style }}
+                {...props}
+            />
+        );
+    },
+);