awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-07 01:27:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: layout gap increment on new lines

Browse Source
This commit is contained in:
Salman
2024-03-14 06:01:02 +05:30
parent 2f932ad103
commit 126e385046
1 changed files with 35 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/v2/SecretInput/SecretInput.tsx
+35 -33
View File
@@ -67,40 +67,41 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
const [isSecretFocused, setIsSecretFocused] = useToggle(); const [isSecretFocused, setIsSecretFocused] = useToggle();
return ( return (
// <> <div>
<div <div
className={twMerge("w-full overflow-auto rounded-md no-scrollbar", containerClassName)} className={twMerge("w-full overflow-auto rounded-md no-scrollbar", containerClassName)}
style={{ maxHeight: `${21 * 7}px` }} style={{ maxHeight: `${21 * 7}px` }}
> >
<div className="relative overflow-hidden"> <div className="relative overflow-hidden">
<pre aria-hidden className="m-0 "> <pre aria-hidden className="m-0 ">
<code className={`inline-block w-full ${commonClassName}`}> <code className={`inline-block w-full ${commonClassName}`}>
<span style={{ whiteSpace: "break-spaces" }}> <span style={{ whiteSpace: "break-spaces" }}>
{syntaxHighlight(value, isVisible || isSecretFocused)} {syntaxHighlight(value, isVisible || isSecretFocused)}
</span> </span>
</code> </code>
</pre> </pre>
<textarea <textarea
style={{ whiteSpace: "break-spaces" }} style={{ whiteSpace: "break-spaces" }}
aria-label="secret value" aria-label="secret value"
ref={ref} ref={ref}
className={`absolute inset-0 block h-full resize-none overflow-hidden bg-transparent text-transparent no-scrollbar focus:border-0 ${commonClassName}`} className={`absolute inset-0 block h-full resize-none overflow-hidden bg-transparent text-transparent no-scrollbar focus:border-0 ${commonClassName}`}
onFocus={() => setIsSecretFocused.on()} onFocus={() => setIsSecretFocused.on()}
disabled={isDisabled} disabled={isDisabled}
spellCheck={false} spellCheck={false}
onBlur={(evt) => { onBlur={(evt) => {
onBlur?.(evt); onBlur?.(evt);
setIsSecretFocused.off(); setIsSecretFocused.off();
}} }}
value={value || ""} value={value || ""}
{...props} {...props}
readOnly={isReadOnly} readOnly={isReadOnly}
/> />
</div>
</div> </div>
{isSecretFocused && (
<div className="absolute z-10 w-60 rounded-md border border-mineshaft-600 bg-mineshaft-700 text-sm text-bunker-200"> <div className="absolute z-10 mt-2 w-60 rounded-md border border-mineshaft-600 bg-mineshaft-700 text-sm text-bunker-200">
<div className="z-10 h-full w-60 flex-col items-center justify-center rounded-md py-4 text-white"> <div className="h-full w-full flex-col items-center justify-center rounded-md py-4 text-white">
{[ {[
{ name: "SECRET NAME", type: "secret" }, { name: "SECRET NAME", type: "secret" },
{ name: "Folder", type: "folder" }, { name: "Folder", type: "folder" },
@@ -151,7 +152,8 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
); );
})} })}
</div> </div>
</div> </div>
)}
</div> </div>
); );
} }