chore: update memo relation style

This commit is contained in:
Steven
2024-01-21 11:22:25 +08:00
parent c38404b5d5
commit fae0b4e900
4 changed files with 16 additions and 20 deletions

View File

@ -40,7 +40,7 @@ const MemoRelationListView = (props: Props) => {
<div className="w-full mt-2 flex flex-row justify-start items-center flex-wrap gap-2">
{referencingMemoList.map((memo) => {
return (
<div key={memo.id} className="block w-auto max-w-[50%]">
<div key={memo.name} className="block w-auto max-w-[50%]">
<Link
className="px-2 border rounded-md w-auto text-sm leading-6 flex flex-row justify-start items-center flex-nowrap text-gray-600 dark:text-gray-400 dark:border-zinc-700 dark:bg-zinc-900 hover:shadow hover:opacity-80"
to={`/m/${memo.name}`}
@ -49,8 +49,7 @@ const MemoRelationListView = (props: Props) => {
<Tooltip title="Reference" placement="top">
<Icon.Link className="w-4 h-auto shrink-0 opacity-70" />
</Tooltip>
<span className="opacity-70 mx-1">#{memo.id}</span>
<span className="truncate">{memo.content}</span>
<span className="truncate ml-1">{memo.content}</span>
</Link>
</div>
);
@ -61,17 +60,16 @@ const MemoRelationListView = (props: Props) => {
<div className="w-full mt-2 flex flex-row justify-start items-center flex-wrap gap-2">
{referencedMemoList.map((memo) => {
return (
<div key={memo.id} className="block w-auto max-w-[50%]">
<div key={memo.name} className="block w-auto max-w-[50%]">
<Link
className="px-2 border rounded-md w-auto text-sm leading-6 flex flex-row justify-start items-center flex-nowrap text-gray-600 dark:text-gray-300 dark:border-gray-600 hover:shadow hover:opacity-80"
className="px-2 border rounded-md w-auto text-sm leading-6 flex flex-row justify-start items-center flex-nowrap text-gray-600 dark:text-gray-400 dark:border-zinc-700 dark:bg-zinc-900 hover:shadow hover:opacity-80"
to={`/m/${memo.name}`}
unstable_viewTransition
>
<Tooltip title="Backlink" placement="top">
<Icon.Milestone className="w-4 h-auto shrink-0 opacity-70" />
</Tooltip>
<span className="opacity-70 mx-1">#{memo.id}</span>
<span className="truncate">{memo.content}</span>
<span className="truncate ml-1">{memo.content}</span>
</Link>
</div>
);