refactor: update for design

unit-mesh · Dec 2, 2023 · c5ff598 · c5ff598
1 parent c5e755c
commit c5ff598
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 3 deletions.
diff --git a/editor/src/components/editor/editor.css b/editor/src/components/editor/editor.css
@@ -302,6 +302,37 @@
     background: var(--mauve-1);
     width: 160px;
     margin-top: 4px;
+    box-shadow: var(--black-a6) 0 3px 16px -5px, var(--black-a2) 0px 1px 3px;
+    border-radius: 4px;
+}
+
+.ask-ai-dropdown ul {
+    padding: 4px;
+}
+
+.ask-ai-dropdown .dropdown-item:hover {
+    background-color: var(--violet-9);
+    color: var(--violet-1);
+}
+
+.ask-ai-dropdown .dropdown-item svg {
+    position: absolute;
+    right: 8px;
+}
+
+.ask-ai-dropdown .dropdown-item {
+    font-size: 14px;
+    line-height: 1.4;
+    padding: 10px 5px;
+    color: var(--violet-11);
+    border-radius: 3px;
+    display: flex;
+    align-items: center;
+    position: relative;
+    user-select: none;
+    outline: none;
+    cursor: pointer;
+    background: #fff;
 }
 
 .toolbar-ai-button {

diff --git a/editor/src/components/editor/menu/menu-bubble.tsx b/editor/src/components/editor/menu/menu-bubble.tsx
@@ -63,12 +63,11 @@ export const MenuBubble = ({ editor }: {
 			</div>
 		</div>
 		<div className={'ask-ai-dropdown'}>
-			{isOpen && (<ul className="dropdown-menu">
+			{isOpen && (<ul>
 					{smartMenus?.map((menu, index) => {
 						return <li key={index}>
 							<Button
 								className="dropdown-item w-full"
-								variant={'outline'}
 								onClick={async () => {
 									setLoading(true)
 
@@ -91,7 +90,6 @@ export const MenuBubble = ({ editor }: {
 						return <li key={index}>
 							<Button
 								className="dropdown-item w-full"
-								variant={'outline'}
 								onClick={(event) => {
 									setIsOpen(false);
 									editor.chain().callLlm(menu);