From 7821aebd68001c09a911b15a3fc76e539585d70c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rn-Michael=20Miehe?= <jmm@yavook.de>
Date: Thu, 7 Sep 2023 17:32:53 +0000
Subject: [PATCH] layout improvements (more bulma)

---
 ui/src/components/BulmaButton.vue   |  8 +++-----
 ui/src/components/DoorMapEditor.vue | 25 +++++++++++++++----------
 2 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/ui/src/components/BulmaButton.vue b/ui/src/components/BulmaButton.vue
index 11f8892..809d991 100644
--- a/ui/src/components/BulmaButton.vue
+++ b/ui/src/components/BulmaButton.vue
@@ -1,11 +1,9 @@
 <template>
   <button class="button">
-    <span class="icon-text">
-      <span v-if="icon !== undefined" class="icon">
-        <font-awesome-icon :icon="icon" />
-      </span>
-      <span><slot name="default" /></span>
+    <span v-if="icon !== undefined" class="icon">
+      <font-awesome-icon :icon="icon" />
     </span>
+    <span><slot name="default" /></span>
   </button>
 </template>
 
diff --git a/ui/src/components/DoorMapEditor.vue b/ui/src/components/DoorMapEditor.vue
index 14012ea..d557b32 100644
--- a/ui/src/components/DoorMapEditor.vue
+++ b/ui/src/components/DoorMapEditor.vue
@@ -1,24 +1,29 @@
 <template>
-  <div class="box">
-    <p class="title is-4">Türchen bearbeiten</p>
+  <div class="panel">
+    <p class="panel-heading">Türchen bearbeiten</p>
 
-    <BulmaBreadcrumbs :steps="steps" v-model="current_step" />
+    <div class="panel-tabs">
+      <BulmaBreadcrumbs :steps="steps" v-model="current_step" />
+    </div>
 
-    <DoorPlacer v-if="current_step === 0" v-model:doors="doors" />
-    <DoorChooser v-if="current_step === 1" v-model:doors="doors" />
-    <template v-if="current_step === 2">
-      <Calendar :doors="doors" />
-      <BulmaButton class="is-success" @click.left="load_doors">
+    <div class="panel-block">
+      <DoorPlacer v-if="current_step === 0" v-model:doors="doors" />
+      <DoorChooser v-if="current_step === 1" v-model:doors="doors" />
+      <Calendar v-if="current_step === 2" :doors="doors" />
+    </div>
+
+    <div v-if="current_step === 2" class="panel-block">
+      <BulmaButton class="is-success is-fullwidth" @click.left="load_doors">
         Laden
       </BulmaButton>
       <BulmaButton
-        class="is-success"
+        class="is-success is-fullwidth"
         icon="fa-solid fa-crosshairs"
         @click.left="save_doors"
       >
         Speichern
       </BulmaButton>
-    </template>
+    </div>
   </div>
 </template>