disable: comment out em/rem unit options, keep only px and mm for print
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 20s
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 20s
Margins: px + mm only. Font sizes: px only. em/rem buttons are commented out, not deleted, for potential future use. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown
parent
de3bb2a274
commit
b5b495d478
5 changed files with 38 additions and 38 deletions
|
|
@ -60,7 +60,7 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: fontSize.unit === 'em' }"
|
||||
:disabled="inheritanceLocked"
|
||||
|
|
@ -75,7 +75,7 @@
|
|||
@click="updateFontSizeUnit('rem')"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -50,14 +50,14 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.top.unit === 'rem' }"
|
||||
:disabled="inheritanceLocked"
|
||||
@click="margins.top.unit = 'rem'"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -91,14 +91,14 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.bottom.unit === 'rem' }"
|
||||
:disabled="inheritanceLocked"
|
||||
@click="margins.bottom.unit = 'rem'"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -132,14 +132,14 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.left.unit === 'rem' }"
|
||||
:disabled="inheritanceLocked"
|
||||
@click="margins.left.unit = 'rem'"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -173,14 +173,14 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.right.unit === 'rem' }"
|
||||
:disabled="inheritanceLocked"
|
||||
@click="margins.right.unit = 'rem'"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -77,13 +77,13 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.top.unit === 'rem' }"
|
||||
@click="updateMarginUnit('top', 'rem')"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -118,13 +118,13 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.bottom.unit === 'rem' }"
|
||||
@click="updateMarginUnit('bottom', 'rem')"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -159,13 +159,13 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.left.unit === 'rem' }"
|
||||
@click="updateMarginUnit('left', 'rem')"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -200,13 +200,13 @@
|
|||
>
|
||||
px
|
||||
</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: margins.right.unit === 'rem' }"
|
||||
@click="updateMarginUnit('right', 'rem')"
|
||||
>
|
||||
rem
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@
|
|||
<label for="text-size-range" class="label-with-tooltip" data-css="font-size">Taille du texte</label>
|
||||
<InputWithUnit
|
||||
v-model="fontSize"
|
||||
:units="['px', 'em', 'rem']"
|
||||
:units="['px']"
|
||||
:min="8"
|
||||
:max="72"
|
||||
showRange
|
||||
|
|
@ -129,11 +129,11 @@
|
|||
:class="{ active: marginOuterDetailed.top.unit === 'px' }"
|
||||
@click="updateMarginOuterUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginOuterDetailed.top.unit === 'rem' }"
|
||||
@click="updateMarginOuterUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -159,11 +159,11 @@
|
|||
:class="{ active: marginOuterDetailed.bottom.unit === 'px' }"
|
||||
@click="updateMarginOuterUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginOuterDetailed.bottom.unit === 'rem' }"
|
||||
@click="updateMarginOuterUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -189,11 +189,11 @@
|
|||
:class="{ active: marginOuterDetailed.left.unit === 'px' }"
|
||||
@click="updateMarginOuterUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginOuterDetailed.left.unit === 'rem' }"
|
||||
@click="updateMarginOuterUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -219,11 +219,11 @@
|
|||
:class="{ active: marginOuterDetailed.right.unit === 'px' }"
|
||||
@click="updateMarginOuterUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginOuterDetailed.right.unit === 'rem' }"
|
||||
@click="updateMarginOuterUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -266,11 +266,11 @@
|
|||
:class="{ active: marginInnerDetailed.top.unit === 'px' }"
|
||||
@click="updateMarginInnerUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginInnerDetailed.top.unit === 'rem' }"
|
||||
@click="updateMarginInnerUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -296,11 +296,11 @@
|
|||
:class="{ active: marginInnerDetailed.bottom.unit === 'px' }"
|
||||
@click="updateMarginInnerUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginInnerDetailed.bottom.unit === 'rem' }"
|
||||
@click="updateMarginInnerUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -326,11 +326,11 @@
|
|||
:class="{ active: marginInnerDetailed.left.unit === 'px' }"
|
||||
@click="updateMarginInnerUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginInnerDetailed.left.unit === 'rem' }"
|
||||
@click="updateMarginInnerUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -356,11 +356,11 @@
|
|||
:class="{ active: marginInnerDetailed.right.unit === 'px' }"
|
||||
@click="updateMarginInnerUnit('px')"
|
||||
>px</button>
|
||||
<button
|
||||
<!-- <button
|
||||
type="button"
|
||||
:class="{ active: marginInnerDetailed.right.unit === 'rem' }"
|
||||
@click="updateMarginInnerUnit('rem')"
|
||||
>rem</button>
|
||||
>rem</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -675,7 +675,7 @@ const syncFromStore = () => {
|
|||
const fontWeight = extractValue('p', 'font-weight');
|
||||
if (fontWeight) weight.value = fontWeight;
|
||||
|
||||
const fontSizeVal = extractNumericValue('p', 'font-size', ['px', 'em', 'rem']);
|
||||
const fontSizeVal = extractNumericValue('p', 'font-size', ['px']); // ['px', 'em', 'rem']
|
||||
if (fontSizeVal) fontSize.value = fontSizeVal;
|
||||
|
||||
// Margins
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ export function useCssSync() {
|
|||
* Extract a numeric CSS value with unit
|
||||
* Returns { value: number, unit: string } or null
|
||||
*/
|
||||
const extractNumericValue = (selector, property, allowedUnits = ['px', 'em', 'rem', 'mm']) => {
|
||||
const extractNumericValue = (selector, property, allowedUnits = ['px', 'mm']) => { // ['px', 'em', 'rem', 'mm']
|
||||
const block = store.extractBlock(selector);
|
||||
if (!block) return null;
|
||||
|
||||
|
|
@ -38,7 +38,7 @@ export function useCssSync() {
|
|||
* Extract margin/padding shorthand (handles 1 or 4 values)
|
||||
* Returns { simple: { value, unit } } or { detailed: { top, right, bottom, left } }
|
||||
*/
|
||||
const extractSpacing = (selector, property, allowedUnits = ['mm', 'px', 'rem']) => {
|
||||
const extractSpacing = (selector, property, allowedUnits = ['mm', 'px']) => { // ['mm', 'px', 'rem']
|
||||
const block = store.extractBlock(selector);
|
||||
if (!block) return null;
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue