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

Fixed the UI bug with overflowing dots (#30)

Browse Source
This commit is contained in:
Vladyslav Matsiiako
2022-11-30 21:21:50 -05:00
parent 63c4cfa651
commit f659be446d
1 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/components/dashboard/DashboardInputField.js
View File

@@ -84,7 +84,7 @@ const DashboardInputField = ({
blurred blurred
? "text-bunker-800 group-hover:text-gray-400 peer-focus:text-gray-400 peer-active:text-gray-400" ? "text-bunker-800 group-hover:text-gray-400 peer-focus:text-gray-400 peer-active:text-gray-400"
: "" : ""
} flex flex-row whitespace-pre font-mono absolute z-0 ph-no-capture max-w-2xl overflow-x-scroll bg-bunker-800 h-9 rounded-md text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-2 focus:ring-primary/50 duration-100`} } absolute flex flex-row whitespace-pre font-mono z-0 ph-no-capture max-w-2xl overflow-x-scroll bg-bunker-800 h-9 rounded-md text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-2 focus:ring-primary/50 duration-100`}
> >
{ {
value value
@@ -115,18 +115,18 @@ const DashboardInputField = ({
} }
</div> </div>
{blurred && ( {blurred && (
<div className="z-20 peer pr-2 bg-bunker-800 group-hover:hidden peer-hover:hidden peer-focus:hidden peer-active:invisible absolute h-9 w-fit max-w-xl rounded-md flex items-center text-gray-400/50 text-clip overflow-hidden"> <div className="absolute flex flex-row items-center z-20 peer pr-2 bg-bunker-800 group-hover:hidden peer-hover:hidden peer-focus:hidden peer-active:invisible h-9 w-full max-w-2xl rounded-md text-gray-400/50 text-clip">
<p className="ml-2"></p> <div className="px-2 flex flex-row items-center overflow-x-scroll">
{value {value
.split("") .split("")
.slice(0, 42) .map(() => (
.map(() => ( <FontAwesomeIcon
<FontAwesomeIcon key={guidGenerator()}
key={guidGenerator()} className="text-xxs mx-0.5"
className="text-xxs mx-0.5" icon={faCircle}
icon={faCircle} />
/> ))}
))} </div>
</div> </div>
)} )}
</div> </div>