Sidebar styling

src/components/Dashboard/Wrappers/Sidebar/Sidebar.tsx

@@ -1,5 +1,6 @@
 import { Card } from '@mantine/core';
 import { RefObject } from 'react';
+import { useCardStyles } from '../../../layout/useCardStyles';
 import { useGridstack } from '../gridstack/use-gridstack';
 import { WrapperContent } from '../WrapperContent';
 
@@ -11,16 +12,13 @@ export const DashboardSidebar = ({ location }: DashboardSidebarProps) => {
   const { refs, apps, widgets } = useGridstack('sidebar', location);
 
   const minRow = useMinRowForFullHeight(refs.wrapper);
+  const {
+    cx,
+    classes: { card: cardClass },
+  } = useCardStyles(false);
 
   return (
-    <Card
-      withBorder
-      w={300}
-      style={{
-        background: 'none',
-        borderStyle: 'dashed',
-      }}
-    >
+    <Card withBorder w={300} p={0} radius="lg" className={cardClass}>
       <div
         className="grid-stack grid-stack-sidebar"
         style={{ transitionDuration: '0s', height: '100%' }}