aykhans/slash-e
1
0
Fork 0
mirror of https://github.com/aykhans/slash-e.git synced 2025-04-18 21:19:44 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: update shortcut view style

Browse Source
This commit is contained in:
Steven 2023-06-28 00:17:35 +08:00
parent 2a9d601df2
commit eee4976fba
2 changed files with 7 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
web/src/components/ShortcutView.tsx
View File

@ -54,7 +54,7 @@ const ShortcutView = (props: Props) => {
return ( return (
<div className="w-full flex flex-col justify-start items-start border px-4 py-3 mb-2 rounded-lg hover:shadow"> <div className="w-full flex flex-col justify-start items-start border px-4 py-3 mb-2 rounded-lg hover:shadow">
<div className="w-full flex flex-row justify-between items-center"> <div className="w-full flex flex-row justify-between items-center">
<div className="flex flex-row justify-normal items-center text-lg mr-1 shrink-0"> <div className="group flex flex-row justify-start items-center mr-1 shrink-0">
<div className="w-6 h-6 mr-1.5 flex justify-center items-center overflow-clip"> <div className="w-6 h-6 mr-1.5 flex justify-center items-center overflow-clip">
{favicon ? ( {favicon ? (
<img className="w-[90%] h-auto rounded-full" src={favicon} decoding="async" loading="lazy" /> <img className="w-[90%] h-auto rounded-full" src={favicon} decoding="async" loading="lazy" />
@ -62,24 +62,17 @@ const ShortcutView = (props: Props) => {
<Icon.Globe2 className="w-5 h-auto text-gray-500" /> <Icon.Globe2 className="w-5 h-auto text-gray-500" />
)} )}
</div> </div>
<button className="cursor-pointer hover:opacity-80" onClick={() => handleCopyButtonClick(shortcut)}> <button className="items-center cursor-pointer hover:opacity-80" onClick={() => handleCopyButtonClick(shortcut)}>
<span className="text-gray-400"> <span className="text-gray-400">
s<span className="font-mono">/</span> s<span className="font-mono">/</span>
</span> </span>
{shortcut.name} {shortcut.name}
</button> </button>
<a className="hidden group-hover:block ml-1 cursor-pointer hover:opacity-80" target="_blank" href={shortcut.link}>
<Icon.ExternalLink className="w-4 h-auto text-gray-500" />
</a>
</div> </div>
<div className="flex flex-row justify-end items-center space-x-2"> <div className="flex flex-row justify-end items-center space-x-2">
<Tooltip title="Copy link" variant="solid" placement="top" arrow>
<button className="cursor-pointer hover:opacity-80" onClick={() => handleCopyButtonClick(shortcut)}>
<Icon.Copy className="w-5 h-auto text-gray-600" />
</button>
</Tooltip>
<Tooltip title="Go to link" variant="solid" placement="top" arrow>
<a className="cursor-pointer hover:opacity-80" target="_blank" href={shortcut.link}>
<Icon.ExternalLink className="w-5 h-auto text-gray-600" />
</a>
</Tooltip>
{havePermission && ( {havePermission && (
<Dropdown <Dropdown
actionsClassName="!w-24" actionsClassName="!w-24"

4
web/src/components/common/Dropdown.tsx
View File

@ -37,8 +37,8 @@ const Dropdown: React.FC<Props> = (props: Props) => {
{trigger ? ( {trigger ? (
trigger trigger
) : ( ) : (
<button className="flex flex-row justify-center items-center rounded text-gray-600 cursor-pointer hover:opacity-80"> <button className="flex flex-row justify-center items-center rounded text-gray-400 cursor-pointer hover:text-gray-500">
<Icon.MoreVertical className="w-5 h-auto" /> <Icon.MoreVertical className="w-4 h-auto" />
</button> </button>
)} )}
<div <div