44 lines
819 B
Vue
44 lines
819 B
Vue
<template>
|
|
<span class="text-label" :class="{ bold, italic, multiline, 'table-align': tableAlign }">
|
|
<slot></slot>
|
|
</span>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.text-label {
|
|
line-height: 18px;
|
|
white-space: nowrap;
|
|
|
|
&.bold {
|
|
font-weight: 700;
|
|
}
|
|
|
|
&.italic {
|
|
font-style: italic;
|
|
}
|
|
|
|
&.multiline {
|
|
white-space: pre-wrap;
|
|
margin: 4px 0;
|
|
}
|
|
|
|
&.table-align {
|
|
flex: 0 0 30%;
|
|
text-align: right;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent, PropType } from "vue";
|
|
|
|
export default defineComponent({
|
|
props: {
|
|
bold: { type: Boolean as PropType<boolean>, default: false },
|
|
italic: { type: Boolean as PropType<boolean>, default: false },
|
|
tableAlign: { type: Boolean as PropType<boolean>, default: false },
|
|
multiline: { type: Boolean as PropType<boolean>, default: false },
|
|
},
|
|
});
|
|
</script>
|