From 7ea9bed8cab6c6956487cded2e216635891d0ee7 Mon Sep 17 00:00:00 2001
From: hollymvargas <hmvargas@umich.edu>
Date: Thu, 20 Apr 2023 15:44:44 -0400
Subject: [PATCH 1/2] Fixes the issue where the submit buttons are not visible
 on the extension confirmation modal on mobile.

The problem had to do with padding styling that was attached to the modal-footer class. Instead of removing that styling, as I didn't know what other modals used it, I decided to use bootstrap5 classes that override the padding for the buttons.

Resolves: #12230
---
 .../extension-confirm-modal.component.html                      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/web/app/components/extension-confirm-modal/extension-confirm-modal.component.html b/src/web/app/components/extension-confirm-modal/extension-confirm-modal.component.html
index 8d69b71a689..beaa2a96a56 100644
--- a/src/web/app/components/extension-confirm-modal/extension-confirm-modal.component.html
+++ b/src/web/app/components/extension-confirm-modal/extension-confirm-modal.component.html
@@ -163,7 +163,7 @@ <h1>Instructors</h1>
 
   <br>
 
-  <div class="modal-footer">
+  <div class="modal-footer py-1 px-3">
     <button type="button" class="btn btn-light" (click)="activeModal.dismiss()">No, cancel the Operation</button>
     <button *ngIf="isExtendModal()" type="button" class="btn btn-success modal-btn-ok"
       (click)="onConfirm()">Confirm</button>

From 1cf60054c73971fc7eda33f647608251a93b02ef Mon Sep 17 00:00:00 2001
From: hollymvargas <hmvargas@umich.edu>
Date: Fri, 21 Apr 2023 10:34:56 -0400
Subject: [PATCH 2/2] Modifies a snapshot test to properly reflect new changes
 to the extension confirmation modal.

Changed the line that was failing to match the new changes I made.

Related to: #12230
---
 .../extension-confirm-modal.component.spec.ts.snap              | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/web/app/components/extension-confirm-modal/__snapshots__/extension-confirm-modal.component.spec.ts.snap b/src/web/app/components/extension-confirm-modal/__snapshots__/extension-confirm-modal.component.spec.ts.snap
index c2a5e5e8839..291cb5a962c 100644
--- a/src/web/app/components/extension-confirm-modal/__snapshots__/extension-confirm-modal.component.spec.ts.snap
+++ b/src/web/app/components/extension-confirm-modal/__snapshots__/extension-confirm-modal.component.spec.ts.snap
@@ -202,7 +202,7 @@ exports[`ExtensionConfirmModalComponent should snap with the extended students a
     </div>
     <br />
     <div
-      class="modal-footer"
+      class="modal-footer py-1 px-3"
     >
       <button
         class="btn btn-light"