mirror of
https://github.com/CorentinTh/it-tools.git
synced 2025-05-05 22:07:10 -04:00
38 lines
767 B
Vue
38 lines
767 B
Vue
|
<script setup lang="ts">
|
||
|
|
import beautify from 'js-beautify';
|
||
|
|
import TextareaCopyable from '@/components/TextareaCopyable.vue';
|
||
|
|
|
||
|
|
const inputCSS = ref('');
|
||
|
|
const outputCSS = computed(() => {
|
||
|
|
return beautify.css(inputCSS.value, {
|
||
|
|
indent_char: ' ',
|
||
|
|
indent_size: 2,
|
||
|
|
sep: '\n',
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div>
|
||
|
|
<c-input-text
|
||
|
|
v-model:value="inputCSS"
|
||
|
|
multiline raw-text
|
||
|
|
placeholder="Your CSS content..."
|
||
|
|
rows="8"
|
||
|
|
autofocus
|
||
|
|
label="Your CSS to format (can paste from clipboard):"
|
||
|
|
/>
|
||
|
|
|
||
|
|
<n-divider />
|
||
|
|
|
||
|
|
<n-form-item label="Output prettified CSS:">
|
||
|
|
<TextareaCopyable
|
||
|
|
:value="outputCSS"
|
||
|
|
multiline
|
||
|
|
language="css"
|
||
|
|
word-wrap
|
||
|
|
/>
|
||
|
|
</n-form-item>
|
||
|
|
</div>
|
||
|
|
</template>
|