colors and filters

front/js/svelte/records/elements/ReferenceInlineButtons.svelte

@@ -3,17 +3,15 @@
     import Icon from "../../common/Icon.svelte";
     import InlineEdit from "../InlineEdit.svelte";
     import Dialog from "../../dialog/Dialog.svelte";
-
+    import DialogRecord from "../../dialog/DialogRecord.svelte";
+    import axios from "axios";
     const dispatch = createEventDispatcher();
-    // export let field;
-    // export let buttonLabel = "";
-    // export let buttonClass = "";
-
     const channel = getContext("channel");
     export let schemas;
     export let recordId;
     $: showOptions = false;
     let browseModal;
+    let dialogRecord;
     let inLineCreateRecord;
 
     function openBrowseModal(e, schema) {
@@ -25,6 +23,7 @@
         e.preventDefault();
         console.log("Save inline");
         inLineCreateRecord = null;
+        dialogRecord.close()
         dispatch("save", {
             records: e.detail.records,
             after: recordId,
@@ -47,6 +46,7 @@
             .get(channel.lucentUrl + "/records/newInline?schema=" + schemaUId)
             .then((response) => {
                 inLineCreateRecord = response.data;
+                dialogRecord.open()
                 showOptions = false;
             })
             .catch((error) => {
@@ -95,53 +95,31 @@
     {/if}
 {:else}
     <div style="display:flex;align-items: center;gap: 4px">
-            <button
-                    class="button"
-                    on:click={(e) => createInlineReference(e, schemas[0].name)}
-            >New
-            </button>
-            <button
-                    class="button"
-                    on:click={(e) => openBrowseModal(e, schemas[0].name)}
-            >
-                <Icon icon="magnifying-glass"/>
-            </button
-            >
+        <button
+                class="button"
+                on:click={(e) => createInlineReference(e, schemas[0].name)}
+        >New
+        </button>
+        <button
+                class="button"
+                on:click={(e) => openBrowseModal(e, schemas[0].name)}
+        >
+            <Icon icon="magnifying-glass"/>
+        </button
+        >
     </div>
 {/if}
 
-{#if inLineCreateRecord}
-    <InlineEdit
-            {...inLineCreateRecord}
-            on:cancel={(e) => (inLineCreateRecord = null)}
-            on:inlinesaved={save}
-    />
-{/if}
+<DialogRecord bind:this={dialogRecord}>
+    {#if inLineCreateRecord}
+
+        <InlineEdit
+                {...inLineCreateRecord}
+                on:cancel={(e) => (inLineCreateRecord = null)}
+                on:inlinesaved={save}
+        />
+
+    {/if}
+</DialogRecord>
 
 <Dialog bind:this={browseModal} on:insert={insert}/>
-
-<style>
-    :global(.inline-card-wrapper) {
-        display: flex;
-        flex-direction: column;
-    }
-
-    :global(.inline-card-wrapper .inline-card-button) {
-        visibility: hidden;
-    }
-
-    :global(.inline-card-wrapper .inline-card-button.is-first) {
-        visibility: visible;
-    }
-
-    :global(.inline-card-wrapper:hover .inline-card-button) {
-        visibility: visible;
-    }
-
-    .inline-card-button {
-        /* padding: 0 5px; */
-        display: inline-block;
-        z-index: 1;
-        margin: 10px auto 0;
-    }
-</style>