aljaz/mutiny-web
1
0
Fork 0
mirror of https://github.com/aljazceru/mutiny-web.git synced 2025-12-18 14:54:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

truncate middle

Browse Source
This commit is contained in:
Paul Miller
2023-05-30 15:05:31 -05:00
committed by Tony Giorgio
parent 1e9dbc0265
commit 0c9e5e7904
1 changed files with 21 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/ShareCard.tsx
View File

@@ -30,19 +30,28 @@ export function ShareButton(props: { receiveString: string }) {
) )
} }
function TruncateMiddle(props: { text: string }) {
return (
<div class="flex text-neutral-400 font-mono">
<span class="truncate">{props.text}</span>
<span class="pr-2">{props.text.length > 8 ? props.text.slice(-8) : ""}</span>
</div>
);
}
export function StringShower(props: { text: string }) { export function StringShower(props: { text: string }) {
const [open, setOpen] = createSignal(false); const [open, setOpen] = createSignal(false);
return ( return (
<> <>
<JsonModal open={open()} plaintext={props.text} title="Details" setOpen={setOpen} /> <JsonModal open={open()} plaintext={props.text} title="Details" setOpen={setOpen} />
<div class="w-full grid grid-cols-[minmax(0,_1fr)_auto]"> <div class="w-full grid grid-cols-[minmax(0,_1fr)_auto]">
<pre class="truncate text-neutral-400">{props.text}</pre> <TruncateMiddle text={props.text} />
<button class="w-[2rem]" onClick={() => setOpen(true)}> <button class="w-[2rem]" onClick={() => setOpen(true)}>
<img src={eyeIcon} alt="eye" /> <img src={eyeIcon} alt="eye" />
</button> </button>
</div> </div>
</> </>
) );
} }
export function CopyButton(props: { text?: string, title?: string }) { export function CopyButton(props: { text?: string, title?: string }) {