From 4d413dde8041859045ebbfc81e33116f94ec2ad2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Ml=C3=A1dek?= <t@mldk.cz>
Date: Mon, 3 Jan 2022 22:31:51 +0100
Subject: [PATCH] fix native open button, button align

---
 ui/src/components/display/UpObject.svelte | 18 ++++++++++++------
 ui/src/components/utils/IconButton.svelte |  3 +++
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/ui/src/components/display/UpObject.svelte b/ui/src/components/display/UpObject.svelte
index ff3019c..953a58e 100644
--- a/ui/src/components/display/UpObject.svelte
+++ b/ui/src/components/display/UpObject.svelte
@@ -7,7 +7,7 @@
   import { useEntity } from "../../lib/entity";
   import { readable } from "svelte/store";
   import { notify, UpNotification } from "../../notifications";
-import IconButton from "../utils/IconButton.svelte";
+  import IconButton from "../utils/IconButton.svelte";
   const dispatch = createEventDispatcher();
 
   export let address: string;
@@ -88,11 +88,13 @@ import IconButton from "../utils/IconButton.svelte";
     {/if}
   </div>
   {#if banner && isFile}
-    <IconButton
-      name="arrow-up-right-circle"
-      on:click={nativeOpen}
-      title="Open in default application..."
-    />
+    <div class="icon">
+      <IconButton
+        name="window-open"
+        on:click={nativeOpen}
+        title="Open in default application..."
+      />
+    </div>
   {/if}
 </div>
 
@@ -131,6 +133,10 @@ import IconButton from "../utils/IconButton.svelte";
     width: 0.5em;
   }
 
+  .icon {
+    margin: 0 .25em;
+  }
+
   .resolving {
     opacity: 0.7;
   }
diff --git a/ui/src/components/utils/IconButton.svelte b/ui/src/components/utils/IconButton.svelte
index 9eda53f..24d6835 100644
--- a/ui/src/components/utils/IconButton.svelte
+++ b/ui/src/components/utils/IconButton.svelte
@@ -19,6 +19,9 @@
     color: inherit;
     opacity: 0.66;
 
+    display: flex;
+    align-items: center;
+
     transition: opacity 0.2s, color 0.2s;
   }