Improve random value generator modal UI

This commit is contained in:
carlosmonastyrski
2025-04-16 07:07:37 -03:00
parent 3814c65f38
commit 9ae0880f50
@@ -112,9 +112,8 @@ const PasswordGeneratorModal = ({
className="w-full max-w-lg rounded-lg border border-mineshaft-600 bg-mineshaft-800 shadow-xl" className="w-full max-w-lg rounded-lg border border-mineshaft-600 bg-mineshaft-800 shadow-xl"
> >
<div className="p-6"> <div className="p-6">
<h2 className="mb-1 text-xl font-semibold text-bunker-200">Password Generator</h2> <h2 className="mb-1 text-xl font-semibold text-bunker-200">Generate Random Value</h2>
<p className="mb-6 text-sm text-bunker-400">Generate strong unique passwords</p> <p className="mb-6 text-sm text-bunker-400">Generate strong unique values</p>
<div className="relative mb-4 rounded-md bg-mineshaft-900 p-4"> <div className="relative mb-4 rounded-md bg-mineshaft-900 p-4">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<div className="w-4/5 select-all break-all pr-2 font-mono text-lg">{password}</div> <div className="w-4/5 select-all break-all pr-2 font-mono text-lg">{password}</div>
@@ -219,7 +218,7 @@ const PasswordGeneratorModal = ({
onClick={usePassword} onClick={usePassword}
className="ml-2" className="ml-2"
> >
Use Password Use Value
</Button> </Button>
)} )}
</div> </div>
@@ -252,11 +251,12 @@ export const PasswordGenerator = ({
<> <>
<IconButton <IconButton
ariaLabel="generate password" ariaLabel="generate password"
colorSchema="secondary" colorSchema="primary"
variant="outline_bg"
size="sm" size="sm"
onClick={toggleGenerator} onClick={toggleGenerator}
isDisabled={isDisabled} isDisabled={isDisabled}
className="rounded text-bunker-400 transition-colors duration-150 hover:bg-mineshaft-700 hover:text-bunker-200" className="rounded"
> >
<FontAwesomeIcon icon={faKey} /> <FontAwesomeIcon icon={faKey} />
</IconButton> </IconButton>