fix: better ui, word wrap

This commit is contained in:
ShareVB 2024-03-11 22:14:24 +01:00
parent 3ad648d569
commit ffc635ef26
2 changed files with 10 additions and 1 deletions

View file

@ -16,6 +16,7 @@ const props = withDefaults(
language?: string
copyPlacement?: 'top-right' | 'bottom-right' | 'outside' | 'none'
copyMessage?: string
wordWrap?: boolean
}>(),
{
followHeightOf: null,
@ -47,7 +48,7 @@ const tooltipText = computed(() => isJustCopied.value ? 'Copied!' : copyMessage.
:style="height ? `min-height: ${height - 40 /* card padding */ + 10 /* negative margin compensation */}px` : ''"
>
<n-config-provider :hljs="hljs">
<n-code :code="value" :language="language" :trim="false" data-test-id="area-content" />
<n-code :code="value" :language="language" :word-wrap="wordWrap" :trim="false" data-test-id="area-content" />
</n-config-provider>
</n-scrollbar>
<div absolute right-10px top-10px>

View file

@ -33,6 +33,8 @@ const compressedZlibOutput = computed(() => withDefaultOnError(() => Base64.from
<h3>GZIP compressed string</h3>
<TextareaCopyable
:value="compressedGzipOutput"
:word-wrap="true"
multiline
placeholder="The GZip compressed version of your string will be here"
mb-5
/>
@ -42,6 +44,8 @@ const compressedZlibOutput = computed(() => withDefaultOnError(() => Base64.from
<h3>Zlib compressed string</h3>
<TextareaCopyable
:value="compressedZlibOutput"
:word-wrap="true"
multiline
placeholder="The Zlib compressed version of your string will be here"
mb-5
/>
@ -51,6 +55,8 @@ const compressedZlibOutput = computed(() => withDefaultOnError(() => Base64.from
<h3>Deflate compressed string</h3>
<TextareaCopyable
:value="compressedDeflateOutput"
:word-wrap="true"
multiline
placeholder="The Deflate compressed version of your string will be here"
mb-5
/>
@ -71,6 +77,8 @@ const compressedZlibOutput = computed(() => withDefaultOnError(() => Base64.from
<h3>Decompressed string</h3>
<TextareaCopyable
v-model:value="decompressedOutput"
:word-wrap="true"
multiline
placeholder="The decompressed string will be here"
mb-5
/>