mirrors/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools.git synced 2025-05-05 13:57:10 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

refactor(ascii-generator): equilibrate ui

Browse source
This commit is contained in:
Corentin Thomasset 2024-03-03 11:32:22 +01:00
parent 8301489872
commit 7a74c8569c
No known key found for this signature in database
GPG key ID: 623706FB51207280
1 changed files with 5 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/tools/ascii-text-drawer/ascii-text-drawer.vue
View file

@ -8,6 +8,7 @@ const width = useStorage('ascii-text-drawer:width', 80);
const output = ref(''); const output = ref('');
const errored = ref(false); const errored = ref(false);
const processing = ref(false); const processing = ref(false);
figlet.defaults({ fontPath: '//unpkg.com/figlet@1.6.0/fonts/' }); figlet.defaults({ fontPath: '//unpkg.com/figlet@1.6.0/fonts/' });
watchEffect(async () => { watchEffect(async () => {
@ -46,6 +47,8 @@ const fonts = ['1Row', '3-D', '3D Diagonal', '3D-ASCII', '3x5', '4Max', '5 Line
label="Your text:" label="Your text:"
placeholder="Your text to draw" placeholder="Your text to draw"
raw-text raw-text
multiline
rows="4"
/> />
<n-divider /> <n-divider />
@ -63,7 +66,7 @@ const fonts = ['1Row', '3-D', '3D Diagonal', '3D-ASCII', '3x5', '4Max', '5 Line
</n-gi> </n-gi>
<n-gi span="2"> <n-gi span="2">
<n-form-item label="Width:" label-placement="top" label-width="100" :show-feedback="false"> <n-form-item label="Width:" label-placement="top" label-width="100" :show-feedback="false">
<n-input-number v-model:value="width" min="0" max="10000" w-100px /> <n-input-number v-model:value="width" min="0" max="10000" w-full placeholder="Width of the text" />
</n-form-item> </n-form-item>
</n-gi> </n-gi>
</n-grid> </n-grid>
@ -72,6 +75,7 @@ const fonts = ['1Row', '3-D', '3D Diagonal', '3D-ASCII', '3x5', '4Max', '5 Line
<div v-if="processing" flex items-center justify-center> <div v-if="processing" flex items-center justify-center>
<n-spin size="medium" /> <n-spin size="medium" />
<span class="ml-2">Loading font...</span>
</div> </div>
<c-alert v-if="errored" mt-1 text-center type="error"> <c-alert v-if="errored" mt-1 text-center type="error">