Merge remote-tracking branch 'origin/develop' into a11y

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>

.gitignore

@@ -12,3 +12,12 @@ yarn-error.log*
 /static-test/
 /public/
 /dist/
+
+.idea
+.DS_Store
+
+# surge.sh
+CNAME
+AUTH
+CORS
+ROUTER

app/index.ejs

@@ -5,6 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, user-scalable=no">
     <meta name="mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-capable" content="yes">
+    <link href="/manifest.json" rel="manifest">
     <!--server-generated-meta-->
     <link rel="icon" type="image/png" href="/favicon.png">
   </head>

app/soapbox/__fixtures__/intlMessages.json

@@ -106,7 +106,7 @@
     "confirmations.delete_list.confirm": "Delete",
     "confirmations.delete_list.message": "Are you sure you want to permanently delete this list?",
     "confirmations.domain_block.confirm": "Hide entire domain",
-    "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable. You will not see content from that domain in any public timelines or your notifications. Your followers from that domain will be removed.",
+    "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable. You will not see content from that domain in any public timelines or your notifications.",
     "confirmations.mute.confirm": "Mute",
     "confirmations.mute.message": "Are you sure you want to mute {name}?",
     "confirmations.redraft.confirm": "Delete & redraft",
@@ -584,7 +584,7 @@
   "confirmations.delete_list.confirm": "Delete",
   "confirmations.delete_list.message": "Are you sure you want to permanently delete this list?",
   "confirmations.domain_block.confirm": "Hide entire domain",
-  "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable. You will not see content from that domain in any public timelines or your notifications. Your followers from that domain will be removed.",
+  "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable. You will not see content from that domain in any public timelines or your notifications.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
   "confirmations.redraft.confirm": "Delete & redraft",

app/soapbox/features/auth_login/components/__tests__/__snapshots__/captcha-test.js.snap

@@ -14,7 +14,9 @@ exports[`<NativeCaptchaField /> renders correctly 1`] = `
     className="input required"
   >
     <input
+      autoCapitalize="off"
       autoComplete="off"
+      autoCorrect="off"
       onChange={[Function]}
       placeholder="Enter the pictured text"
       required={true}

app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap

@@ -14,7 +14,9 @@ exports[`<LoginForm /> renders for Mastodon 1`] = `
       >
         <input
           aria-label="Username"
+          autoCapitalize="off"
           autoComplete="off"
+          autoCorrect="off"
           className="string email"
           name="username"
           placeholder="Username"
@@ -23,17 +25,49 @@ exports[`<LoginForm /> renders for Mastodon 1`] = `
         />
       </div>
       <div
-        className="input password user_password"
+        className="input required showable-password password user_password"
       >
         <input
           aria-label="Password"
+          autoCapitalize="off"
           autoComplete="off"
-          className="password"
+          autoCorrect="off"
           name="password"
           placeholder="Password"
           required={true}
           type="password"
         />
+        <button
+          aria-label="Show password"
+          className="icon-button"
+          disabled={false}
+          onClick={[Function]}
+          onKeyDown={[Function]}
+          onKeyPress={[Function]}
+          onKeyUp={[Function]}
+          onMouseDown={[Function]}
+          onMouseEnter={[Function]}
+          onMouseLeave={[Function]}
+          tabIndex="0"
+          title="Show password"
+          type="button"
+        >
+          <div
+            style={Object {}}
+          >
+            <div
+              className="svg-icon"
+            >
+              <svg
+                id={
+                  Object {
+                    "process": [Function],
+                  }
+                }
+              />
+            </div>
+          </div>
+        </button>
       </div>
       <p
         className="hint subtle-hint"
@@ -74,7 +108,9 @@ exports[`<LoginForm /> renders for Pleroma 1`] = `
       >
         <input
           aria-label="Username"
+          autoCapitalize="off"
           autoComplete="off"
+          autoCorrect="off"
           className="string email"
           name="username"
           placeholder="Username"
@@ -83,17 +119,49 @@ exports[`<LoginForm /> renders for Pleroma 1`] = `
         />
       </div>
       <div
-        className="input password user_password"
+        className="input required showable-password password user_password"
       >
         <input
           aria-label="Password"
+          autoCapitalize="off"
           autoComplete="off"
-          className="password"
+          autoCorrect="off"
           name="password"
           placeholder="Password"
           required={true}
           type="password"
         />
+        <button
+          aria-label="Show password"
+          className="icon-button"
+          disabled={false}
+          onClick={[Function]}
+          onKeyDown={[Function]}
+          onKeyPress={[Function]}
+          onKeyUp={[Function]}
+          onMouseDown={[Function]}
+          onMouseEnter={[Function]}
+          onMouseLeave={[Function]}
+          tabIndex="0"
+          title="Show password"
+          type="button"
+        >
+          <div
+            style={Object {}}
+          >
+            <div
+              className="svg-icon"
+            >
+              <svg
+                id={
+                  Object {
+                    "process": [Function],
+                  }
+                }
+              />
+            </div>
+          </div>
+        </button>
       </div>
       <p
         className="hint subtle-hint"

app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap

@@ -17,7 +17,9 @@ exports[`<LoginPage /> renders correctly on load 1`] = `
       >
         <input
           aria-label="Username"
+          autoCapitalize="off"
           autoComplete="off"
+          autoCorrect="off"
           className="string email"
           name="username"
           placeholder="Username"
@@ -26,17 +28,49 @@ exports[`<LoginPage /> renders correctly on load 1`] = `
         />
       </div>
       <div
-        className="input password user_password"
+        className="input required showable-password password user_password"
       >
         <input
           aria-label="Password"
+          autoCapitalize="off"
           autoComplete="off"
-          className="password"
+          autoCorrect="off"
           name="password"
           placeholder="Password"
           required={true}
           type="password"
         />
+        <button
+          aria-label="Show password"
+          className="icon-button"
+          disabled={false}
+          onClick={[Function]}
+          onKeyDown={[Function]}
+          onKeyPress={[Function]}
+          onKeyUp={[Function]}
+          onMouseDown={[Function]}
+          onMouseEnter={[Function]}
+          onMouseLeave={[Function]}
+          tabIndex="0"
+          title="Show password"
+          type="button"
+        >
+          <div
+            style={Object {}}
+          >
+            <div
+              className="svg-icon"
+            >
+              <svg
+                id={
+                  Object {
+                    "process": [Function],
+                  }
+                }
+              />
+            </div>
+          </div>
+        </button>
       </div>
       <p
         className="hint subtle-hint"