Change Cancel/Close buttons to secondary (outlined) style (#1926)

hackforla · Oct 31, 2024 · 06e0dd5 · 06e0dd5
1 parent 81839f3
commit 06e0dd5
Show file tree

Hide file tree

Showing 13 changed files with 15 additions and 13 deletions.
diff --git a/client/src/components/Authorization/Login.jsx b/client/src/components/Authorization/Login.jsx
@@ -181,7 +181,7 @@ const Login = () => {
                   >
                     <Button
                       color="colorDefault"
-                      variant="text"
+                      variant="outlined"
                       onClick={() => {
                         navigate("/calculation/1/0");
                       }}

diff --git a/client/src/components/Faq/DeleteFaqModal.jsx b/client/src/components/Faq/DeleteFaqModal.jsx
@@ -43,7 +43,7 @@ const DeleteFaqModal = ({ isModalOpen, closeModal, handleDelete, isFaq }) => {
         {`Are you sure you want to permanently delete the ${type}?`}
       </div>
       <div className={classes.buttonFlexBox}>
-        <Button onClick={closeModal} variant="text" id="cancelButton">
+        <Button onClick={closeModal} variant="outlined" id="cancelButton">
           Cancel
         </Button>
         <Button onClick={handleDelete} variant="contained" color={"colorError"}>

diff --git a/client/src/components/Faq/SaveConfirmationModal.jsx b/client/src/components/Faq/SaveConfirmationModal.jsx
@@ -42,7 +42,7 @@ const SaveConfirmationModal = ({ isOpen, onClose, onYes }) => {
         {"Are you sure you want to save FAQ page edits?"}
       </div>
       <div className={classes.buttonFlexBox}>
-        <Button onClick={onClose} variant="text" id="cancelButton">
+        <Button onClick={onClose} variant="outlined" id="cancelButton">
           Cancel
         </Button>
         <Button onClick={onYes} variant="contained" color={"colorPrimary"}>

diff --git a/client/src/components/ProjectWizard/AffordableEdgeCaseModal.jsx b/client/src/components/ProjectWizard/AffordableEdgeCaseModal.jsx
@@ -62,7 +62,7 @@ const AffordableEdgeCaseModal = ({ isOpen, onClose, onYes }) => {
             {`100% affordable housing of less than 50 units are exempt from the TDM Ordinance. Did you intend to change to 100% Affordable Housing?`}
           </div>
           <div className={classes.buttonFlexBox}>
-            <Button onClick={onClose} variant="text" id="cancelButton">
+            <Button onClick={onClose} variant="outlined" id="cancelButton">
               NO
             </Button>
             <Button onClick={onYes} variant="contained" color={"colorPrimary"}>

diff --git a/client/src/components/ProjectWizard/NavConfirmDialog.jsx b/client/src/components/ProjectWizard/NavConfirmDialog.jsx
@@ -46,7 +46,7 @@ const NavConfirmDialog = ({ blocker }) => {
       <div className={classes.modalActions}>
         <Button
           color="colorCancel"
-          variant="text"
+          variant="outlined"
           id="modalCancel"
           data-testid="transitionCancel"
           onClick={() => blocker.reset()}

diff --git a/client/src/components/Projects/ColumnHeaderPopups/DatePopup.jsx b/client/src/components/Projects/ColumnHeaderPopups/DatePopup.jsx
@@ -96,7 +96,7 @@ const DatePopup = ({
 
       <hr style={{ width: "100%" }} />
       <div style={{ display: "flex" }}>
-        <Button onClick={setDefault} variant="text">
+        <Button onClick={setDefault} variant="outlined">
           Reset
         </Button>
         <Button

diff --git a/client/src/components/Projects/ColumnHeaderPopups/StatusPopup.jsx b/client/src/components/Projects/ColumnHeaderPopups/StatusPopup.jsx
@@ -119,7 +119,7 @@ const StatusPopup = ({
       </div>
       <hr style={{ width: "100%" }} />
       <div style={{ display: "flex" }}>
-        <Button onClick={setDefault} variant="text">
+        <Button onClick={setDefault} variant="outlined">
           Reset
         </Button>
         <Button

diff --git a/client/src/components/Projects/ColumnHeaderPopups/TextPopup.jsx b/client/src/components/Projects/ColumnHeaderPopups/TextPopup.jsx
@@ -213,7 +213,7 @@ const TextPopup = ({
 
       <hr style={{ width: "100%" }} />
       <div style={{ display: "flex", justifyContent: "center" }}>
-        <Button onClick={setDefault} variant="text">
+        <Button onClick={setDefault} variant="outlined">
           Reset
         </Button>
         <Button

diff --git a/client/src/components/Projects/ColumnHeaderPopups/VisibilityPopup.jsx b/client/src/components/Projects/ColumnHeaderPopups/VisibilityPopup.jsx
@@ -102,7 +102,7 @@ const VisibilityPopup = ({
 
       <hr style={{ width: "100%" }} />
       <div style={{ display: "flex" }}>
-        <Button onClick={setDefault} variant="text">
+        <Button onClick={setDefault} variant="outlined">
           Reset
         </Button>
         <Button

diff --git a/client/src/components/Projects/CopyProjectModal.jsx b/client/src/components/Projects/CopyProjectModal.jsx
@@ -56,7 +56,7 @@ export default function CopyProjectModal({
         />
       </div>
       <div className={classes.buttonFlexBox}>
-        <Button onClick={onClose} variant="text">
+        <Button onClick={onClose} variant="outlined">
           Cancel
         </Button>
         <Button

diff --git a/client/src/components/Projects/CsvModal.jsx b/client/src/components/Projects/CsvModal.jsx
@@ -158,7 +158,7 @@ const CsvModal = ({
               setProjectCollection("");
               setFilename("");
             }}
-            variant="text"
+            variant="outlined"
             id="cancelButton"
           >
             Cancel

diff --git a/client/src/components/Projects/DeleteProjectModal.jsx b/client/src/components/Projects/DeleteProjectModal.jsx
@@ -68,7 +68,7 @@ const DeleteProjectModal = ({ mounted, onClose, project }) => {
         {Array.isArray(project.name) ? project.name.join(", ") : project.name}
       </div>
       <div className={classes.buttonFlexBox}>
-        <Button onClick={onClose} variant="text" id="cancelButton">
+        <Button onClick={onClose} variant="outlined" id="cancelButton">
           Cancel
         </Button>
         {project.dateTrashed ? (

diff --git a/client/src/components/Projects/DownloadProjectModal.jsx b/client/src/components/Projects/DownloadProjectModal.jsx
@@ -6,6 +6,8 @@ import Button from "../Button/Button";
 
 import ModalDialog from "../UI/AriaModal/ModalDialog";
 
+// This file appears to be obsolete
+
 const useStyles = createUseStyles(theme => ({
   buttonFlexBox: {
     display: "flex",
@@ -93,7 +95,7 @@ export default function DownloadProjectModal({
         </table>
       </div>
       <div className={classes.buttonFlexBox}>
-        <Button onClick={onClose} variant="text">
+        <Button onClick={onClose} variant="outlined">
           Close
         </Button>
         {/* <Button