usememos/memos
1
1
Fork 0
mirror of https://github.com/usememos/memos.git synced 2024-12-24 11:44:44 +03:00
Code Issues Packages Projects Releases Wiki Activity

chore: update memo editor styles

Browse Source
This commit is contained in:
Steven 2023-10-29 23:59:23 +08:00
parent c26417de70
commit 97190645cc
1 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
web/src/components/MemoEditor/index.tsx
View File

@ -1,4 +1,4 @@
import { Select, Option, Button, IconButton } from "@mui/joy"; import { Select, Option, Button, IconButton, Divider } from "@mui/joy";
import { isNumber, last, uniq, uniqBy } from "lodash-es"; import { isNumber, last, uniq, uniqBy } from "lodash-es";
import React, { useCallback, useEffect, useMemo, useRef, useState } from "react"; import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { toast } from "react-hot-toast"; import { toast } from "react-hot-toast";
@ -424,23 +424,26 @@ const MemoEditor = (props: Props) => {
<div className="flex flex-row justify-start items-center"> <div className="flex flex-row justify-start items-center">
<TagSelector onTagSelectorClick={(tag) => handleTagSelectorClick(tag)} /> <TagSelector onTagSelectorClick={(tag) => handleTagSelectorClick(tag)} />
<IconButton <IconButton
onClick={handleUploadFileBtnClick}
className="flex flex-row justify-center items-center p-1 w-auto h-auto mr-1 select-none rounded cursor-pointer text-gray-600 dark:text-gray-400 hover:bg-gray-300 dark:hover:bg-zinc-800 hover:shadow" className="flex flex-row justify-center items-center p-1 w-auto h-auto mr-1 select-none rounded cursor-pointer text-gray-600 dark:text-gray-400 hover:bg-gray-300 dark:hover:bg-zinc-800 hover:shadow"
onClick={handleUploadFileBtnClick}
> >
<Icon.Image className="w-5 h-5 mx-auto" /> <Icon.Image className="w-5 h-5 mx-auto" />
</IconButton> </IconButton>
<IconButton <IconButton
onClick={handleAddMemoRelationBtnClick}
className="flex flex-row justify-center items-center p-1 w-auto h-auto mr-1 select-none rounded cursor-pointer text-gray-600 dark:text-gray-400 hover:bg-gray-300 dark:hover:bg-zinc-800 hover:shadow" className="flex flex-row justify-center items-center p-1 w-auto h-auto mr-1 select-none rounded cursor-pointer text-gray-600 dark:text-gray-400 hover:bg-gray-300 dark:hover:bg-zinc-800 hover:shadow"
onClick={handleAddMemoRelationBtnClick}
> >
<Icon.Link className="w-5 h-5 mx-auto" /> <Icon.Link className="w-5 h-5 mx-auto" />
</IconButton> </IconButton>
<IconButton onClick={handleCheckBoxBtnClick}> <IconButton
className="flex flex-row justify-center items-center p-1 w-auto h-auto mr-1 select-none rounded cursor-pointer text-gray-600 dark:text-gray-400 hover:bg-gray-300 dark:hover:bg-zinc-800 hover:shadow"
onClick={handleCheckBoxBtnClick}
>
<Icon.CheckSquare className="w-5 h-5 mx-auto" /> <Icon.CheckSquare className="w-5 h-5 mx-auto" />
</IconButton> </IconButton>
<IconButton <IconButton
onClick={handleCodeBlockBtnClick}
className="flex flex-row justify-center items-center p-1 w-auto h-auto mr-1 select-none rounded cursor-pointer text-gray-600 dark:text-gray-400 hover:bg-gray-300 dark:hover:bg-zinc-800 hover:shadow" className="flex flex-row justify-center items-center p-1 w-auto h-auto mr-1 select-none rounded cursor-pointer text-gray-600 dark:text-gray-400 hover:bg-gray-300 dark:hover:bg-zinc-800 hover:shadow"
onClick={handleCodeBlockBtnClick}
> >
<Icon.Code className="w-5 h-5 mx-auto" /> <Icon.Code className="w-5 h-5 mx-auto" />
</IconButton> </IconButton>
@ -448,7 +451,8 @@ const MemoEditor = (props: Props) => {
</div> </div>
<ResourceListView resourceList={state.resourceList} setResourceList={handleSetResourceList} /> <ResourceListView resourceList={state.resourceList} setResourceList={handleSetResourceList} />
<RelationListView relationList={referenceRelations} setRelationList={handleSetRelationList} /> <RelationListView relationList={referenceRelations} setRelationList={handleSetRelationList} />
<div className="w-full flex flex-row justify-between items-center py-3 mt-2 border-t border-t-gray-100 dark:border-t-zinc-500"> <Divider className="!mt-2" />
<div className="w-full flex flex-row justify-between items-center py-3 dark:border-t-zinc-500">
<div className="relative flex flex-row justify-start items-center" onFocus={(e) => e.stopPropagation()}> <div className="relative flex flex-row justify-start items-center" onFocus={(e) => e.stopPropagation()}>
<Select <Select
variant="plain" variant="plain"