From 08447ec4cf751d7bc5aa32fde078db56859a1548 Mon Sep 17 00:00:00 2001
From: Alex Turchyn <lexfox777@gmail.com>
Date: Mon, 28 Aug 2023 23:43:33 +0300
Subject: [PATCH] fix builder field button bg color

---
 app/javascript/application.js               |  1 +
 app/javascript/submission_form/form.vue     |  6 ++++++
 app/javascript/template_builder/builder.vue | 11 ++++++++++-
 app/javascript/template_builder/fields.vue  |  3 ++-
 4 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/app/javascript/application.js b/app/javascript/application.js
index 496bbbf4..3edc957a 100644
--- a/app/javascript/application.js
+++ b/app/javascript/application.js
@@ -74,6 +74,7 @@ window.customElements.define('template-builder', class extends HTMLElement {
 
     this.app = createApp(TemplateBuilder, {
       template: reactive(JSON.parse(this.dataset.template)),
+      backgroundColor: '#faf7f5',
       isDirectUpload: this.dataset.isDirectUpload === 'true'
     })
 
diff --git a/app/javascript/submission_form/form.vue b/app/javascript/submission_form/form.vue
index cfa3a64d..4334dc3f 100644
--- a/app/javascript/submission_form/form.vue
+++ b/app/javascript/submission_form/form.vue
@@ -24,6 +24,7 @@
     v-show="isFormVisible"
     id="form_container"
     class="shadow-md bg-base-100 absolute bottom-0 md:bottom-4 w-full border-base-200 border p-4 rounded"
+    :style="{ backgroundColor: backgroundColor }"
   >
     <button
       v-if="!isCompleted"
@@ -378,6 +379,11 @@ export default {
       required: false,
       default: ''
     },
+    backgroundColor: {
+      type: String,
+      required: false,
+      default: ''
+    },
     isDirectUpload: {
       type: Boolean,
       required: false,
diff --git a/app/javascript/template_builder/builder.vue b/app/javascript/template_builder/builder.vue
index c5edb515..a4443317 100644
--- a/app/javascript/template_builder/builder.vue
+++ b/app/javascript/template_builder/builder.vue
@@ -84,7 +84,10 @@
           @down="moveDocument(item, 1)"
           @change="save"
         />
-        <div class="sticky bottom-0 bg-base-100 py-2">
+        <div
+          class="sticky bottom-0 py-2"
+          :class="{ 'bg-base-100': withStickySubmitters }"
+        >
           <Upload
             v-if="sortedDocuments.length"
             :template-id="template.id"
@@ -233,6 +236,7 @@ export default {
       template: this.template,
       save: this.save,
       baseFetch: this.baseFetch,
+      backgroundColor: this.backgroundColor,
       selectedAreaRef: computed(() => this.selectedAreaRef)
     }
   },
@@ -246,6 +250,11 @@ export default {
       required: false,
       default: false
     },
+    backgroundColor: {
+      type: String,
+      required: false,
+      default: ''
+    },
     baseUrl: {
       type: String,
       required: false,
diff --git a/app/javascript/template_builder/fields.vue b/app/javascript/template_builder/fields.vue
index 0cb9fa8f..b1f44e2b 100644
--- a/app/javascript/template_builder/fields.vue
+++ b/app/javascript/template_builder/fields.vue
@@ -30,6 +30,7 @@
       :key="type"
       draggable="true"
       class="flex items-center justify-center border border-dashed border-base-300 w-full rounded relative"
+      :style="{ backgroundColor: backgroundColor }"
       @dragstart="onDragstart(type)"
       @dragend="$emit('drag-end')"
       @click="addField(type)"
@@ -101,7 +102,7 @@ export default {
     Field,
     FieldSubmitter
   },
-  inject: ['save'],
+  inject: ['save', 'backgroundColor'],
   props: {
     fields: {
       type: Array,