From 69bf77cba042b5a9d5e7d1f6bfd7dd7dae79c029 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Thu, 9 Mar 2023 18:46:30 +0800
Subject: [PATCH] Add menu trigger

---
 .../web/components/elements/MenuTrigger.tsx   | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 packages/web/components/elements/MenuTrigger.tsx

diff --git a/packages/web/components/elements/MenuTrigger.tsx b/packages/web/components/elements/MenuTrigger.tsx
new file mode 100644
index 000000000..4ec61eef5
--- /dev/null
+++ b/packages/web/components/elements/MenuTrigger.tsx
@@ -0,0 +1,27 @@
+import { DotsThreeVertical } from 'phosphor-react'
+import { theme } from '../tokens/stitches.config'
+import { Box } from './LayoutPrimitives'
+
+export function MenuTrigger(): JSX.Element {
+  return (
+    <Box
+      css={{
+        display: 'flex',
+        height: '20px',
+        width: '20px',
+        alignItems: 'center',
+        justifyContent: 'center',
+        borderRadius: '1000px',
+        '&:hover': {
+          bg: '#898989',
+        },
+      }}
+    >
+      <DotsThreeVertical
+        size={20}
+        color={theme.colors.thTextContrast2.toString()}
+        weight="bold"
+      />
+    </Box>
+  )
+}