chore(client): tweak style
This commit is contained in:
parent
f635d5b864
commit
c67c3b0360
3 changed files with 9 additions and 10 deletions
|
@ -1,5 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<XModalWindow ref="dialog"
|
<XModalWindow
|
||||||
|
ref="dialog"
|
||||||
:width="450"
|
:width="450"
|
||||||
:can-close="false"
|
:can-close="false"
|
||||||
:with-ok-button="true"
|
:with-ok-button="true"
|
||||||
|
@ -37,7 +38,7 @@
|
||||||
<option v-for="item in form[item].enum" :key="item.value" :value="item.value">{{ item.label }}</option>
|
<option v-for="item in form[item].enum" :key="item.value" :value="item.value">{{ item.label }}</option>
|
||||||
</FormSelect>
|
</FormSelect>
|
||||||
<FormRadios v-else-if="form[item].type === 'radio'" v-model="values[item]" class="_formBlock">
|
<FormRadios v-else-if="form[item].type === 'radio'" v-model="values[item]" class="_formBlock">
|
||||||
<template #caption><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
|
<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
|
||||||
<option v-for="item in form[item].options" :key="item.value" :value="item.value">{{ item.label }}</option>
|
<option v-for="item in form[item].options" :key="item.value" :value="item.value">{{ item.label }}</option>
|
||||||
</FormRadios>
|
</FormRadios>
|
||||||
<FormRange v-else-if="form[item].type === 'range'" v-model="values[item]" :min="form[item].mim" :max="form[item].max" :step="form[item].step" :text-converter="form[item].textConverter" class="_formBlock">
|
<FormRange v-else-if="form[item].type === 'range'" v-model="values[item]" :min="form[item].mim" :max="form[item].max" :step="form[item].step" :text-converter="form[item].textConverter" class="_formBlock">
|
||||||
|
@ -55,7 +56,6 @@
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
import XModalWindow from '@/components/ui/modal-window.vue';
|
|
||||||
import FormInput from './form/input.vue';
|
import FormInput from './form/input.vue';
|
||||||
import FormTextarea from './form/textarea.vue';
|
import FormTextarea from './form/textarea.vue';
|
||||||
import FormSwitch from './form/switch.vue';
|
import FormSwitch from './form/switch.vue';
|
||||||
|
@ -63,6 +63,7 @@ import FormSelect from './form/select.vue';
|
||||||
import FormRange from './form/range.vue';
|
import FormRange from './form/range.vue';
|
||||||
import MkButton from './ui/button.vue';
|
import MkButton from './ui/button.vue';
|
||||||
import FormRadios from './form/radios.vue';
|
import FormRadios from './form/radios.vue';
|
||||||
|
import XModalWindow from '@/components/ui/modal-window.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
|
@ -91,7 +92,7 @@ export default defineComponent({
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
values: {}
|
values: {},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -104,18 +105,18 @@ export default defineComponent({
|
||||||
methods: {
|
methods: {
|
||||||
ok() {
|
ok() {
|
||||||
this.$emit('done', {
|
this.$emit('done', {
|
||||||
result: this.values
|
result: this.values,
|
||||||
});
|
});
|
||||||
this.$refs.dialog.close();
|
this.$refs.dialog.close();
|
||||||
},
|
},
|
||||||
|
|
||||||
cancel() {
|
cancel() {
|
||||||
this.$emit('done', {
|
this.$emit('done', {
|
||||||
canceled: true
|
canceled: true,
|
||||||
});
|
});
|
||||||
this.$refs.dialog.close();
|
this.$refs.dialog.close();
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -143,7 +143,6 @@ function onContextmenu(ev: MouseEvent) {
|
||||||
background: var(--windowHeader);
|
background: var(--windowHeader);
|
||||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
backdrop-filter: var(--blur, blur(15px));
|
||||||
box-shadow: 0px 1px var(--divider);
|
|
||||||
|
|
||||||
> button {
|
> button {
|
||||||
height: $height;
|
height: $height;
|
||||||
|
|
|
@ -105,7 +105,6 @@ defineExpose({
|
||||||
background: var(--windowHeader);
|
background: var(--windowHeader);
|
||||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
backdrop-filter: var(--blur, blur(15px));
|
||||||
box-shadow: 0px 1px var(--divider);
|
|
||||||
|
|
||||||
> button {
|
> button {
|
||||||
height: $height;
|
height: $height;
|
||||||
|
|
Loading…
Reference in a new issue