elias/strudel-docker
1
0
Fork 0
mirror of https://github.com/eliasstepanik/strudel-docker.git synced 2026-01-24 03:58:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

button size and icon

Browse Source
This commit is contained in:
Jade (Rose) Rowland 2025-04-27 01:51:41 -04:00
parent f539930509
commit c48aba50f0
1 changed files with 37 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
website/src/repl/components/panel/ImportSoundsButton.jsx
View File

@ -20,25 +20,42 @@ export default function ImportSoundsButton({ onComplete }) {
}); });
return ( return (
<label <div>
style={{ alignItems: 'center' }} <label
className="flex bg-background ml-2 pl-2 pr-2 max-w-[210px] rounded-md hover:opacity-50 whitespace-nowrap cursor-pointer" style={{ alignItems: 'center', borderColor: 'red', border: 1 }}
> className="flex bg-background p-4 w-fit rounded-xl hover:opacity-50 whitespace-nowrap cursor-pointer"
<input >
disabled={isUploading} <svg
ref={fileUploadRef} xmlns="http://www.w3.org/2000/svg"
id="audio_file" fill="none"
style={{ display: 'none' }} viewBox="0 0 24 24"
type="file" strokeWidth={1.5}
directory="" stroke="currentColor"
webkitdirectory="" className="size-6 mr-2"
multiple >
accept="audio/*, .wav, .mp3, .m4a, .flac, .aac, .ogg" <path
onChange={() => { strokeLinecap="round"
onChange(); strokeLinejoin="round"
}} d="M7.5 7.5h-.75A2.25 2.25 0 0 0 4.5 9.75v7.5a2.25 2.25 0 0 0 2.25 2.25h7.5a2.25 2.25 0 0 0 2.25-2.25v-7.5a2.25 2.25 0 0 0-2.25-2.25h-.75m0-3-3-3m0 0-3 3m3-3v11.25m6-2.25h.75a2.25 2.25 0 0 1 2.25 2.25v7.5a2.25 2.25 0 0 1-2.25 2.25h-7.5a2.25 2.25 0 0 1-2.25-2.25v-.75"
/> />
{isUploading ? 'importing...' : 'import sounds folder'} </svg>
</label>
<input
disabled={isUploading}
ref={fileUploadRef}
id="audio_file"
style={{ display: 'none' }}
type="file"
directory=""
webkitdirectory=""
multiple
accept="audio/*, .wav, .mp3, .m4a, .flac, .aac, .ogg"
onChange={() => {
onChange();
}}
/>
{isUploading ? 'importing...' : 'import sounds folder'}
</label>
</div>
); );
} }