usememos/memos
1
1
Fork 0
mirror of https://github.com/usememos/memos.git synced 2024-12-26 23:22:47 +08:00
Code Issues Projects Releases Packages Wiki Activity

chore: update memo content styles

Browse source
This commit is contained in:
Steven 2024-03-20 09:07:54 +08:00
parent 76c936357b
commit a3a4e37cb0
3 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
web/src/components/MemoContent/Code.tsx
View file

@ -3,7 +3,7 @@ interface Props {
} }
const Code: React.FC<Props> = ({ content }: Props) => { const Code: React.FC<Props> = ({ content }: Props) => {
return <code className="inline break-all px-1 rounded bg-gray-100 dark:bg-zinc-700">{content}</code>; return <code className="inline break-all px-1 font-mono rounded bg-gray-100 dark:bg-zinc-700">{content}</code>;
}; };
export default Code; export default Code;

4
web/src/components/MemoView.tsx
View file

@ -76,13 +76,13 @@ const MemoView: React.FC<Props> = (props: Props) => {
return ( return (
<div <div
className={classNames( className={classNames(
"group relative flex flex-col justify-start items-start w-full px-4 pt-4 pb-3 mb-2 gap-2 bg-white dark:bg-zinc-800 rounded-lg border border-white dark:border-zinc-800 hover:border-gray-200 dark:hover:border-zinc-700", "group relative flex flex-col justify-start items-start w-full px-4 py-3 mb-2 gap-2 bg-white dark:bg-zinc-800 rounded-lg border border-white dark:border-zinc-800 hover:border-gray-200 dark:hover:border-zinc-700",
memo.pinned && props.showPinned && "border-gray-200 border dark:border-zinc-700", memo.pinned && props.showPinned && "border-gray-200 border dark:border-zinc-700",
className, className,
)} )}
ref={memoContainerRef} ref={memoContainerRef}
> >
<div className="w-full h-7 flex flex-row justify-between items-center gap-2"> <div className="w-full flex flex-row justify-between items-center gap-2">
<div className="w-auto max-w-[calc(100%-8rem)] grow flex flex-row justify-start items-center"> <div className="w-auto max-w-[calc(100%-8rem)] grow flex flex-row justify-start items-center">
{creator && ( {creator && (
<div className="w-full flex flex-row justify-start items-center"> <div className="w-full flex flex-row justify-start items-center">

12
web/src/pages/UserProfile.tsx
View file

@ -121,13 +121,15 @@ const UserProfile = () => {
{t("common.share")} {t("common.share")}
</Button> </Button>
</div> </div>
<div className="w-full flex flex-row justify-start items-center pt-4 pb-8 px-3"> <div className="w-full flex flex-col justify-start items-start pt-4 pb-8 px-3">
<UserAvatar className="!w-16 !h-16 drop-shadow mr-3 rounded-3xl" avatarUrl={user?.avatarUrl} /> <UserAvatar className="!w-16 !h-16 drop-shadow rounded-3xl" avatarUrl={user?.avatarUrl} />
<div className="w-auto max-w-[calc(100%-6rem)] flex flex-col justify-center items-start"> <div className="mt-2 w-auto max-w-[calc(100%-6rem)] flex flex-col justify-center items-start">
<p className="w-full text-4xl text-black leading-tight opacity-80 dark:text-gray-200 truncate"> <p className="w-full text-3xl text-black leading-tight opacity-80 dark:text-gray-200 truncate">
{user.nickname || user.username} {user.nickname || user.username}
</p> </p>
<p className="w-full text-gray-500 opacity-80 dark:text-gray-400 truncate">{user.description}</p> <p className="w-full text-gray-500 leading-snug opacity-80 dark:text-gray-400 whitespace-pre-wrap truncate line-clamp-6">
{user.description}
</p>
</div> </div>
</div> </div>
<MemoFilter className="px-2 pb-3" /> <MemoFilter className="px-2 pb-3" />