From c5d035fd12bd600443138287ee1406eb34307394 Mon Sep 17 00:00:00 2001 From: veganedge Date: Tue, 21 Nov 2023 23:22:09 -0800 Subject: [PATCH 1/6] adding consistent border-radius to all buttons --- src/components/Footer/RenderCallToActionSection.jsx | 2 +- src/components/Home/HomeSection.jsx | 2 +- src/components/Messages/MessageButtonGroup.jsx | 2 +- src/components/Messages/MessageFolder.jsx | 6 +++++- src/pages/Contacts.jsx | 1 + src/pages/Profile.jsx | 4 ++-- 6 files changed, 11 insertions(+), 6 deletions(-) diff --git a/src/components/Footer/RenderCallToActionSection.jsx b/src/components/Footer/RenderCallToActionSection.jsx index 6fc71d566..f67deab71 100644 --- a/src/components/Footer/RenderCallToActionSection.jsx +++ b/src/components/Footer/RenderCallToActionSection.jsx @@ -29,7 +29,7 @@ const RenderCallToActionSection = ({ isReallySmallScreen }) => ( href="mailto:hugh@codeforpdx.org" target="_blank" rel="noopener" - sx={{ my: '1rem', width: 1 / 2 }} + sx={{ my: '1rem', width: 1 / 2, borderRadius: '20px' }} > Make a Proposal diff --git a/src/components/Home/HomeSection.jsx b/src/components/Home/HomeSection.jsx index abd6355a1..f0fb5f777 100644 --- a/src/components/Home/HomeSection.jsx +++ b/src/components/Home/HomeSection.jsx @@ -70,7 +70,7 @@ const HomeSection = ({ my: '1rem', backgroundColor: 'primary.light', width: isReallySmallScreen ? 1 : 1 / 4, - borderRadius: '25px' + borderRadius: '20px' }} > {button} diff --git a/src/components/Messages/MessageButtonGroup.jsx b/src/components/Messages/MessageButtonGroup.jsx index 76c6b8e16..cb196d32a 100644 --- a/src/components/Messages/MessageButtonGroup.jsx +++ b/src/components/Messages/MessageButtonGroup.jsx @@ -39,7 +39,7 @@ const MessageButtonGroup = ({ showModal, setShowModal, boxType, setBoxType }) => onClick={() => setShowModal(!showModal)} startIcon={} color="secondary" - sx={{ width: isReallySmallScreen ? '200px' : 'default' }} + sx={{ width: isReallySmallScreen ? '200px' : 'default', borderRadius: '20px' }} > New Message diff --git a/src/components/Messages/MessageFolder.jsx b/src/components/Messages/MessageFolder.jsx index aa3fb5439..d3847135c 100644 --- a/src/components/Messages/MessageFolder.jsx +++ b/src/components/Messages/MessageFolder.jsx @@ -82,7 +82,11 @@ const MessageFolder = ({ folderType, handleRefresh, loadMessages, messageList = variant="contained" onClick={() => handleRefresh(folderType)} type="button" - sx={{ width: '120px', margin: isSmallScreen ? '10px 20px' : '10px' }} + sx={{ + width: '120px', + margin: isSmallScreen ? '10px 20px' : '10px', + borderRadius: '20px' + }} startIcon={} > Refresh diff --git a/src/pages/Contacts.jsx b/src/pages/Contacts.jsx index 2fb766646..5817028c5 100644 --- a/src/pages/Contacts.jsx +++ b/src/pages/Contacts.jsx @@ -72,6 +72,7 @@ const Contacts = () => { size="small" startIcon={} onClick={() => setShowAddContactModal(true)} + sx={{ borderRadius: '20px' }} > Add Contact diff --git a/src/pages/Profile.jsx b/src/pages/Profile.jsx index 174490bac..80ae0131f 100644 --- a/src/pages/Profile.jsx +++ b/src/pages/Profile.jsx @@ -191,7 +191,7 @@ const Profile = () => { size="small" startIcon={} onClick={() => handleAclPermissionsModal('container')} - sx={{ width: isSmallScreen ? '250px' : 'default' }} + sx={{ width: isSmallScreen ? '250px' : 'default', borderRadius: '20px' }} > Share Documents Folder @@ -202,7 +202,7 @@ const Profile = () => { size="small" startIcon={} onClick={() => setShowAddDocModal(true)} - sx={{ width: isSmallScreen ? '200px' : 'default' }} + sx={{ width: isSmallScreen ? '200px' : 'default', borderRadius: '20px' }} > Add Document From deba0b7717fdf69fec76a32d5df2b3d2590fc269 Mon Sep 17 00:00:00 2001 From: veganedge Date: Thu, 23 Nov 2023 07:27:16 -0800 Subject: [PATCH 2/6] borderRadius adjustment to visually match other buttons --- src/components/Messages/MessageButtonGroup.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Messages/MessageButtonGroup.jsx b/src/components/Messages/MessageButtonGroup.jsx index cb196d32a..963dbe652 100644 --- a/src/components/Messages/MessageButtonGroup.jsx +++ b/src/components/Messages/MessageButtonGroup.jsx @@ -39,7 +39,7 @@ const MessageButtonGroup = ({ showModal, setShowModal, boxType, setBoxType }) => onClick={() => setShowModal(!showModal)} startIcon={} color="secondary" - sx={{ width: isReallySmallScreen ? '200px' : 'default', borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > New Message From 32c24beb6fe703308710826a6c5ab9ec1a3ad401 Mon Sep 17 00:00:00 2001 From: veganedge Date: Fri, 24 Nov 2023 16:27:50 -0800 Subject: [PATCH 3/6] consistently styling buttons at 25px border-radius --- src/components/Footer/RenderCallToActionSection.jsx | 2 +- src/components/Home/HomeSection.jsx | 2 +- src/components/Messages/MessageFolder.jsx | 2 +- src/components/Messages/MessagePreview.jsx | 7 ++++++- src/components/Messages/MessageStyles.js | 2 +- src/components/Modals/AddContactModal.jsx | 4 ++-- src/components/Modals/ConfirmationButton.jsx | 2 +- src/components/Modals/ConfirmationModal.jsx | 2 +- src/components/Modals/NewMessageModal.jsx | 4 ++-- src/components/Modals/SetAclPermissionsModal.jsx | 4 ++-- src/components/Modals/UploadButtonGroup.jsx | 4 ++-- src/components/Modals/UploadDocumentModal.jsx | 4 ++-- src/components/NavBar/NavbarLoggedOut.jsx | 2 +- src/components/NavBar/OidcLoginComponent.jsx | 4 ++-- src/components/Notification/InactivityMessage.jsx | 4 ++-- src/pages/Contacts.jsx | 2 +- src/pages/Profile.jsx | 4 ++-- 17 files changed, 30 insertions(+), 25 deletions(-) diff --git a/src/components/Footer/RenderCallToActionSection.jsx b/src/components/Footer/RenderCallToActionSection.jsx index f67deab71..49b9bcb0c 100644 --- a/src/components/Footer/RenderCallToActionSection.jsx +++ b/src/components/Footer/RenderCallToActionSection.jsx @@ -29,7 +29,7 @@ const RenderCallToActionSection = ({ isReallySmallScreen }) => ( href="mailto:hugh@codeforpdx.org" target="_blank" rel="noopener" - sx={{ my: '1rem', width: 1 / 2, borderRadius: '20px' }} + sx={{ my: '1rem', width: 1 / 2, borderRadius: '25px' }} > Make a Proposal diff --git a/src/components/Home/HomeSection.jsx b/src/components/Home/HomeSection.jsx index f0fb5f777..abd6355a1 100644 --- a/src/components/Home/HomeSection.jsx +++ b/src/components/Home/HomeSection.jsx @@ -70,7 +70,7 @@ const HomeSection = ({ my: '1rem', backgroundColor: 'primary.light', width: isReallySmallScreen ? 1 : 1 / 4, - borderRadius: '20px' + borderRadius: '25px' }} > {button} diff --git a/src/components/Messages/MessageFolder.jsx b/src/components/Messages/MessageFolder.jsx index d3847135c..5bc2b1dd7 100644 --- a/src/components/Messages/MessageFolder.jsx +++ b/src/components/Messages/MessageFolder.jsx @@ -85,7 +85,7 @@ const MessageFolder = ({ folderType, handleRefresh, loadMessages, messageList = sx={{ width: '120px', margin: isSmallScreen ? '10px 20px' : '10px', - borderRadius: '20px' + borderRadius: '25px' }} startIcon={} > diff --git a/src/components/Messages/MessagePreview.jsx b/src/components/Messages/MessagePreview.jsx index 2c5216d26..1c65e0e45 100644 --- a/src/components/Messages/MessagePreview.jsx +++ b/src/components/Messages/MessagePreview.jsx @@ -120,7 +120,12 @@ const MessagePreview = ({ message, folderType }) => { ))} {showContents && folderType === 'Inbox' && ( - )} diff --git a/src/components/Messages/MessageStyles.js b/src/components/Messages/MessageStyles.js index 3aa4c5483..47449bcfb 100644 --- a/src/components/Messages/MessageStyles.js +++ b/src/components/Messages/MessageStyles.js @@ -5,7 +5,7 @@ export const StyledButton = styled('button')({ height: '60px', backgroundColor: '#017969', borderColor: 'black', - borderRadius: '5px', + borderRadius: '25px', cursor: 'pointer', '&:hover': { filter: 'brightness(0.9)' diff --git a/src/components/Modals/AddContactModal.jsx b/src/components/Modals/AddContactModal.jsx index f2a223ceb..e328a240d 100644 --- a/src/components/Modals/AddContactModal.jsx +++ b/src/components/Modals/AddContactModal.jsx @@ -168,7 +168,7 @@ const AddContactModal = ({ addContact, showAddContactModal, setShowAddContactMod endIcon={} onClick={() => setShowAddContactModal(false)} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Cancel @@ -179,7 +179,7 @@ const AddContactModal = ({ addContact, showAddContactModal, setShowAddContactMod endIcon={} type="submit" fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Add Contact diff --git a/src/components/Modals/ConfirmationButton.jsx b/src/components/Modals/ConfirmationButton.jsx index 224b0d7f5..a229a9f93 100644 --- a/src/components/Modals/ConfirmationButton.jsx +++ b/src/components/Modals/ConfirmationButton.jsx @@ -24,7 +24,7 @@ const ConfirmationButton = ({ title, confirmFunction, processing }) => ( onClick={confirmFunction} disabled={processing} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > {title} diff --git a/src/components/Modals/ConfirmationModal.jsx b/src/components/Modals/ConfirmationModal.jsx index 94c2512e1..7ef99dc1d 100644 --- a/src/components/Modals/ConfirmationModal.jsx +++ b/src/components/Modals/ConfirmationModal.jsx @@ -88,7 +88,7 @@ const ConfirmationModal = ({ endIcon={} onClick={() => setShowConfirmationModal(false)} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Cancel diff --git a/src/components/Modals/NewMessageModal.jsx b/src/components/Modals/NewMessageModal.jsx index c801ecf43..bacc3b5a1 100644 --- a/src/components/Modals/NewMessageModal.jsx +++ b/src/components/Modals/NewMessageModal.jsx @@ -216,7 +216,7 @@ const NewMessageModal = ({ showModal, setShowModal, oldMessage = '', toField = ' startIcon={} onClick={() => setShowModal(false)} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Cancel @@ -226,7 +226,7 @@ const NewMessageModal = ({ showModal, setShowModal, oldMessage = '', toField = ' color="primary" startIcon={} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Submit diff --git a/src/components/Modals/SetAclPermissionsModal.jsx b/src/components/Modals/SetAclPermissionsModal.jsx index 43cd86977..dda41b7d9 100644 --- a/src/components/Modals/SetAclPermissionsModal.jsx +++ b/src/components/Modals/SetAclPermissionsModal.jsx @@ -155,7 +155,7 @@ const SetAclPermissionsModal = ({ showModal, setShowModal, dataset }) => { startIcon={} onClick={clearInputFields} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Cancel @@ -166,7 +166,7 @@ const SetAclPermissionsModal = ({ showModal, setShowModal, dataset }) => { color="primary" startIcon={} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > {permissionState.permissionType ? `${permissionState.permissionType}` : 'Share'} diff --git a/src/components/Modals/UploadButtonGroup.jsx b/src/components/Modals/UploadButtonGroup.jsx index 8d6399b83..11c653488 100644 --- a/src/components/Modals/UploadButtonGroup.jsx +++ b/src/components/Modals/UploadButtonGroup.jsx @@ -45,7 +45,7 @@ const UploadButtonGroup = ({ file, setFile }) => { fullWidth required startIcon={} - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Choose file { fullWidth required startIcon={} - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Capture image diff --git a/src/components/Modals/UploadDocumentModal.jsx b/src/components/Modals/UploadDocumentModal.jsx index 9df122758..1ed01df6f 100644 --- a/src/components/Modals/UploadDocumentModal.jsx +++ b/src/components/Modals/UploadDocumentModal.jsx @@ -175,7 +175,7 @@ const UploadDocumentModal = ({ showModal, setShowModal }) => { startIcon={} onClick={clearInputFields} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Cancel @@ -186,7 +186,7 @@ const UploadDocumentModal = ({ showModal, setShowModal }) => { color="primary" startIcon={} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Upload diff --git a/src/components/NavBar/NavbarLoggedOut.jsx b/src/components/NavBar/NavbarLoggedOut.jsx index f100fde7d..27626103d 100644 --- a/src/components/NavBar/NavbarLoggedOut.jsx +++ b/src/components/NavBar/NavbarLoggedOut.jsx @@ -42,7 +42,7 @@ const NavbarLoggedOut = () => { variant="contained" color="secondary" size="large" - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} onClick={handleSignIn} > Sign In diff --git a/src/components/NavBar/OidcLoginComponent.jsx b/src/components/NavBar/OidcLoginComponent.jsx index 623eb2e91..0a01a39b3 100644 --- a/src/components/NavBar/OidcLoginComponent.jsx +++ b/src/components/NavBar/OidcLoginComponent.jsx @@ -111,7 +111,7 @@ const OidcLoginComponent = ({ setShowSignInModal }) => { color="error" onClick={() => setShowSignInModal(false)} fullWidth - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Cancel @@ -123,7 +123,7 @@ const OidcLoginComponent = ({ setShowSignInModal }) => { size={isSmallScreen ? '' : 'large'} onClick={() => loginHandler()} fullWidth={isSmallScreen} - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Login diff --git a/src/components/Notification/InactivityMessage.jsx b/src/components/Notification/InactivityMessage.jsx index 79e5e3256..207d7188b 100644 --- a/src/components/Notification/InactivityMessage.jsx +++ b/src/components/Notification/InactivityMessage.jsx @@ -107,7 +107,7 @@ const InactivityMessage = () => { variant="outlined" color="error" endIcon={} - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} fullWidth > Log Out @@ -117,7 +117,7 @@ const InactivityMessage = () => { variant="contained" color="primary" endIcon={} - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} fullWidth onClick={() => setShowPopup(false)} > diff --git a/src/pages/Contacts.jsx b/src/pages/Contacts.jsx index 5817028c5..12ef963b9 100644 --- a/src/pages/Contacts.jsx +++ b/src/pages/Contacts.jsx @@ -72,7 +72,7 @@ const Contacts = () => { size="small" startIcon={} onClick={() => setShowAddContactModal(true)} - sx={{ borderRadius: '20px' }} + sx={{ borderRadius: '25px' }} > Add Contact diff --git a/src/pages/Profile.jsx b/src/pages/Profile.jsx index 80ae0131f..dabc466d4 100644 --- a/src/pages/Profile.jsx +++ b/src/pages/Profile.jsx @@ -191,7 +191,7 @@ const Profile = () => { size="small" startIcon={} onClick={() => handleAclPermissionsModal('container')} - sx={{ width: isSmallScreen ? '250px' : 'default', borderRadius: '20px' }} + sx={{ width: isSmallScreen ? '250px' : 'default', borderRadius: '25px' }} > Share Documents Folder @@ -202,7 +202,7 @@ const Profile = () => { size="small" startIcon={} onClick={() => setShowAddDocModal(true)} - sx={{ width: isSmallScreen ? '200px' : 'default', borderRadius: '20px' }} + sx={{ width: isSmallScreen ? '200px' : 'default', borderRadius: '25px' }} > Add Document From e0618b6a52e89d3694be790b7763043f31853780 Mon Sep 17 00:00:00 2001 From: veganedge Date: Fri, 24 Nov 2023 16:42:45 -0800 Subject: [PATCH 4/6] moved button border-radius to theme.js --- src/components/Footer/RenderCallToActionSection.jsx | 2 +- src/components/Home/HomeSection.jsx | 3 +-- src/components/Messages/MessageButtonGroup.jsx | 1 - src/components/Messages/MessageFolder.jsx | 3 +-- src/components/Messages/MessagePreview.jsx | 7 +------ src/components/Modals/AddContactModal.jsx | 2 -- src/components/Modals/ConfirmationButton.jsx | 1 - src/components/Modals/ConfirmationModal.jsx | 1 - src/components/Modals/NewMessageModal.jsx | 2 -- src/components/Modals/SetAclPermissionsModal.jsx | 2 -- src/components/Modals/UploadButtonGroup.jsx | 2 -- src/components/Modals/UploadDocumentModal.jsx | 2 -- src/components/NavBar/NavbarLoggedOut.jsx | 8 +------- src/components/NavBar/OidcLoginComponent.jsx | 2 -- src/components/Notification/InactivityMessage.jsx | 9 +-------- src/pages/Contacts.jsx | 1 - src/pages/Profile.jsx | 4 ++-- src/theme.js | 7 +++++++ 18 files changed, 15 insertions(+), 44 deletions(-) diff --git a/src/components/Footer/RenderCallToActionSection.jsx b/src/components/Footer/RenderCallToActionSection.jsx index 49b9bcb0c..6fc71d566 100644 --- a/src/components/Footer/RenderCallToActionSection.jsx +++ b/src/components/Footer/RenderCallToActionSection.jsx @@ -29,7 +29,7 @@ const RenderCallToActionSection = ({ isReallySmallScreen }) => ( href="mailto:hugh@codeforpdx.org" target="_blank" rel="noopener" - sx={{ my: '1rem', width: 1 / 2, borderRadius: '25px' }} + sx={{ my: '1rem', width: 1 / 2 }} > Make a Proposal diff --git a/src/components/Home/HomeSection.jsx b/src/components/Home/HomeSection.jsx index abd6355a1..1b98cf41c 100644 --- a/src/components/Home/HomeSection.jsx +++ b/src/components/Home/HomeSection.jsx @@ -69,8 +69,7 @@ const HomeSection = ({ sx={{ my: '1rem', backgroundColor: 'primary.light', - width: isReallySmallScreen ? 1 : 1 / 4, - borderRadius: '25px' + width: isReallySmallScreen ? 1 : 1 / 4 }} > {button} diff --git a/src/components/Messages/MessageButtonGroup.jsx b/src/components/Messages/MessageButtonGroup.jsx index 963dbe652..6837f1bff 100644 --- a/src/components/Messages/MessageButtonGroup.jsx +++ b/src/components/Messages/MessageButtonGroup.jsx @@ -39,7 +39,6 @@ const MessageButtonGroup = ({ showModal, setShowModal, boxType, setBoxType }) => onClick={() => setShowModal(!showModal)} startIcon={} color="secondary" - sx={{ borderRadius: '25px' }} > New Message diff --git a/src/components/Messages/MessageFolder.jsx b/src/components/Messages/MessageFolder.jsx index 5bc2b1dd7..79cf325ff 100644 --- a/src/components/Messages/MessageFolder.jsx +++ b/src/components/Messages/MessageFolder.jsx @@ -84,8 +84,7 @@ const MessageFolder = ({ folderType, handleRefresh, loadMessages, messageList = type="button" sx={{ width: '120px', - margin: isSmallScreen ? '10px 20px' : '10px', - borderRadius: '25px' + margin: isSmallScreen ? '10px 20px' : '10px' }} startIcon={} > diff --git a/src/components/Messages/MessagePreview.jsx b/src/components/Messages/MessagePreview.jsx index 1c65e0e45..2c5216d26 100644 --- a/src/components/Messages/MessagePreview.jsx +++ b/src/components/Messages/MessagePreview.jsx @@ -120,12 +120,7 @@ const MessagePreview = ({ message, folderType }) => { ))} {showContents && folderType === 'Inbox' && ( - )} diff --git a/src/components/Modals/AddContactModal.jsx b/src/components/Modals/AddContactModal.jsx index e328a240d..3bc3fdeb6 100644 --- a/src/components/Modals/AddContactModal.jsx +++ b/src/components/Modals/AddContactModal.jsx @@ -168,7 +168,6 @@ const AddContactModal = ({ addContact, showAddContactModal, setShowAddContactMod endIcon={} onClick={() => setShowAddContactModal(false)} fullWidth - sx={{ borderRadius: '25px' }} > Cancel @@ -179,7 +178,6 @@ const AddContactModal = ({ addContact, showAddContactModal, setShowAddContactMod endIcon={} type="submit" fullWidth - sx={{ borderRadius: '25px' }} > Add Contact diff --git a/src/components/Modals/ConfirmationButton.jsx b/src/components/Modals/ConfirmationButton.jsx index a229a9f93..2d50ecdfc 100644 --- a/src/components/Modals/ConfirmationButton.jsx +++ b/src/components/Modals/ConfirmationButton.jsx @@ -24,7 +24,6 @@ const ConfirmationButton = ({ title, confirmFunction, processing }) => ( onClick={confirmFunction} disabled={processing} fullWidth - sx={{ borderRadius: '25px' }} > {title} diff --git a/src/components/Modals/ConfirmationModal.jsx b/src/components/Modals/ConfirmationModal.jsx index 7ef99dc1d..9ef4c76c9 100644 --- a/src/components/Modals/ConfirmationModal.jsx +++ b/src/components/Modals/ConfirmationModal.jsx @@ -88,7 +88,6 @@ const ConfirmationModal = ({ endIcon={} onClick={() => setShowConfirmationModal(false)} fullWidth - sx={{ borderRadius: '25px' }} > Cancel diff --git a/src/components/Modals/NewMessageModal.jsx b/src/components/Modals/NewMessageModal.jsx index bacc3b5a1..ae3b36dd2 100644 --- a/src/components/Modals/NewMessageModal.jsx +++ b/src/components/Modals/NewMessageModal.jsx @@ -216,7 +216,6 @@ const NewMessageModal = ({ showModal, setShowModal, oldMessage = '', toField = ' startIcon={} onClick={() => setShowModal(false)} fullWidth - sx={{ borderRadius: '25px' }} > Cancel @@ -226,7 +225,6 @@ const NewMessageModal = ({ showModal, setShowModal, oldMessage = '', toField = ' color="primary" startIcon={} fullWidth - sx={{ borderRadius: '25px' }} > Submit diff --git a/src/components/Modals/SetAclPermissionsModal.jsx b/src/components/Modals/SetAclPermissionsModal.jsx index dda41b7d9..8c216ac9d 100644 --- a/src/components/Modals/SetAclPermissionsModal.jsx +++ b/src/components/Modals/SetAclPermissionsModal.jsx @@ -155,7 +155,6 @@ const SetAclPermissionsModal = ({ showModal, setShowModal, dataset }) => { startIcon={} onClick={clearInputFields} fullWidth - sx={{ borderRadius: '25px' }} > Cancel @@ -166,7 +165,6 @@ const SetAclPermissionsModal = ({ showModal, setShowModal, dataset }) => { color="primary" startIcon={} fullWidth - sx={{ borderRadius: '25px' }} > {permissionState.permissionType ? `${permissionState.permissionType}` : 'Share'} diff --git a/src/components/Modals/UploadButtonGroup.jsx b/src/components/Modals/UploadButtonGroup.jsx index 11c653488..521ee122b 100644 --- a/src/components/Modals/UploadButtonGroup.jsx +++ b/src/components/Modals/UploadButtonGroup.jsx @@ -45,7 +45,6 @@ const UploadButtonGroup = ({ file, setFile }) => { fullWidth required startIcon={} - sx={{ borderRadius: '25px' }} > Choose file { fullWidth required startIcon={} - sx={{ borderRadius: '25px' }} > Capture image diff --git a/src/components/Modals/UploadDocumentModal.jsx b/src/components/Modals/UploadDocumentModal.jsx index 1ed01df6f..d7422495e 100644 --- a/src/components/Modals/UploadDocumentModal.jsx +++ b/src/components/Modals/UploadDocumentModal.jsx @@ -175,7 +175,6 @@ const UploadDocumentModal = ({ showModal, setShowModal }) => { startIcon={} onClick={clearInputFields} fullWidth - sx={{ borderRadius: '25px' }} > Cancel @@ -186,7 +185,6 @@ const UploadDocumentModal = ({ showModal, setShowModal }) => { color="primary" startIcon={} fullWidth - sx={{ borderRadius: '25px' }} > Upload diff --git a/src/components/NavBar/NavbarLoggedOut.jsx b/src/components/NavBar/NavbarLoggedOut.jsx index 27626103d..4e3361fc4 100644 --- a/src/components/NavBar/NavbarLoggedOut.jsx +++ b/src/components/NavBar/NavbarLoggedOut.jsx @@ -38,13 +38,7 @@ const NavbarLoggedOut = () => { {isSmallScreen ? ( <> - { color="error" onClick={() => setShowSignInModal(false)} fullWidth - sx={{ borderRadius: '25px' }} > Cancel @@ -123,7 +122,6 @@ const OidcLoginComponent = ({ setShowSignInModal }) => { size={isSmallScreen ? '' : 'large'} onClick={() => loginHandler()} fullWidth={isSmallScreen} - sx={{ borderRadius: '25px' }} > Login diff --git a/src/components/Notification/InactivityMessage.jsx b/src/components/Notification/InactivityMessage.jsx index 207d7188b..c889bff49 100644 --- a/src/components/Notification/InactivityMessage.jsx +++ b/src/components/Notification/InactivityMessage.jsx @@ -103,13 +103,7 @@ const InactivityMessage = () => { localStorage.clear()}> - @@ -117,7 +111,6 @@ const InactivityMessage = () => { variant="contained" color="primary" endIcon={} - sx={{ borderRadius: '25px' }} fullWidth onClick={() => setShowPopup(false)} > diff --git a/src/pages/Contacts.jsx b/src/pages/Contacts.jsx index 12ef963b9..2fb766646 100644 --- a/src/pages/Contacts.jsx +++ b/src/pages/Contacts.jsx @@ -72,7 +72,6 @@ const Contacts = () => { size="small" startIcon={} onClick={() => setShowAddContactModal(true)} - sx={{ borderRadius: '25px' }} > Add Contact diff --git a/src/pages/Profile.jsx b/src/pages/Profile.jsx index dabc466d4..174490bac 100644 --- a/src/pages/Profile.jsx +++ b/src/pages/Profile.jsx @@ -191,7 +191,7 @@ const Profile = () => { size="small" startIcon={} onClick={() => handleAclPermissionsModal('container')} - sx={{ width: isSmallScreen ? '250px' : 'default', borderRadius: '25px' }} + sx={{ width: isSmallScreen ? '250px' : 'default' }} > Share Documents Folder @@ -202,7 +202,7 @@ const Profile = () => { size="small" startIcon={} onClick={() => setShowAddDocModal(true)} - sx={{ width: isSmallScreen ? '200px' : 'default', borderRadius: '25px' }} + sx={{ width: isSmallScreen ? '200px' : 'default' }} > Add Document diff --git a/src/theme.js b/src/theme.js index 577a80a05..f9dc5b76c 100644 --- a/src/theme.js +++ b/src/theme.js @@ -55,6 +55,13 @@ const theme = createTheme({ } } }, + MuiButton: { + styleOverrides: { + root: { + borderRadius: 25 + } + } + }, MuiTableHead: { styleOverrides: { root: { From 8dd714b95c3748bc50545438e9347e0a363e38a5 Mon Sep 17 00:00:00 2001 From: veganedge Date: Sat, 25 Nov 2023 14:31:57 -0800 Subject: [PATCH 5/6] typo fixes --- src/theme.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/theme.js b/src/theme.js index f9dc5b76c..cff4a054c 100644 --- a/src/theme.js +++ b/src/theme.js @@ -33,7 +33,7 @@ const theme = createTheme({ contrastText: '#fff' } }, - // color properties TBD for status snackbar severieties + // color properties TBD for status snackbar severities components: { MuiAlert: { styleOverrides: { @@ -66,7 +66,7 @@ const theme = createTheme({ styleOverrides: { root: { backgroundColor: themePalettePrimaryMain, - coolor: '#fff' + color: '#fff' } } }, From 755ee2c099ceaef5a560cb418553a6453545dd2a Mon Sep 17 00:00:00 2001 From: veganedge Date: Sat, 25 Nov 2023 21:42:31 -0800 Subject: [PATCH 6/6] deleting unused code --- src/components/Messages/MessageFolder.jsx | 2 +- src/components/Messages/MessageStyles.js | 174 -------------------- src/components/Messages/PaginationStyles.js | 48 ++++++ 3 files changed, 49 insertions(+), 175 deletions(-) delete mode 100644 src/components/Messages/MessageStyles.js create mode 100644 src/components/Messages/PaginationStyles.js diff --git a/src/components/Messages/MessageFolder.jsx b/src/components/Messages/MessageFolder.jsx index 79cf325ff..d619e0bc4 100644 --- a/src/components/Messages/MessageFolder.jsx +++ b/src/components/Messages/MessageFolder.jsx @@ -11,7 +11,7 @@ import useMediaQuery from '@mui/material/useMediaQuery'; import { useTheme } from '@mui/material/styles'; // Component Imports import MessagePreview from './MessagePreview'; -import { PaginationContainer } from './MessageStyles'; +import PaginationContainer from './PaginationStyles'; import { EmptyListNotification, LoadingAnimation } from '../Notification'; /** diff --git a/src/components/Messages/MessageStyles.js b/src/components/Messages/MessageStyles.js deleted file mode 100644 index 47449bcfb..000000000 --- a/src/components/Messages/MessageStyles.js +++ /dev/null @@ -1,174 +0,0 @@ -import styled from 'styled-components'; - -export const StyledButton = styled('button')({ - width: '150px', - height: '60px', - backgroundColor: '#017969', - borderColor: 'black', - borderRadius: '25px', - cursor: 'pointer', - '&:hover': { - filter: 'brightness(0.9)' - }, - color: '#fff', - fontWeight: 'bold', - fontSize: '18px' -}); - -export const StyledButton2 = styled('button')({ - gridColumn: 'span 2', - width: '100px', - height: '30px', - justifySelf: 'center', - cursor: 'pointer', - backgroundColor: '#017969', - border: 'none', - borderRadius: '5px', - color: '#fff', - fontWeight: 'bold', - '&:hover': { - filter: 'brightness(0.9)' - } -}); - -export const PaginationContainer = styled.div` - .pagination { - display: flex; - justify-content: center; - align-items: center; - padding: 0; - list-style-type: none; - gap: 3px; - } - - .page-green, - .page-red { - color: #fff; - font-weight: bold; - padding: 8px 12px; - border-radius: 4px; - text-decoration: none; - cursor: pointer; - display: flex; - } - - .page-green { - background-color: #74b0a8; - &:hover { - background-color: #017969; - } - } - - .page-red { - background-color: #bf7c84; - &:hover { - background-color: #961020; - } - } - - .chevron { - margin: 0 1rem; - } - - .active-page { - background-color: #017969; - cursor: default; - } -`; - -export const StyledPreview = styled('div')({ - display: 'flex', - flexDirection: 'column', - border: '2px solid black', - borderRadius: '10px', - padding: '5px', - cursor: 'pointer', - '&:hover': { - boxShadow: '2px 3px 2px rgba(0, 0, 0, .4)' - } -}); - -export const StyledDate = styled('p')({ - margin: 0, - padding: 0 -}); - -export const StyledHeader = styled('h1')({ - margin: 0, - padding: 0, - fontSize: '1.2rem' -}); - -export const StyledHeader2 = styled('h1')({ - gridColumn: 'span 2' -}); - -export const StyledOverlay = styled('div')({ - height: '100vh', - width: '100vw', - backgroundColor: 'rgb(128, 128, 128, .7)', - backdropFilter: 'blur(2px)', - zIndex: 99, - top: '0%', - left: '0%', - position: 'fixed' -}); - -export const StyledForm = styled('form')({ - display: 'grid', - backgroundColor: '#fff', - gridTemplateColumns: '150px 400px', - gap: '10px', - margin: '20px', - border: '2px solid black', - borderRadius: '8px', - padding: '20px', - alignItems: 'center', - position: 'fixed', - top: '50%', - left: '50%', - transform: 'translate(-50%, -50%)', - zIndex: 99 -}); - -export const CancelButton = styled('button')({ - gridColumn: '2 / 3', - width: '150px', - justifySelf: 'end', - height: '35px', - backgroundColor: 'red', - borderRadius: '5px', - border: 'none', - fontWeight: 'bold', - cursor: 'pointer', - '&:hover': { - filter: 'brightness(0.9)' - } -}); - -export const StyledNotice = styled('p')({ - gridColumn: 'span 2', - fontStyle: 'italic' -}); - -export const StyledError = styled('p')({ - gridColumn: 'span 2', - fontStyle: 'italic', - color: 'red', - justifySelf: 'center' -}); - -export const StyledSuccess = styled('p')({ - gridColumn: 'span 2', - fontStyle: 'italic', - color: 'green', - justifySelf: 'center' -}); - -export const StyledInput = styled('input')({ - height: '30px' -}); - -export const StyledTextArea = styled('textarea')({ - height: '200px' -}); diff --git a/src/components/Messages/PaginationStyles.js b/src/components/Messages/PaginationStyles.js new file mode 100644 index 000000000..6b9b154e3 --- /dev/null +++ b/src/components/Messages/PaginationStyles.js @@ -0,0 +1,48 @@ +import styled from 'styled-components'; + +const PaginationContainer = styled.div` + .pagination { + display: flex; + justify-content: center; + align-items: center; + padding: 0; + list-style-type: none; + gap: 3px; + } + + .page-green, + .page-red { + color: #fff; + font-weight: bold; + padding: 8px 12px; + border-radius: 4px; + text-decoration: none; + cursor: pointer; + display: flex; + } + + .page-green { + background-color: #74b0a8; + &:hover { + background-color: #017969; + } + } + + .page-red { + background-color: #bf7c84; + &:hover { + background-color: #961020; + } + } + + .chevron { + margin: 0 1rem; + } + + .active-page { + background-color: #017969; + cursor: default; + } +`; + +export default PaginationContainer;