mirror of
https://github.com/aykhans/slash-e.git
synced 2025-04-18 21:19:44 +00:00
chore: update shortcut header style
This commit is contained in:
parent
07d6492a6f
commit
1792ca1272
@ -61,9 +61,7 @@ const ShortcutView = (props: Props) => {
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<button className="items-center 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>
|
||||||
s<span className="font-mono">/</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}>
|
<a className="hidden group-hover:block ml-1 cursor-pointer hover:opacity-80" target="_blank" href={shortcut.link}>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { Button, Option, Select } from "@mui/joy";
|
import { Button, Tab, TabList, Tabs } from "@mui/joy";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { shortcutService } from "../services";
|
import { shortcutService } from "../services";
|
||||||
import { useAppSelector } from "../stores";
|
import { useAppSelector } from "../stores";
|
||||||
@ -37,19 +37,23 @@ const Home: React.FC = () => {
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="mx-auto max-w-4xl w-full px-3 py-6 flex flex-col justify-start items-start">
|
<div className="mx-auto max-w-4xl w-full px-3 py-6 flex flex-col justify-start items-start">
|
||||||
|
<div className="w-full flex flex-row justify-start items-center mb-4">
|
||||||
|
<span className="font-mono text-gray-400 mr-2">Shortcuts</span>
|
||||||
|
</div>
|
||||||
<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>
|
<Tabs defaultValue={"ALL"} size="sm" onChange={(_, value) => setSelectFilter(value as any)}>
|
||||||
|
<TabList>
|
||||||
|
<Tab value={"ALL"}>All</Tab>
|
||||||
|
<Tab value={"PRIVATE"}>Mine</Tab>
|
||||||
|
</TabList>
|
||||||
|
</Tabs>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
<Button variant="soft" size="sm" onClick={() => setShowCreateShortcutDialog(true)}>
|
<Button variant="soft" size="sm" onClick={() => setShowCreateShortcutDialog(true)}>
|
||||||
<Icon.Plus className="w-5 h-auto" /> New
|
<Icon.Plus className="w-5 h-auto" /> New
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
<Select defaultValue={"ALL"} onChange={(_, value) => setSelectFilter(value as any)}>
|
|
||||||
<Option value={"ALL"}>All</Option>
|
|
||||||
<Option value={"PRIVATE"}>Mine</Option>
|
|
||||||
</Select>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{loadingState.isLoading ? (
|
{loadingState.isLoading ? (
|
||||||
<div className="py-12 w-full flex flex-row justify-center items-center opacity-80">
|
<div className="py-12 w-full flex flex-row justify-center items-center opacity-80">
|
||||||
|
Loading…
x
Reference in New Issue
Block a user