Add paper component

src/renderer/components/paper/index.tsx

@@ -0,0 +1,17 @@
+import styled from '@emotion/styled';
+import {
+  Paper as MantinePaper,
+  PaperProps as MantinePaperProps,
+} from '@mantine/core';
+
+export interface PaperProps extends MantinePaperProps {
+  children: React.ReactNode;
+}
+
+const StyledPaper = styled(MantinePaper)`
+  background: var(--paper-bg);
+`;
+
+export const Paper = ({ children, ...props }: PaperProps) => {
+  return <StyledPaper {...props}>{children}</StyledPaper>;
+};

src/renderer/themes/default.scss

@@ -66,6 +66,8 @@
   --toast-description-fg: rgb(193, 194, 197);
   --toast-bg: rgb(16, 16, 16);
 
+  --paper-bg: rgb(29, 29, 29);
+
   .ag-theme-alpine-dark {
     --ag-borders: none;
     --ag-background-color: #101010;