Added ability to put header buttons into a modal.

Changed the modal version of the view and edit form to use that
OrtooApps · Dec 15, 2021 · 49ccd1a · 49ccd1a
1 parent 03cbe45
commit 49ccd1a
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 19 deletions.
diff --git a/framework/default/ortoo-core/default/lwc/modal/modal.html b/framework/default/ortoo-core/default/lwc/modal/modal.html
@@ -26,9 +26,14 @@
                             ></lightning-icon>
                             <span class="slds-assistive-text">{labels.close}</span>
                         </button>
-                        <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">
-                            <slot name="title"></slot>
-                        </h2>
+                        <div class="slds-grid">
+                            <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate slds-has-flexi-truncate">
+                                <slot name="title"></slot>
+                            </h2>
+                            <div class="slds-no-flex">
+                                <slot name="header-buttons"></slot>
+                            </div>
+                        </div>
                     </header>
 
                     <div class="slds-modal__content slds-p-around_medium" id="modal-content-id-1">

diff --git a/framework/default/ortoo-core/default/lwc/viewAndEditForm/viewAndEditForm-modal.html b/framework/default/ortoo-core/default/lwc/viewAndEditForm/viewAndEditForm-modal.html
@@ -10,32 +10,29 @@
             <slot name="title"></slot>
         </div>
 
-        <div slot="contents">
+        <lightning-button-group if:false={inEditMode} slot="header-buttons">
 
-            <template if:false={inEditMode}>
+            <slot name="additionalViewButtons"></slot>
 
-                <!-- TODO: where do these go? -->
-                <lightning-button-group>
-                    <slot name="additionalViewButtons"></slot>
+            <lightning-button
+                class="slds-float_right"
+                variant="default"
+                name="edit"
+                data-name="edit"
+                label={editButtonLabel}
+                onclick={handleEditClick}
+            ></lightning-button>
 
-                    <lightning-button
-                        class="slds-m-top_small slds-float_right"
-                        variant="default"
-                        name="edit"
-                        data-name="edit"
-                        label={editButtonLabel}
-                        onclick={handleEditClick}
-                    ></lightning-button>
-                </lightning-button-group>
+        </lightning-button-group>
 
+        <div slot="contents">
+            <template if:false={inEditMode}>
                 <slot name="viewForm"></slot>
-
             </template>
 
             <template if:true={inEditMode}>
                 <slot name="editForm"></slot>
             </template>
-
         </div>
 
         <div slot="footer" if:true={inEditMode}>