From defd28cacaec9e8285f4baaf9119f6424a38f665 Mon Sep 17 00:00:00 2001
From: Damien Elmes <gpg@ankiweb.net>
Date: Thu, 22 Apr 2021 18:11:27 +1000
Subject: [PATCH] more layout tweaks

- reduce maximum width
- de-emphasise revert and info buttons
- reduce grid margin
---
 ts/deckconfig/ConfigEntry.svelte   |  2 +-
 ts/deckconfig/HelpPopup.svelte     | 10 +++-------
 ts/deckconfig/RevertIcon.svelte    | 10 ++++++----
 ts/deckconfig/deckconfig-base.scss |  2 +-
 4 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/ts/deckconfig/ConfigEntry.svelte b/ts/deckconfig/ConfigEntry.svelte
index 29bca0511..083e88e6f 100644
--- a/ts/deckconfig/ConfigEntry.svelte
+++ b/ts/deckconfig/ConfigEntry.svelte
@@ -17,10 +17,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
 <style lang="scss">
     .outer {
-        margin-top: 1em;
         display: grid;
         grid-template-columns: 2fr 1fr;
         grid-column-gap: 0.5em;
+        grid-row-gap: 0.5em;
     }
 
     .full-grid-width {
diff --git a/ts/deckconfig/HelpPopup.svelte b/ts/deckconfig/HelpPopup.svelte
index 5ef6b95dc..15ccc9c15 100644
--- a/ts/deckconfig/HelpPopup.svelte
+++ b/ts/deckconfig/HelpPopup.svelte
@@ -21,16 +21,12 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 </script>
 
 <style>
-    :global(svg) {
+    span :global(svg) {
         vertical-align: text-bottom;
+        opacity: 0.3;
     }
 </style>
 
-<span
-    href={'#'}
-    bind:this={ref}
-    data-toggle="tooltip"
-    data-placement="bottom"
-    title={html}>
+<span bind:this={ref} title={html}>
     {@html infoCircle}
 </span>
diff --git a/ts/deckconfig/RevertIcon.svelte b/ts/deckconfig/RevertIcon.svelte
index 8c126ba01..13e4075c0 100644
--- a/ts/deckconfig/RevertIcon.svelte
+++ b/ts/deckconfig/RevertIcon.svelte
@@ -22,12 +22,14 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     }
 </script>
 
-<style>
+<style lang="scss">
     .img-div {
         display: flex;
-    }
-    :global(svg) {
-        align-self: center;
+
+        :global(svg) {
+            align-self: center;
+            opacity: 0.3;
+        }
     }
 </style>
 
diff --git a/ts/deckconfig/deckconfig-base.scss b/ts/deckconfig/deckconfig-base.scss
index 55fa7cf98..a758b7a46 100644
--- a/ts/deckconfig/deckconfig-base.scss
+++ b/ts/deckconfig/deckconfig-base.scss
@@ -20,7 +20,7 @@
 }
 
 body {
-    width: min(100vw, 40em);
+    width: min(100vw, 35em);
     margin: 0 auto;
     // leave some space for rounded screens
     margin-bottom: 2em;