mns/mns-mini-zabor
mns
/
mns-mini-zabor
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bx-1047-main #33

Merged
ksenia_mikhailova merged 4 commits from bx-1047-main into dev 2024-07-23 11:07:38 +03:00
Conversation 0 Commits 4 Files Changed 2 +18 -14
2 changed files with 18 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
assets/main.scss
View File

@ -72,7 +72,7 @@ body {
}
&.toggle_visible {
@apply max-xl:flex max-xl:flex-col max-xl:text-center;
@apply max-xl:flex max-xl:flex-col max-xl:text-left;
a {
@apply max-xl:mb-2;
@ -216,7 +216,7 @@ a[href^="#"] {
}
&-title {
@apply col-span-4 font-bold text-lg text-end mt-4;
@apply col-span-4 font-bold text-lg text-end xl:mt-4 mb-4 xl:mb-0;
}
}
@ -285,7 +285,7 @@ button {
}
&-item {
@apply flex flex-row gap-4 items-center justify-center flex-wrap xl:flex-nowrap;
@apply flex flex-row gap-4 items-center justify-start xl:justify-center flex-wrap xl:flex-nowrap;
label {
@apply w-full xl:w-auto;
@ -302,6 +302,10 @@ button {
&_checkbox {
@apply w-full xl:w-auto flex-row xl:flex-initial flex-nowrap
}
input[type=range] {
@apply min-w-[calc(100%-8rem)] xl:min-w-min;
}
}
}

22
components/calcValues.vue
View File

@ -151,13 +151,13 @@ const goal = (target: string, params: object) => {
<div class="form-item w-full">
<label for="length">Длина ламельного блока, мм</label>
<input disabled :value="`${form_state.length} мм`" class="w-28" />
<input id="length" type="range" class="w-full" v-bind="parametric.length"
<input id="length" type="range" class="xl:w-full" v-bind="parametric.length"
v-model="form_state.length" :disabled="form_state.auto_length" :ref="form_refs.length" />
</div>
<div class="form-item w-full">
<label for="height">Высота забора, мм</label>
<input disabled :value="`${form_state.height} мм`" class="w-28" />
<input id="height" type="range" class="w-full" v-bind="parametric.height"
<input id="height" type="range" class="xl:w-full" v-bind="parametric.height"
v-model="form_state.height" :ref="form_refs.height" />
</div>
</div>
@ -208,30 +208,30 @@ const goal = (target: string, params: object) => {
<div class="grid grid-cols-6">
<div class="col-span-4 calc_table-maincell">Секции</div>
<div class="col-span-2 calc_table-maincell">{{ section_count }}</div>
<div class="col-span-4">
<div class="col-span-6 xl:col-span-4">
Ламели, RAL {{ lamelle_color }}, {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }}
</div>
<div class="col-span-1">{{ section_count * lamelles_count }}</div>
<div class="col-span-1">
<div class="col-span-3 xl:col-span-1">{{ section_count * lamelles_count }}</div>
<div class="col-span-3 xl:col-span-1">
{{ `${parseFloat(form_state.length.toString()).toFixed(2)}\xa0мм` }}</div>
<template v-if="!form_state.remove_pillar">
<div class="col-span-4">Столбы, RAL {{ pillar_color }}, {{
<div class="col-span-6 xl:col-span-4">Столбы, RAL {{ pillar_color }}, {{
getColorNameFromRal(pillar_color)?.toLowerCase() }}</div>
<div class="col-span-1">
<div class="col-span-3 xl:col-span-1">
{{ section_count + ~~(!!form_state.extra_section) + 1 }}
</div>
<div class="col-span-1">
<div class="col-span-3 xl:col-span-1">
{{ `${parseFloat(form_state.fence_length.toString()).toFixed(2)}\xa0мм` }}
</div>
</template>
<template v-if="form_state.extra_section">
<div class="col-span-4 calc_table-maincell">Секции</div>
<div class="col-span-2 calc_table-maincell">1</div>
<div class="col-span-4">
<div class="col-span-6 xl:col-span-4">
Ламели, RAL {{ lamelle_color }}, {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }}
</div>
<div class="col-span-1">{{ 1 * lamelles_count }}</div>
<div class="col-span-1">{{
<div class="col-span-3 xl:col-span-1">{{ 1 * lamelles_count }}</div>
<div class="col-span-3 xl:col-span-1">{{
`${parseFloat(form_state.extra_section.toString()).toFixed(2)}\xa0мм` }}</div>
</template>
</div>