emotion: Margins

aslilac · aslilac · commit 8f28843e4ac7 · 2023-10-09T21:29:56.000Z
diff --git a/site/src/components/Margins/Margins.tsx b/site/src/components/Margins/Margins.tsx
@@ -1,6 +1,4 @@
-import { makeStyles } from "@mui/styles";
-import { FC } from "react";
-import { combineClasses } from "utils/combineClasses";
+import { type FC } from "react";
 import {
   containerWidth,
   containerWidthMedium,
@@ -15,24 +13,20 @@ const widthBySize: Record<Size, number> = {
   small: containerWidth / 3,
 };
 
-const useStyles = makeStyles(() => ({
-  margins: {
-    margin: "0 auto",
-    maxWidth: ({ maxWidth }: { maxWidth: number }) => maxWidth,
-    padding: `0 ${sidePadding}px`,
-    width: "100%",
-  },
-}));
-
 export const Margins: FC<JSX.IntrinsicElements["div"] & { size?: Size }> = ({
   size = "regular",
   ...divProps
 }) => {
-  const styles = useStyles({ maxWidth: widthBySize[size] });
+  const maxWidth = widthBySize[size];
   return (
     <div
       {...divProps}
-      className={combineClasses([styles.margins, divProps.className])}
+      css={{
+        margin: "0 auto",
+        maxWidth: maxWidth,
+        padding: `0 ${sidePadding}px`,
+        width: "100%",
+      }}
     />
   );
 };
