diff options
author | 2023-06-25 15:00:50 +0200 | |
---|---|---|
committer | 2023-06-25 13:00:50 +0000 | |
commit | 05ea54547515f7fb1eed5f31ccbde10e36041fb1 (patch) | |
tree | 535e78ce534818e9a66ff3a2335499a53db1fe4c /src/tools/integer-base-converter/integer-base-converter.vue | |
parent | 5c3bebfe62ab2942f6378356fbb6be40e389c70e (diff) | |
download | it-tools-05ea54547515f7fb1eed5f31ccbde10e36041fb1.tar.gz it-tools-05ea54547515f7fb1eed5f31ccbde10e36041fb1.tar.zst it-tools-05ea54547515f7fb1eed5f31ccbde10e36041fb1.zip |
refactor(ui): replaced some n-input to c-input (#505)
Diffstat (limited to 'src/tools/integer-base-converter/integer-base-converter.vue')
-rw-r--r-- | src/tools/integer-base-converter/integer-base-converter.vue | 31 |
1 files changed, 4 insertions, 27 deletions
diff --git a/src/tools/integer-base-converter/integer-base-converter.vue b/src/tools/integer-base-converter/integer-base-converter.vue index a4ff3fd..2445baa 100644 --- a/src/tools/integer-base-converter/integer-base-converter.vue +++ b/src/tools/integer-base-converter/integer-base-converter.vue @@ -1,11 +1,8 @@ <script setup lang="ts"> import InputCopyable from '../../components/InputCopyable.vue'; import { convertBase } from './integer-base-converter.model'; -import { useStyleStore } from '@/stores/style.store'; import { getErrorMessageIfThrows } from '@/utils/error'; -const styleStore = useStyleStore(); - const inputProps = { 'labelPosition': 'left', 'labelWidth': '170px', @@ -37,31 +34,11 @@ const error = computed(() => <template> <div> <c-card> - <div v-if="styleStore.isSmallScreen"> - <n-input-group> - <n-input-group-label style="flex: 0 0 120px"> - Input number: - </n-input-group-label> - <n-input v-model:value="input" w-full :status="error ? 'error' : undefined" /> - </n-input-group> - <n-input-group> - <n-input-group-label style="flex: 0 0 120px"> - Input base: - </n-input-group-label> - <n-input-number v-model:value="inputBase" max="64" min="2" w-full /> - </n-input-group> - </div> + <c-input-text v-model:value="input" label="Input number" placeholder="Put your number here (ex: 42)" label-position="left" label-width="110px" mb-2 label-align="right" /> - <n-input-group v-else> - <n-input-group-label style="flex: 0 0 120px"> - Input number: - </n-input-group-label> - <n-input v-model:value="input" :status="error ? 'error' : undefined" /> - <n-input-group-label style="flex: 0 0 120px"> - Input base: - </n-input-group-label> - <n-input-number v-model:value="inputBase" max="64" min="2" /> - </n-input-group> + <n-form-item label="Input base" label-placement="left" label-width="110" :show-feedback="false"> + <n-input-number v-model:value="inputBase" max="64" min="2" placeholder="Put your input base here (ex: 10)" w-full /> + </n-form-item> <n-alert v-if="error" style="margin-top: 25px" type="error"> {{ error }} |