Formatting and typos

src/pages/settings/components/Applications/Applications.tsx

@@ -33,7 +33,7 @@ const ApplicationSettings = () => {
 		endpoint: endpoint,
 	});
 	const [applicationData, setApplicationData] = useState<any>([]);
-	const { theme } = useCommonHooks();
+	const { theme, isMobile } = useCommonHooks();
 	const [newApplication, setNewApplication] = useState<any>({
 		name: '',
 		url: '',
@@ -66,6 +66,7 @@ const ApplicationSettings = () => {
 				className={modalClasses.helpModal}
 				classNames={modalClasses}
 				opened={modalOpened}
+				fullScreen={isMobile}
 				onClose={() => {
 					closeModal();
 				}}
@@ -120,7 +121,6 @@ const ApplicationSettings = () => {
 								<TextInput
 									label={'URL'}
 									className={textInputClasses.settingsItem}
-									w={'59%'}
 									pt={16}
 									classNames={textInputClasses}
 									defaultValue={newApplication.url}

src/pages/settings/components/Applications/DebouncedApplication.tsx

@@ -16,7 +16,7 @@ import { useEffect, useState } from 'react';
 import { cardClasses, modalClasses, textInputClasses } from 'styles';
 
 function DebouncedApplication({ application, handleDelete }: any) {
-	const { theme } = useCommonHooks();
+	const { theme, isMobile } = useCommonHooks();
 	const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
 	const { mutateAsync } = useMutationAPI();
 
@@ -40,6 +40,7 @@ function DebouncedApplication({ application, handleDelete }: any) {
 		<Card className={cardClasses.settingsItem} classNames={cardClasses}>
 			<Modal.Root
 				size={'60%'}
+				fullScreen={isMobile}
 				className={modalClasses.helpModal}
 				classNames={modalClasses}
 				opened={modalOpened}