media query fix

2 files changed, 29 insertions, 31 deletions

diff --git a/components/App.js b/components/App.js
index 210e0e0..b24aead 100644
--- a/components/App.js
+++ b/components/App.js
@@ -8,7 +8,7 @@ import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'
 const App = ({children, app, setApps}) => {
   const {t} = useSettings()
   const winRef = useRef(null);
-  const forceMax = useMediaQuery(`(max-width: ${app.width}) or (max-height: ${app.height})`);
+  const forceMax = useMediaQuery(`(max-width: ${app.width}), (max-height: ${app.height})`);
 
   useEffect(() => {
     move(app.name, winRef, setApps)
diff --git a/components/Form.js b/components/Form.js
index 59f9710..9a17660 100644
--- a/components/Form.js
+++ b/components/Form.js
@@ -24,39 +24,37 @@ const Form = ({errorMessage, onSubmit, isLogin}) => {
       {!isLogin && (
         <>
           <input type="password" name="password_confirm" placeholder={t('confirm_password')} required />
+          <legend>{t('language')}</legend>
           <fieldset>
-            <legend>{t('language')}</legend>
-            {['en', 'pl', 'es', 'de'].map(l => (
-              <>
-                <input
-                  key={`i_${l}`}
-                  id={`language_${l}`}
-                  type="radio"
-                  name="language"
-                  value={l}
-                  defaultChecked={settings.language === l}
-                  onChange={() => languageChange(l)}
-                />
-                <label key={`l_${l}`} htmlFor={`language_${l}`}>{l.toUpperCase()}</label>
-              </>
-            ))}
+          {['en', 'pl', 'es', 'de'].map(l => (
+            <fieldset key={l}>
+              <input
+                id={`language_${l}`}
+                type="radio"
+                name="language"
+                value={l}
+                defaultChecked={settings.language === l}
+                onChange={() => languageChange(l)}
+              />
+              <label htmlFor={`language_${l}`}>{l.toUpperCase()}</label>
+            </fieldset>
+          ))}
           </fieldset>
+          <legend>{t('color_theme')}</legend>
           <fieldset>
-            <legend>{t('color_theme')}</legend>
-            {['green', 'blue', 'black'].map(c => (
-              <>
-                <input
-                  key={`i_${c}`}
-                  id={`theme_${c}`}
-                  type="radio"
-                  name="theme"
-                  value={c}
-                  defaultChecked={settings.theme === c}
-                  onChange={() => themeChange(c)}
-                />
-                <label key={`l_${c}`} htmlFor={`theme_${c}`} />
-              </>
-            ))}
+          {['green', 'blue', 'black'].map(c => (
+            <fieldset key={c}>
+              <input
+                id={`theme_${c}`}
+                type="radio"
+                name="theme"
+                value={c}
+                defaultChecked={settings.theme === c}
+                onChange={() => themeChange(c)}
+              />
+              <label htmlFor={`theme_${c}`} />
+            </fieldset>
+          ))}
           </fieldset>
         </>
       )}