diff --git a/src/views/DiffChecker.jsx b/src/views/DiffChecker.jsx index 8af753e..8a98cc1 100644 --- a/src/views/DiffChecker.jsx +++ b/src/views/DiffChecker.jsx @@ -1,11 +1,12 @@ import React, { useState } from "react"; import { useForm } from "react-hook-form"; +import useMediaQuery from "@mui/material/useMediaQuery"; import ContentLayout from "containers/ContentLayout"; +import SplitButton from "components/Buttons/SplitButton"; import { TextInput } from "components/Inputs/TextInput"; import { StandardDropDown } from "components/DropDown/DropDowns"; import { diffChars, diffWords, diffCss, diffJson } from "diff"; -import SplitButton from "components/Buttons/SplitButton"; import { convertToLowerCase, replaceNewLineWithWhiteSpace, @@ -22,6 +23,10 @@ const DiffChecker = () => { setValue, } = useForm(); + const phoneUp = useMediaQuery("(min-height:760px)"); + + const maxRows = phoneUp ? 20 : 10; + const [selectedComparisonFunction, setSelectedComparisonFunction] = useState("diffJson"); @@ -113,7 +118,7 @@ const DiffChecker = () => { label="Original text" name="originalText" multiline - rows={20} + rows={maxRows} /> { label="Changed text" name="changedText" multiline - rows={20} + rows={maxRows} />