From b4a9900efcd0a03ddd3e8b69acfccfe0266589bb Mon Sep 17 00:00:00 2001
From: Jaroslav Drzik <jaro@ttx.sk>
Date: Mon, 8 Jan 2024 20:57:45 +0100
Subject: [PATCH] Design cleanup

---
 resources/js/Pages/IkeaRoot.vue | 42 ++++++++++++++++++---------------
 1 file changed, 23 insertions(+), 19 deletions(-)

diff --git a/resources/js/Pages/IkeaRoot.vue b/resources/js/Pages/IkeaRoot.vue
index 2310e75..854dec7 100644
--- a/resources/js/Pages/IkeaRoot.vue
+++ b/resources/js/Pages/IkeaRoot.vue
@@ -105,7 +105,7 @@ const options = {
   region: 150,
 
   width: 500,
-  height: 500,
+  height: 310,
 };
 
 const chart_settings = {
@@ -298,10 +298,29 @@ const submit = () => {
 <template>
   <GuestLayout>
     <div class="flex flex-wrap gap-2 justify-center align-middle ">
-      <div class="justify-center rounded-md border-black border-8 max-h-[518px]">
+      <div class="flex flex-col start-0">
+      <div class="justify-center rounded-md border-black border-8 max-h-[328px]">
         <GChart :events="gchartEvents" :type="type" :data="ccountry_filter" :options="options"
           :settings="chart_settings" />
       </div>
+      <div>
+        <span class="font-extrabold font-mono">Currency recalculation</span>
+      </div>
+      <div>
+        <multiselect v-model="form.currency" :multiple="false" :allow-empty="false" placeholder="Currency"
+          :searchable="true" :options="currency" @select="onSelectCurrency" />
+      </div>
+      <div class="flex flex-col start-0">
+        <span class="font-extrabold font-mono">Results</span>
+      </div>
+      <div>
+        <EasyTable :rows-per-page=15 :headers="hproducts" :items="tproducts" alternating>
+          <template #item-name="{ name, url }">
+            <a class="underline" target="_blank" :href="url">{{ name }}</a>
+          </template>
+        </EasyTable>
+      </div>
+    </div>
       <div class="mr-auto">
         <form @submit.prevent="submit">
           <div class="flex flex-col start-0">
@@ -362,24 +381,9 @@ const submit = () => {
         </div>
       </div>
       <div>
-        <div>
-          <span class="font-extrabold font-mono">Currency recalculation</span>
-        </div>
-        <div>
-          <multiselect v-model="form.currency" :multiple="false" :allow-empty="false" placeholder="Currency"
-            :searchable="true" :options="currency" @select="onSelectCurrency" />
-        </div>
+        
 
-        <div class="flex flex-col start-0">
-          <span class="font-extrabold font-mono">Results</span>
-        </div>
-        <div>
-          <EasyTable :rows-per-page=15 :headers="hproducts" :items="tproducts" alternating>
-            <template #item-name="{ name, url }">
-              <a class="underline" target="_blank" :href="url">{{ name }}</a>
-            </template>
-          </EasyTable>
-        </div>
+        
       </div>
     </div>