From fdd030652ec2bdb5efbcbbdbbe1c5529433b8344 Mon Sep 17 00:00:00 2001 From: Pete Matsyburka Date: Thu, 15 May 2025 13:59:06 +0300 Subject: [PATCH] adjust border --- app/javascript/elements/dashboard_dropzone.js | 12 ++++++------ app/javascript/elements/file_dropzone.js | 4 ++-- app/javascript/template_builder/dropzone.vue | 7 ++++++- app/javascript/template_builder/hover_dropzone.vue | 3 +++ app/views/shared/_classes.html.erb | 2 +- app/views/templates/_dropzone.html.erb | 2 +- 6 files changed, 19 insertions(+), 11 deletions(-) diff --git a/app/javascript/elements/dashboard_dropzone.js b/app/javascript/elements/dashboard_dropzone.js index 3ac0a4c7..60cd0b91 100644 --- a/app/javascript/elements/dashboard_dropzone.js +++ b/app/javascript/elements/dashboard_dropzone.js @@ -168,10 +168,10 @@ export default targetable(class extends HTMLElement { if (this.classList.contains('before:border-base-300')) { this.classList.remove('before:border-base-300') - this.classList.add('before:border-base-content/50') + this.classList.add('before:border-base-content/30') } else if (this.classList.contains('border-base-300')) { this.classList.remove('border-base-300') - this.classList.add('border-base-content/50') + this.classList.add('border-base-content/30') } } } @@ -179,11 +179,11 @@ export default targetable(class extends HTMLElement { onDragleave () { this.style.backgroundColor = null - if (this.classList.contains('before:border-base-content/50')) { - this.classList.remove('before:border-base-content/50') + if (this.classList.contains('before:border-base-content/30')) { + this.classList.remove('before:border-base-content/30') this.classList.add('before:border-base-300') - } else if (this.classList.contains('border-base-content/50')) { - this.classList.remove('border-base-content/50') + } else if (this.classList.contains('border-base-content/30')) { + this.classList.remove('border-base-content/30') this.classList.add('border-base-300') } } diff --git a/app/javascript/elements/file_dropzone.js b/app/javascript/elements/file_dropzone.js index 02fc1083..12ef253d 100644 --- a/app/javascript/elements/file_dropzone.js +++ b/app/javascript/elements/file_dropzone.js @@ -28,13 +28,13 @@ export default actionable(targetable(class extends HTMLElement { if (e.dataTransfer?.types?.includes('Files')) { this.style.backgroundColor = '#F7F3F0' this.classList.remove('border-base-300', 'hover:bg-base-200/30') - this.classList.add('border-base-content/50') + this.classList.add('border-base-content/30') } } onDragleave () { this.style.backgroundColor = null - this.classList.remove('border-base-content/50') + this.classList.remove('border-base-content/30') this.classList.add('border-base-300', 'hover:bg-base-200/30') } diff --git a/app/javascript/template_builder/dropzone.vue b/app/javascript/template_builder/dropzone.vue index e6f0030d..9031f3d1 100644 --- a/app/javascript/template_builder/dropzone.vue +++ b/app/javascript/template_builder/dropzone.vue @@ -10,7 +10,7 @@ id="document_dropzone" class="w-full relative rounded-md border-2 border-base-content/10 border-dashed" :for="inputId" - :class="{ 'opacity-50': isLoading, 'hover:bg-base-200/50': !isDragEntering, 'bg-base-200/50 border-base-content/50': isDragEntering }" + :class="{ 'opacity-50': isLoading, 'hover:bg-base-200/50': withHoverClass && !isDragEntering, 'bg-base-200/50 border-base-content/30': isDragEntering }" >
@@ -79,6 +79,11 @@ export default { type: [Number, String], required: true }, + withHoverClass: { + type: Boolean, + required: false, + default: true + }, icon: { type: String, required: false, diff --git a/app/javascript/template_builder/hover_dropzone.vue b/app/javascript/template_builder/hover_dropzone.vue index 54a495c1..5b3ff397 100644 --- a/app/javascript/template_builder/hover_dropzone.vue +++ b/app/javascript/template_builder/hover_dropzone.vue @@ -9,6 +9,7 @@ icon="IconFilePlus" :template-id="templateId" :accept-file-types="acceptFileTypes" + :with-hover-class="false" :with-description="false" :title="t('add_a_new_document')" type="add_files" @@ -22,6 +23,7 @@ icon="IconFileSymlink" :template-id="templateId" :accept-file-types="acceptFileTypes" + :with-hover-class="false" :with-description="false" :title="t('replace_existing_document')" @loading="isLoading = $event" @@ -34,6 +36,7 @@ icon="IconFiles" :template-id="templateId" :accept-file-types="acceptFileTypes" + :with-hover-class="false" :with-description="false" :clone-template-on-upload="true" :title="t('clone_and_replace_documents')" diff --git a/app/views/shared/_classes.html.erb b/app/views/shared/_classes.html.erb index d34b62e7..7069b153 100644 --- a/app/views/shared/_classes.html.erb +++ b/app/views/shared/_classes.html.erb @@ -1 +1 @@ -<% 'stats stat stat-figure stat-title stat-value text-accent w-fit hover:bg-white dropdown-open border-base-content/50 before:border-base-content/50' %> +<% 'stats stat stat-figure stat-title stat-value text-accent w-fit hover:bg-white dropdown-open border-base-content/30 before:border-base-content/30' %> diff --git a/app/views/templates/_dropzone.html.erb b/app/views/templates/_dropzone.html.erb index 766fb0dc..124efa83 100644 --- a/app/views/templates/_dropzone.html.erb +++ b/app/views/templates/_dropzone.html.erb @@ -3,7 +3,7 @@