awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-09-22 13:39:35 +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

68
frontend/src/components/v2/SecretInput/SecretInput.tsx
View File

@@ -67,40 +67,41 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
const [isSecretFocused, setIsSecretFocused] = useToggle();
return (
// <>
<div
className={twMerge("w-full overflow-auto rounded-md no-scrollbar", containerClassName)}
style={{ maxHeight: `${21 * 7}px` }}
>
<div className="relative overflow-hidden">
<pre aria-hidden className="m-0 ">
<code className={`inline-block w-full ${commonClassName}`}>
<span style={{ whiteSpace: "break-spaces" }}>
{syntaxHighlight(value, isVisible || isSecretFocused)}
</span>
</code>
</pre>
<div>
<div
className={twMerge("w-full overflow-auto rounded-md no-scrollbar", containerClassName)}
style={{ maxHeight: `${21 * 7}px` }}
>
<div className="relative overflow-hidden">
<pre aria-hidden className="m-0 ">
<code className={`inline-block w-full ${commonClassName}`}>
<span style={{ whiteSpace: "break-spaces" }}>
{syntaxHighlight(value, isVisible || isSecretFocused)}
</span>
</code>
</pre>
<textarea
style={{ whiteSpace: "break-spaces" }}
aria-label="secret value"
ref={ref}
className={`absolute inset-0 block h-full resize-none overflow-hidden bg-transparent text-transparent no-scrollbar focus:border-0 ${commonClassName}`}
onFocus={() => setIsSecretFocused.on()}
disabled={isDisabled}
spellCheck={false}
onBlur={(evt) => {
onBlur?.(evt);
setIsSecretFocused.off();
}}
value={value || ""}
{...props}
readOnly={isReadOnly}
/>
<textarea
style={{ whiteSpace: "break-spaces" }}
aria-label="secret value"
ref={ref}
className={`absolute inset-0 block h-full resize-none overflow-hidden bg-transparent text-transparent no-scrollbar focus:border-0 ${commonClassName}`}
onFocus={() => setIsSecretFocused.on()}
disabled={isDisabled}
spellCheck={false}
onBlur={(evt) => {
onBlur?.(evt);
setIsSecretFocused.off();
}}
value={value || ""}
{...props}
readOnly={isReadOnly}
/>
</div>
</div>
<div className="absolute z-10 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">
{isSecretFocused && (
<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="h-full w-full flex-col items-center justify-center rounded-md py-4 text-white">
{[
{ name: "SECRET NAME", type: "secret" },
{ name: "Folder", type: "folder" },
@@ -151,7 +152,8 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
);
})}
</div>
</div>
</div>
)}
</div>
);
}