From c2dfe62481ccd53bbaa9695f106a9f664f54ae4c Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 29 Sep 2024 19:20:09 +0300
Subject: [PATCH 1/3] subshadow select event + better styles for preview

---
 .../component_preview/component_preview.vue       | 15 +++++++++++----
 src/components/shadow_control/shadow_control.js   |  8 ++++++--
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/component_preview/component_preview.vue b/src/components/component_preview/component_preview.vue
index 151ab857..873f7e61 100644
--- a/src/components/component_preview/component_preview.vue
+++ b/src/components/component_preview/component_preview.vue
@@ -166,12 +166,19 @@
     }
 
     .preview-block {
-      width: 33%;
-      height: 33%;
-      border-radius: var(--roundness);
       background: var(--background);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      min-width: 33%;
+      min-height: 33%;
+      max-width: 80%;
+      max-height: 80%;
+      border-width: 0;
+      border-style: solid;
+      border-color: var(--border);
+      border-radius: var(--roundness);
       box-shadow: var(--shadow);
-      border: 1px solid var(--border);
     }
   }
 }
diff --git a/src/components/shadow_control/shadow_control.js b/src/components/shadow_control/shadow_control.js
index 451180f4..4521305e 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

From c677bbf10249f29699243399fb0b6fe192298772 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 29 Sep 2024 19:20:39 +0300
Subject: [PATCH 2/3] fallback

---
 src/components/component_preview/component_preview.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/component_preview/component_preview.vue b/src/components/component_preview/component_preview.vue
index 873f7e61..3b2cf63b 100644
--- a/src/components/component_preview/component_preview.vue
+++ b/src/components/component_preview/component_preview.vue
@@ -166,7 +166,7 @@
     }
 
     .preview-block {
-      background: var(--background);
+      background: var(--background, var(--bg));
       display: flex;
       justify-content: center;
       align-items: center;

From 05ab57a8e68033b520e6038afaa6514423f0d117 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 29 Sep 2024 19:23:32 +0300
Subject: [PATCH 3/3] better disabled indication

---
 src/components/select/select.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/select/select.vue b/src/components/select/select.vue
index 39d3ca64..0fb6fcc0 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;
         }
       }