UPDATE: design adjustments in 'File' menu
This commit is contained in:
committed by
Nicolás Hatcher Andrés
parent
4b806c357a
commit
85cd7ab6a3
@@ -1,6 +1,6 @@
|
|||||||
import styled from "@emotion/styled";
|
import styled from "@emotion/styled";
|
||||||
import { Menu, MenuItem, Modal } from "@mui/material";
|
import { Menu, MenuItem, Modal } from "@mui/material";
|
||||||
import { FileDown, FileUp, Plus, Trash2 } from "lucide-react";
|
import { FileDown, FileUp, Plus, Trash2, Check } from "lucide-react";
|
||||||
import { useRef, useState } from "react";
|
import { useRef, useState } from "react";
|
||||||
import { UploadFileDialog } from "./UploadFileDialog";
|
import { UploadFileDialog } from "./UploadFileDialog";
|
||||||
import { getModelsMetadata, getSelectedUuid } from "./storage";
|
import { getModelsMetadata, getSelectedUuid } from "./storage";
|
||||||
@@ -29,9 +29,9 @@ export function FileMenu(props: {
|
|||||||
setMenuOpen(false);
|
setMenuOpen(false);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<span style={{ width: "20px" }}>
|
<CheckIndicator>
|
||||||
{uuid === selectedUuid ? "•" : ""}
|
{uuid === selectedUuid ? <StyledCheck /> : ""}
|
||||||
</span>
|
</CheckIndicator>
|
||||||
<MenuItemText
|
<MenuItemText
|
||||||
style={{
|
style={{
|
||||||
maxWidth: "240px",
|
maxWidth: "240px",
|
||||||
@@ -149,6 +149,13 @@ const StyledTrash = styled(Trash2)`
|
|||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
const StyledCheck = styled(Check)`
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
color: #333333;
|
||||||
|
padding-right: 10px;
|
||||||
|
`;
|
||||||
|
|
||||||
const MenuDivider = styled("div")`
|
const MenuDivider = styled("div")`
|
||||||
width: 80%;
|
width: 80%;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
@@ -182,3 +189,9 @@ const FileMenuWrapper = styled("div")`
|
|||||||
background-color: #f2f2f2;
|
background-color: #f2f2f2;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
const CheckIndicator = styled("span")`
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
min-width: 26px;
|
||||||
|
`;
|
||||||
|
|||||||
Reference in New Issue
Block a user