feature: add custom_css block in theme editor for components

Author: cdxker

clients/trieve-shopify-extension/.env.dist

@@ -4,3 +4,9 @@ TRIEVE_BASE_URL=http://localhost:8090
 SHOPIFY_THEME_APP_EXTENSION_UUID=f76c64354373934b7e5b794c7070f51a
 SHOPIFY_PRICING_URL="shopify://admin/charges/densumes-trieve-extension/pricing_plans?test=true"
 SHOPIFY_SECRET_KEY=foobar
+
+# For Judge.me authentication
+JUDGE_ME_CLIENT_ID=""
+JUDGE_ME_SECRET=""
+# REMIX server url + /auth/judgeme/callback (e.g. http://localhost:3000/auth/judgeme/callback)
+JUDGE_ME_REDIRECT_URI=""

clients/trieve-shopify-extension/extensions/global-search/blocks/global_component.liquid

@@ -1,3 +1,7 @@
+<style>
+    {{ block.settings.custom_css }}
+</style>
+
 <script type="module">
   import {renderToDiv} from 'https://cdn.trieve.ai/beta/search-component/vanilla/index.js';
   import {addToCart, checkCartQuantity} from '{{'cart-manager.js' | asset_url}}';
@@ -165,6 +169,12 @@
         { "label": "Right", "value": "right" }
       ],
       "default": "left"
+    },
+    {
+      "id": "custom_css",
+      "type": "textarea",
+      "label": "Custom CSS",
+      "placeholder": "#trieve-modal-search { background-color: red; }"
     }
   ]
 }

clients/trieve-shopify-extension/extensions/global-search/blocks/inline_component.liquid

@@ -1,3 +1,7 @@
+<style>
+    {{ block.settings.custom_css }}
+</style>
+
 <div class="trieve-inline-root"></div>
 
 <script type="module">
@@ -127,6 +131,12 @@
       "type": "textarea",
       "label": "Initial Questions (Separated by commas)",
       "placeholder": "What is this made of?"
+    },
+    {
+      "id": "custom_css",
+      "type": "textarea",
+      "label": "Custom CSS",
+      "placeholder": ".trieve-inline-root { background-color: red; }"
     }
   ]
 }