diff --git a/src/components/component_preview/component_preview.vue b/src/components/component_preview/component_preview.vue index 44b981f6d..d4be7da46 100644 --- a/src/components/component_preview/component_preview.vue +++ b/src/components/component_preview/component_preview.vue @@ -168,6 +168,7 @@ } .preview-block { + background: var(--background, var(--bg)); display: flex; justify-content: center; align-items: center; @@ -178,6 +179,8 @@ border-width: 0; border-style: solid; border-color: var(--border); + border-radius: var(--roundness); + box-shadow: var(--shadow); } } } diff --git a/src/components/select/select.vue b/src/components/select/select.vue index 39d3ca647..0fb6fcc0e 100644 --- a/src/components/select/select.vue +++ b/src/components/select/select.vue @@ -61,12 +61,13 @@ label.Select { &:disabled { background-color: var(--background); opacity: 1; /* override browser */ + color: var(--faint); select { &[multiple], &[size] { option.-active { - color: var(--text); + color: var(--faint); background: transparent; } } diff --git a/src/components/shadow_control/shadow_control.js b/src/components/shadow_control/shadow_control.js index 451180f43..4521305ea 100644 --- a/src/components/shadow_control/shadow_control.js +++ b/src/components/shadow_control/shadow_control.js @@ -36,7 +36,7 @@ export default { props: [ 'modelValue', 'fallback', 'separateInset', 'noPreview', 'disabled' ], - emits: ['update:modelValue'], + emits: ['update:modelValue', 'subShadowSelected'], data () { return { selectedId: 0, @@ -93,9 +93,13 @@ export default { } } }, + watch: { + selected (value) { + this.$emit('subShadowSelected', this.selectedId) + } + }, methods: { updateProperty: throttle(function (prop, value) { - console.log(prop, value) this.cValue[this.selectedId][prop] = value if (prop === 'inset' && value === false && this.separateInset) { this.cValue[this.selectedId].spread = 0