adjust splitmodal styling

agiledev-students-fall2023 · Dec 7, 2023 · 5848bb5 · 5848bb5
1 parent 3f4ba79
commit 5848bb5
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 2 deletions.
diff --git a/front-end/src/components/ForgotPassword.jsx b/front-end/src/components/ForgotPassword.jsx
@@ -101,7 +101,7 @@ const ForgotPassword = () => {
 
           <div className="mt-4">
             <p>
-              No need to rest?{" "}
+              No need to reset?{" "}
               <a href="/" className="forgot-password-link">
                 Login
               </a>

diff --git a/front-end/src/components/SplitModal.js b/front-end/src/components/SplitModal.js
@@ -189,7 +189,7 @@ function SplitModal({
                         handlePercentageChange(e, participant._id)
                       }
                     />
-                    <span>% =</span>
+                    <span className="percentage-sign">%</span> <span className="equals-sign">=</span>
                     <span className="calculated-amount">
                       {" " +
                         "$" +

diff --git a/front-end/src/styles/SplitModal.css b/front-end/src/styles/SplitModal.css
@@ -66,6 +66,18 @@
     @apply whitespace-nowrap;
 }
 
+.percentage-sign {
+    margin-right: 3px;
+}
+
+.equals-sign {
+    padding-right: 4px; 
+}
+
+.participant-percentage-input {
+    margin-right: -4px;
+}
+
 /* Dark Mode for Split Modal */
 .dark-mode .split-modal-content {
     @apply bg-gray-900;