From d09dd23bc8dd1b6c6b43a89083a3e4d274bb069b Mon Sep 17 00:00:00 2001
From: Simon Cambier <simon.cambier@protonmail.com>
Date: Tue, 20 Sep 2022 12:52:04 +0200
Subject: [PATCH] #97 - Fixing layout

---
 src/components/ModalInFile.svelte | 37 ++++++++++++++++++-------------
 src/components/ModalVault.svelte  | 28 ++++++++++++-----------
 src/modals.ts                     |  4 ++--
 3 files changed, 38 insertions(+), 31 deletions(-)

diff --git a/src/components/ModalInFile.svelte b/src/components/ModalInFile.svelte
index b63d854..298023a 100644
--- a/src/components/ModalInFile.svelte
+++ b/src/components/ModalInFile.svelte
@@ -141,23 +141,28 @@
 </script>
 
 <div class="modal-title">Omnisearch - File</div>
-<InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} />
+<div class="modal-content">
+  <InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} />
+
+  <ModalContainer>
+    {#if groupedOffsets.length && note}
+      {#each groupedOffsets as offset, i}
+        <ResultItemInFile
+          {offset}
+          {note}
+          index={i}
+          selected={i === selectedIndex}
+          on:mousemove={e => (selectedIndex = i)}
+          on:click={openSelection} />
+      {/each}
+    {:else}
+      <div style="text-align: center;">
+        We found 0 result for your search here.
+      </div>
+    {/if}
+  </ModalContainer>
+</div>
 
-<ModalContainer>
-  {#if groupedOffsets.length && note}
-    {#each groupedOffsets as offset, i}
-      <ResultItemInFile
-        {offset}
-        {note}
-        index={i}
-        selected={i === selectedIndex}
-        on:mousemove={e => (selectedIndex = i)}
-        on:click={openSelection} />
-    {/each}
-  {:else}
-    <center> We found 0 result for your search here. </center>
-  {/if}
-</ModalContainer>
 <div class="prompt-instructions">
   <div class="prompt-instruction">
     <span class="prompt-instruction-command">↑↓</span><span>to navigate</span>
diff --git a/src/components/ModalVault.svelte b/src/components/ModalVault.svelte
index c0cab8a..285ebff 100644
--- a/src/components/ModalVault.svelte
+++ b/src/components/ModalVault.svelte
@@ -181,20 +181,22 @@
 </script>
 
 <div class="modal-title">Omnisearch - Vault</div>
-<InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} />
+<div class="modal-content">
+  <InputSearch value={searchQuery} on:input={e => (searchQuery = e.detail)} />
 
-<ModalContainer>
-  {#each resultNotes as result, i}
-    <ResultItemVault
-      selected={i === selectedIndex}
-      note={result}
-      on:mousemove={e => (selectedIndex = i)}
-      on:click={onClick} />
-  {/each}
-  {#if !resultNotes.length && searchQuery}
-    <center> We found 0 result for your search here. </center>
-  {/if}
-</ModalContainer>
+  <ModalContainer>
+    {#each resultNotes as result, i}
+      <ResultItemVault
+        selected={i === selectedIndex}
+        note={result}
+        on:mousemove={e => (selectedIndex = i)}
+        on:click={onClick} />
+    {/each}
+    {#if !resultNotes.length && searchQuery}
+      <center> We found 0 result for your search here. </center>
+    {/if}
+  </ModalContainer>
+</div>
 
 <div class="prompt-instructions">
   <div class="prompt-instruction">
diff --git a/src/modals.ts b/src/modals.ts
index 91ee5e7..3c70032 100644
--- a/src/modals.ts
+++ b/src/modals.ts
@@ -9,13 +9,13 @@ abstract class OmnisearchModal extends Modal {
   constructor(app: App) {
     super(app)
 
-    // Remove all the default modal's children (except the close button)
+    // Remove all the default modal's children
     // so that we can more easily customize it
     const closeEl = this.containerEl.find('.modal-close-button')
     this.modalEl.replaceChildren()
     this.modalEl.append(closeEl)
     this.modalEl.addClass('omnisearch-modal', 'prompt')
-    this.modalEl.removeClass('modal')
+    // this.modalEl.removeClass('modal')
     this.modalEl.tabIndex = -1
 
     // Setup events that can be listened through the event bus