Formatting and typos

src/pages/settings/components/Search/SearchProviders.tsx

@@ -33,7 +33,7 @@ const SearchProviderSettings = () => {
 		endpoint: endpoint,
 	});
 	const [providerData, setProviderData] = useState<any>([]);
-	const { theme } = useCommonHooks();
+	const { theme, isMobile } = useCommonHooks();
 	const { mutateAsync } = useMutationAPI();
 	const [newProvider, setNewProvider] = useState<any>({});
 	const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
@@ -59,6 +59,7 @@ const SearchProviderSettings = () => {
 				className={modalClasses.helpModal}
 				classNames={modalClasses}
 				opened={modalOpened}
+				fullScreen={isMobile}
 				onClose={() => {
 					closeModal();
 				}}
@@ -76,7 +77,7 @@ const SearchProviderSettings = () => {
 				<Modal.Overlay />
 				<Modal.Content>
 					<Modal.Header>
-						<Modal.Title>Add a new application</Modal.Title>
+						<Modal.Title>Add a new Search Provider</Modal.Title>
 						<Modal.CloseButton />
 					</Modal.Header>
 					<Modal.Body pb={'2rem'}>
@@ -218,7 +219,7 @@ const SearchProviderSettings = () => {
 			<Stack w={'100%'} align='center'>
 				<Grid columns={18} w={'75%'}>
 					{providerData?.map((provider: any) => (
-						<GridCol span={6} key={provider.id}>
+						<GridCol span={isMobile ? 18 : 6} key={provider.id}>
 							<Popover withArrow withOverlay withinPortal={false}>
 								<Popover.Target>
 									<Box