From 42762f591c4e967e7268c27f00101f67e96755a5 Mon Sep 17 00:00:00 2001
From: Artemy Egorov <artegoser@gmail.com>
Date: Sun, 28 Jul 2024 18:46:01 +0300
Subject: [PATCH] fix: draggable block

---
 src/app.css                      |  2 +-
 src/lib/components/Block.svelte  | 12 +++++++++---
 src/lib/components/TopBar.svelte |  5 +++--
 src/routes/+page.svelte          |  2 +-
 4 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/app.css b/src/app.css
index e80461b..ccbf804 100644
--- a/src/app.css
+++ b/src/app.css
@@ -46,7 +46,7 @@ body {
 }
 
 .block {
-  @apply p-3 rounded-xl bg-block;
+  @apply p-2 rounded-xl bg-block;
 }
 
 .sidebar {
diff --git a/src/lib/components/Block.svelte b/src/lib/components/Block.svelte
index aae94d2..83c6a26 100644
--- a/src/lib/components/Block.svelte
+++ b/src/lib/components/Block.svelte
@@ -3,6 +3,12 @@
   export let draggable = false;
 </script>
 
-<div class="block{className ? ` ${className}` : ''}">
-  <slot />
-</div>
+{#if draggable}
+  <div class="block{className ? ` ${className}` : ''}" data-tauri-drag-region>
+    <slot />
+  </div>
+{:else}
+  <div class="block{className ? ` ${className}` : ''}">
+    <slot />
+  </div>
+{/if}
diff --git a/src/lib/components/TopBar.svelte b/src/lib/components/TopBar.svelte
index 5690865..ff84c88 100644
--- a/src/lib/components/TopBar.svelte
+++ b/src/lib/components/TopBar.svelte
@@ -4,6 +4,7 @@
   import Reload from "$lib/icons/Reload.svelte";
   import SidebarLeft from "$lib/icons/SidebarLeft.svelte";
   import SidebarRight from "$lib/icons/SidebarRight.svelte";
+  import Block from "./Block.svelte";
   import Button from "./Button.svelte";
 
   export let onSidebarToggle = () => {};
@@ -18,7 +19,7 @@
 </script>
 
 <div class="top-bar">
-  <div class="flex bg-block p-2 rounded-xl">
+  <Block className="flex">
     <Button onClick={onSidebarToggle}>
       {#if sidebarOpen}
         <SidebarLeft />
@@ -29,7 +30,7 @@
     <Button onClick={onBack}><ArrowLeft /></Button>
     <Button onClick={onForward}><ArrowRight /></Button>
     <Button onClick={onInput}><Reload /></Button>
-  </div>
+  </Block>
 
   <input
     type="text"
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index f6173b2..4fd8a20 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -18,7 +18,7 @@
 </script>
 
 <div class="common-window" data-tauri-drag-region>
-  <Block className={`sidebar${sidebarOpen ? "" : " collapsed"}`}>
+  <Block className={`sidebar${sidebarOpen ? "" : " collapsed"}`} draggable>
     {#if sidebarOpen}
       <div transition:slide={{ axis: "x", duration: 100 }}>
         <WindowControls />