studio-variable/geoproject-app
4
0
Fork 0
Code Issues 25 Pull requests Projects Releases Packages Wiki Activity Actions

styles w/ differents colors

Browse source
This commit is contained in:
Julie Blanc 2025-12-09 17:08:40 +01:00
parent 678698b55d
commit 718aae2c23
13 changed files with 667 additions and 196 deletions
Download patch file Download diff file Expand all files Collapse all files

29
src/components/ElementPopup.vue
View file

@ -58,10 +58,10 @@
<div class="field" :class="{ 'field--view-only': inheritanceLocked }">
<label class="label-with-tooltip" data-css="font-size">Taille du texte</label>
<div class="input-with-unit">
<input
type="number"
v-model.number="fontSize.value"
min="0"
<NumberInput
v-model="fontSize.value"
:min="0"
:step="1"
:disabled="inheritanceLocked"
/>
<div class="unit-toggle">
@ -109,7 +109,7 @@
<!-- Color -->
<div class="settings-subsection">
<div class="field" :class="{ 'field--view-only': inheritanceLocked }">
<div class="field field-simple" :class="{ 'field--view-only': inheritanceLocked }">
<label class="label-with-tooltip" data-css="color">Couleur</label>
<div class="input-with-color">
<input
@ -125,7 +125,7 @@
<!-- Background -->
<div class="settings-subsection">
<div class="field" :class="{ 'field--view-only': inheritanceLocked }">
<div class="field field-simple" :class="{ 'field--view-only': inheritanceLocked }">
<label class="label-with-tooltip" data-css="background">Arrière-plan</label>
<div class="input-with-color">
<input
@ -144,10 +144,10 @@
<div class="field" :class="{ 'field--view-only': inheritanceLocked }">
<label class="label-with-tooltip" data-css="margin">Marges extérieures</label>
<div class="input-with-unit">
<input
type="number"
v-model.number="marginOuter.value"
min="0"
<NumberInput
v-model="marginOuter.value"
:min="0"
:step="1"
:disabled="inheritanceLocked"
/>
<div class="unit-toggle">
@ -177,10 +177,10 @@
<div class="field" :class="{ 'field--view-only': inheritanceLocked }">
<label class="label-with-tooltip" data-css="padding">Marges intérieures</label>
<div class="input-with-unit">
<input
type="number"
v-model.number="paddingInner.value"
min="0"
<NumberInput
v-model="paddingInner.value"
:min="0"
:step="1"
:disabled="inheritanceLocked"
/>
<div class="unit-toggle">
@ -274,6 +274,7 @@
import { ref, computed, watch } from 'vue';
import { useStylesheetStore } from '../stores/stylesheet';
import { usePopupPosition } from '../composables/usePopupPosition';
import NumberInput from './ui/NumberInput.vue';
import Coloris from '@melloware/coloris';
import '@melloware/coloris/dist/coloris.css';
import hljs from 'highlight.js/lib/core';