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

fix: show element-specific values in commented CSS preview

Browse source 
- Preview now includes all field values, not filtering defaults
- Commented CSS shows what would be applied with current field values
- Applies to both ElementPopup and PagePopup

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2025-12-10 13:14:48 +01:00
parent 76274fff04
commit d795c08ace
2 changed files with 7 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/components/ElementPopup.vue
View file

@ -375,6 +375,7 @@ const generatePreviewCss = () => {
const properties = [];
// Include all properties with their current values
if (fontFamily.value.value) {
properties.push(` font-family: ${fontFamily.value.value};`);
}
@ -390,16 +391,16 @@ const generatePreviewCss = () => {
if (textAlign.value.value) {
properties.push(` text-align: ${textAlign.value.value};`);
}
if (color.value.value && color.value.value !== 'rgb(0, 0, 0)') {
if (color.value.value) {
properties.push(` color: ${color.value.value};`);
}
if (background.value.value && background.value.value !== 'transparent') {
if (background.value.value) {
properties.push(` background: ${background.value.value};`);
}
if (marginOuter.value.value) {
if (marginOuter.value.value !== undefined && marginOuter.value.value !== null) {
properties.push(` margin: ${marginOuter.value.value}${marginOuter.value.unit};`);
}
if (paddingInner.value.value) {
if (paddingInner.value.value !== undefined && paddingInner.value.value !== null) {
properties.push(` padding: ${paddingInner.value.value}${paddingInner.value.unit};`);
}

2
src/components/PagePopup.vue
View file

@ -622,9 +622,11 @@ const generatePreviewCss = () => {
const properties = [];
// Always include margin with current values
const marginValue = `${margins.value.top.value}${margins.value.top.unit} ${margins.value.right.value}${margins.value.right.unit} ${margins.value.bottom.value}${margins.value.bottom.unit} ${margins.value.left.value}${margins.value.left.unit}`;
properties.push(` margin: ${marginValue};`);
// Include background if it has a value
if (background.value.value) {
properties.push(` background: ${background.value.value};`);
}