dev #84
|
@ -301,7 +301,7 @@ button {
|
|||
@apply col-span-full grid grid-cols-12 gap-4;
|
||||
|
||||
&-row {
|
||||
@apply col-span-full flex flex-row flex-wrap gap-4;
|
||||
@apply col-span-full flex flex-row flex-wrap gap-2;
|
||||
}
|
||||
|
||||
&-item {
|
||||
|
@ -320,7 +320,15 @@ button {
|
|||
}
|
||||
|
||||
&_checkbox {
|
||||
@apply w-full xl:w-auto flex-row xl:flex-initial flex-nowrap gap-4;
|
||||
@apply w-full xl:w-auto flex-row xl:flex-initial flex-nowrap gap-2 items-center;
|
||||
|
||||
label {
|
||||
@apply leading-none;
|
||||
}
|
||||
|
||||
svg {
|
||||
@apply text-slate-500;
|
||||
}
|
||||
}
|
||||
|
||||
&_range {
|
||||
|
@ -335,13 +343,13 @@ button {
|
|||
}
|
||||
}
|
||||
|
||||
&_color {
|
||||
&_picker {
|
||||
@apply w-full;
|
||||
}
|
||||
|
||||
// input[type=range] {
|
||||
// @apply min-w-[calc(100%-8rem)] xl:min-w-min py-0 -translate-y-1/2;
|
||||
// }
|
||||
svg {
|
||||
@apply text-slate-500;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -25,7 +25,7 @@ const cameraStat = reactive({
|
|||
</template>
|
||||
<Loader />
|
||||
<Stats />
|
||||
<TresCanvas clear-color="#ccc">
|
||||
<TresCanvas clear-color="#e2e8f0">
|
||||
<TresPerspectiveCamera v-bind="cameraStat" ref="camera" />
|
||||
<OrbitControls v-bind="controlsState" make-default />
|
||||
<Suspense>
|
||||
|
|
|
@ -184,7 +184,7 @@ const calc_table = computed(() => {
|
|||
<template>
|
||||
<div class="form">
|
||||
<div class="form-row">
|
||||
<div class="form-item form-item_color">
|
||||
<div class="form-item form-item_picker">
|
||||
<label for="lamelle_color">Цвет ламелей</label>
|
||||
<DropdownPicker type="color" :cb="setLamelleColor" name="lamelle_color"
|
||||
:goto_target="new Vector3(0, lamelles_count * lamelle_height * 0.75, 0)"
|
||||
|
@ -197,7 +197,7 @@ const calc_table = computed(() => {
|
|||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-item form-item_color">
|
||||
<div class="form-item form-item_picker">
|
||||
<label for="pillar_color">Цвет столба</label>
|
||||
<DropdownPicker type="color" :cb="setPillarColor" name="pillar_color"
|
||||
:goto_target="new Vector3(-fence_section * 0.5, lamelles_count * lamelle_height, 0)"
|
||||
|
@ -210,7 +210,7 @@ const calc_table = computed(() => {
|
|||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-item form-item_color">
|
||||
<div class="form-item form-item_picker">
|
||||
<label for="pillar_pattern">Узор столба</label>
|
||||
<DropdownPicker type="pattern" :cb="setPillarPattern" name="pillar_pattern" :disabled="remove_pillar"
|
||||
:goto_target="new Vector3(fence_section * 0.5, lamelles_count * lamelle_height, 0)"
|
||||
|
@ -260,7 +260,8 @@ const calc_table = computed(() => {
|
|||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-item form-item_checkbox">
|
||||
<input id="auto_length" type="checkbox" v-model="form_state.auto_length" />
|
||||
<input id="auto_length" type="checkbox" v-model="form_state.auto_length" hidden />
|
||||
<Icon :name="`mdi:check-box-outline${!form_state.auto_length ? '-blank' : ''}`" />
|
||||
<label for="auto_length">Автоматический подбор секции</label>
|
||||
</div>
|
||||
<p v-if="!form_state.auto_length" class="text-ioprim text-sm">
|
||||
|
@ -269,7 +270,8 @@ const calc_table = computed(() => {
|
|||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-item form-item_checkbox">
|
||||
<input id="remove_pillar" type="checkbox" v-model="form_state.remove_pillar" />
|
||||
<input id="remove_pillar" type="checkbox" v-model="form_state.remove_pillar" hidden />
|
||||
<Icon :name="`mdi:check-box-outline${!form_state.remove_pillar ? '-blank' : ''}`" />
|
||||
<label for="remove_pillar">Без столбов</label>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue