Tiny UI tweaks

This commit is contained in:
Igor Katson 2023-12-17 10:34:35 +00:00
parent 55f3b23eed
commit ee307c11c5
No known key found for this signature in database
GPG key ID: B4EC22B66D61A3F5
8 changed files with 14 additions and 14 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -4,14 +4,14 @@
"src": "assets/logo.svg"
},
"index.css": {
"file": "assets/index-54ac219d.css",
"file": "assets/index-3adfdbb8.css",
"src": "index.css"
},
"index.html": {
"css": [
"assets/index-54ac219d.css"
"assets/index-3adfdbb8.css"
],
"file": "assets/index-7c5fc47e.js",
"file": "assets/index-1b48a174.js",
"isEntry": true,
"src": "index.html"
}

View file

@ -25,7 +25,7 @@ export const Button: React.FC<{
e.preventDefault();
onClick();
}}
className={`inline-flex items-center gap-1 border rounded-lg disabled:cursor-not-allowed px-2 py-1 transition-colors duration-300 dark:border-slate-700 ${variantClassNames} ${className}`}
className={`inline-flex items-center gap-1 border rounded-lg disabled:cursor-not-allowed px-2 py-1 dark:border-slate-700 ${variantClassNames} ${className}`}
>
{children}
</button>

View file

@ -42,9 +42,9 @@ export const FileInput = ({ className }: { className?: string }) => {
onClick={onClick}
data={file}
resetData={reset}
className={className}
className={`group ${className}`}
>
<CgFileAdd className="text-blue-500 dark:text-white" />
<CgFileAdd className="text-blue-500 group-hover:text-white dark:text-white" />
<div>Upload .torrent File</div>
</UploadButton>
</>

View file

@ -19,7 +19,7 @@ export const IconButton: React.FC<{
const colorClassName = color ? `text-${color}` : "";
return (
<a
className={`block p-1 ${colorClassName} ${className}`}
className={`block p-1 text-blue-500 ${colorClassName} ${className}`}
onClick={onClickStopPropagation}
href="#"
{...otherProps}

View file

@ -30,10 +30,10 @@ export const MagnetInput = ({ className }: { className?: string }) => {
setModalIsOpen(true);
}}
data={magnet}
className={className}
className={`group ${className}`}
resetData={() => setMagnet(null)}
>
<CgLink className="text-blue-500 dark:text-white" />
<CgLink className="text-blue-500 group-hover:text-white dark:text-white" />
<div>Add Torrent from Magnet / URL</div>
</UploadButton>

View file

@ -74,16 +74,16 @@ export const TorrentActions: React.FC<{
<div className="flex w-full justify-center gap-2 dark:text-slate-300">
{canUnpause && (
<IconButton onClick={unpause} disabled={disabled}>
<FaPlay className="hover:text-green-500 transition-colors duration-300" />
<FaPlay className="hover:text-green-600" />
</IconButton>
)}
{canPause && (
<IconButton onClick={pause} disabled={disabled}>
<FaPause className="hover:text-yellow-500 transition-colors duration-300" />
<FaPause className="hover:text-amber-500" />
</IconButton>
)}
<IconButton onClick={startDeleting} disabled={disabled}>
<FaTrash className="hover:text-red-500 transition-colors duration-500" />
<FaTrash className="hover:text-red-500" />
</IconButton>
<DeleteTorrentModal id={id} show={deleting} onHide={cancelDeleting} />
</div>