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

feat: adjust buttons position

Browse Source
This commit is contained in:
Steven 2023-07-27 22:21:18 +08:00
parent b6839d2b7d
commit cee6c7c401
5 changed files with 13 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/FilterView.tsx
View File

@ -22,7 +22,7 @@ const FilterView = () => {
onClick={() => viewStore.setFilter({ tag: undefined })} onClick={() => viewStore.setFilter({ tag: undefined })}
> >
<Icon.Tag className="w-4 h-auto mr-1" /> <Icon.Tag className="w-4 h-auto mr-1" />
<span className="max-w-[12rem] truncate">#{filter.tag}</span> <span className="max-w-[8rem] truncate">#{filter.tag}</span>
<Icon.X className="w-4 h-auto ml-1" /> <Icon.X className="w-4 h-auto ml-1" />
</button> </button>
)} )}

2
web/src/components/Navigator.tsx
View File

@ -36,7 +36,7 @@ const Navigator = () => {
variant={currentTab === `tag:${tag}` ? "solid" : "plain"} variant={currentTab === `tag:${tag}` ? "solid" : "plain"}
color="neutral" color="neutral"
size="sm" size="sm"
onClick={() => viewStore.setFilter({ tab: `tag:${tag}` })} onClick={() => viewStore.setFilter({ tab: `tag:${tag}`, tag: undefined })}
> >
<Icon.Hash className="w-4 h-auto mr-1" /> <Icon.Hash className="w-4 h-auto mr-1" />
<span className="max-w-[8rem] truncate font-normal">{tag}</span> <span className="max-w-[8rem] truncate font-normal">{tag}</span>

3
web/src/components/OrderSetting.tsx
View File

@ -17,10 +17,11 @@ const OrderSetting = () => {
return ( return (
<Dropdown <Dropdown
trigger={ trigger={
<button className="p-1 mr-2"> <button className="p-1">
<Icon.ListFilter className="w-5 h-auto text-gray-500" /> <Icon.ListFilter className="w-5 h-auto text-gray-500" />
</button> </button>
} }
actionsClassName="right-10 translate-x-full"
actions={ actions={
<div className="w-52 p-2 pt-0 gap-2 flex flex-col justify-start items-start" onClick={(e) => e.stopPropagation()}> <div className="w-52 p-2 pt-0 gap-2 flex flex-col justify-start items-start" onClick={(e) => e.stopPropagation()}>
<div className="w-full flex flex-row justify-between items-center mt-1"> <div className="w-full flex flex-row justify-between items-center mt-1">

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

@ -135,7 +135,7 @@ const ShortcutView = (props: Props) => {
return ( return (
<span <span
key={tag} key={tag}
className="max-w-xs truncate text-gray-400 text-sm font-mono leading-4 cursor-pointer hover:text-gray-600" className="max-w-[8rem] truncate text-gray-400 text-sm font-mono leading-4 cursor-pointer hover:text-gray-600"
onClick={() => viewStore.setFilter({ tag: tag })} onClick={() => viewStore.setFilter({ tag: tag })}
> >
#{tag} #{tag}

16
web/src/pages/Home.tsx
View File

@ -47,15 +47,8 @@ const Home: React.FC = () => {
<Navigator /> <Navigator />
<div className="w-full flex flex-row justify-between items-center mb-4"> <div className="w-full flex flex-row justify-between items-center mb-4">
<div className="flex flex-row justify-start items-center"> <div className="flex flex-row justify-start items-center">
<span className="font-mono text-gray-400 mr-2">Shortcuts</span>
<Button className="hover:shadow" variant="soft" size="sm" onClick={() => setShowCreateShortcutDialog(true)}>
<Icon.Plus className="w-5 h-auto" />
</Button>
</div>
<div className="flex flex-row justify-end items-center">
<OrderSetting />
<Input <Input
className="w-32" className="w-32 mr-2"
type="text" type="text"
size="sm" size="sm"
placeholder="Search" placeholder="Search"
@ -66,6 +59,13 @@ const Home: React.FC = () => {
value={filter.search} value={filter.search}
onChange={(e) => viewStore.setFilter({ search: e.target.value })} onChange={(e) => viewStore.setFilter({ search: e.target.value })}
/> />
<OrderSetting />
</div>
<div className="flex flex-row justify-end items-center">
<Button className="hover:shadow" variant="soft" size="sm" onClick={() => setShowCreateShortcutDialog(true)}>
<Icon.Plus className="w-5 h-auto" />
<span className="hidden sm:block ml-0.5">Create</span>
</Button>
</div> </div>
</div> </div>
<FilterView /> <FilterView />