From cdb1fd4c9fbc49b5997c865480e0efe3139a19c0 Mon Sep 17 00:00:00 2001
From: Alex Turchyn <lexfox777@gmail.com>
Date: Thu, 1 Jun 2023 01:58:00 +0300
Subject: [PATCH] adjust doc preview buttons style

---
 app/javascript/template_builder/preview.vue | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/app/javascript/template_builder/preview.vue b/app/javascript/template_builder/preview.vue
index 61be1f8f..fafbdfb7 100644
--- a/app/javascript/template_builder/preview.vue
+++ b/app/javascript/template_builder/preview.vue
@@ -15,9 +15,10 @@
         <div
           class="flex flex-col justify-between opacity-0 group-hover:opacity-100"
         >
-          <div>
+          <div class="rounded-bl rounded-tr bg-white border">
             <button
-              class="px-1.5 rounded bg-white border border-red-400 text-red-400 hover:bg-red-50"
+              class="rounded-bl rounded-tr hover:text-base-100 hover:bg-base-content w-full transition-colors"
+              style="width: 24px"
               @click.stop="$emit('remove', item)"
             >
               &times;
@@ -25,16 +26,18 @@
           </div>
           <div
             v-if="withArrows"
-            class="flex flex-col"
+            class="flex flex-col border rounded-br rounded-tl bg-white divide-y"
           >
             <button
-              class="px-1.5"
+              class="rounded-tl hover:text-base-100 hover:bg-base-content w-full transition-colors"
+              style="width: 24px"
               @click.stop="$emit('up', item)"
             >
               &uarr;
             </button>
             <button
-              class="px-1.5"
+              class="rounded-br hover:text-base-100 hover:bg-base-content w-full transition-colors"
+              style="width: 24px"
               @click.stop="$emit('down', item)"
             >
               &darr;