fix: convert values when switching CSS units to preserve visual size
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 21s
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 21s
Previously, changing unit (e.g. mm → px) kept the numeric value unchanged, causing visual changes. Now values are converted through a px pivot unit so the rendered size stays the same. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
342a6eccf1
commit
de3bb2a274
5 changed files with 92 additions and 33 deletions
|
|
@ -29,6 +29,7 @@
|
|||
<script setup>
|
||||
import NumberInput from './NumberInput.vue';
|
||||
import UnitToggle from './UnitToggle.vue';
|
||||
import { convertUnit } from '../../utils/unit-conversion';
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
|
|
@ -64,7 +65,8 @@ const updateValue = (value) => {
|
|||
emit('update:modelValue', { ...props.modelValue, value });
|
||||
};
|
||||
|
||||
const updateUnit = (unit) => {
|
||||
emit('update:modelValue', { ...props.modelValue, unit });
|
||||
const updateUnit = (newUnit) => {
|
||||
const converted = convertUnit(props.modelValue.value, props.modelValue.unit, newUnit);
|
||||
emit('update:modelValue', { value: converted, unit: newUnit });
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue