Oauth code in input form and add description message (#4986)

* Oauth code in a input form and add description

* New authcode description

31 files changed, 68 insertions, 30 deletions

diff --git a/app/javascript/styles/forms.scss b/app/javascript/styles/forms.scss
index 747610237..0526f174c 100644
--- a/app/javascript/styles/forms.scss
+++ b/app/javascript/styles/forms.scss
@@ -349,9 +349,46 @@ code {
   box-shadow: 0 0 5px rgba($base-shadow-color, 0.2);
   text-align: center;
 
+  p {
+    margin-bottom: 15px;
+  }
+
+  .oauth-code {
+    color: $ui-secondary-color;
+    outline: 0;
+    box-sizing: border-box;
+    display: block;
+    width: 100%;
+    border: none;
+    padding: 10px;
+    font-family: 'mastodon-font-monospace', monospace;
+    background: $ui-base-color;
+    color: $ui-primary-color;
+    font-size: 14px;
+    margin: 0;
+
+    &::-moz-focus-inner {
+      border: 0;
+    }
+
+    &::-moz-focus-inner,
+    &:focus,
+    &:active {
+      outline: 0 !important;
+    }
+
+    &:focus {
+      background: lighten($ui-base-color, 4%);
+    }
+  }
+
   strong {
     font-weight: 500;
   }
+
+  @media screen and (max-width: 740px) and (min-width: 441px) {
+    margin-top: 40px;
+  }
 }
 
 .form-footer {
diff --git a/app/views/oauth/authorizations/show.html.haml b/app/views/oauth/authorizations/show.html.haml
index b56667f35..ad5236007 100644
--- a/app/views/oauth/authorizations/show.html.haml
+++ b/app/views/oauth/authorizations/show.html.haml
@@ -1,3 +1,4 @@
 .form-container
   .flash-message
-    %code= params[:code]
+    %p= t('doorkeeper.authorizations.show.title')
+    %input{ type: 'text', class: 'oauth-code', readonly: true, value: params[:code], onClick: 'select()' }
diff --git a/config/locales/doorkeeper.ar.yml b/config/locales/doorkeeper.ar.yml
index cd4a9cb50..7980e107a 100644
--- a/config/locales/doorkeeper.ar.yml
+++ b/config/locales/doorkeeper.ar.yml
@@ -57,7 +57,7 @@ ar:
         prompt: طلبَ تطبيق %{client_name} تصريحا لاستعمال حسابك.
         title: إذن بالتصريح
       show:
-        title: رمز الترخيص
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: إبطال التصريح
diff --git a/config/locales/doorkeeper.bg.yml b/config/locales/doorkeeper.bg.yml
index 6fafdfc55..24de4aee0 100644
--- a/config/locales/doorkeeper.bg.yml
+++ b/config/locales/doorkeeper.bg.yml
@@ -57,7 +57,7 @@ bg:
         prompt: Приложението %{client_name} заявява достъп до твоя акаунт
         title: Изисква се упълномощаване
       show:
-        title: Код за упълномощаване
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Отмяна
diff --git a/config/locales/doorkeeper.ca.yml b/config/locales/doorkeeper.ca.yml
index ef937c4e6..38dbbdde9 100644
--- a/config/locales/doorkeeper.ca.yml
+++ b/config/locales/doorkeeper.ca.yml
@@ -57,7 +57,7 @@ ca:
         prompt: La aplicació %{client_name} sol⋅licita tenir accés al teu compte
         title: Es requereix autorizació
       show:
-        title: Codi de autorització
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revocar
diff --git a/config/locales/doorkeeper.de.yml b/config/locales/doorkeeper.de.yml
index b0ba2fb98..1588e4f9e 100644
--- a/config/locales/doorkeeper.de.yml
+++ b/config/locales/doorkeeper.de.yml
@@ -57,7 +57,7 @@ de:
         prompt: Soll %{client_name} für die Benutzung dieses Accounts autorisiert werden?
         title: Autorisierung erforderlich
       show:
-        title: Autorisierungscode
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Ungültig machen
diff --git a/config/locales/doorkeeper.en.yml b/config/locales/doorkeeper.en.yml
index efbd81d43..33d544bed 100644
--- a/config/locales/doorkeeper.en.yml
+++ b/config/locales/doorkeeper.en.yml
@@ -63,7 +63,7 @@ en:
         prompt: Application %{client_name} requests access to your account
         title: Authorization required
       show:
-        title: Authorization code
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revoke
diff --git a/config/locales/doorkeeper.eo.yml b/config/locales/doorkeeper.eo.yml
index 33cc7cc19..ce39f3bd1 100644
--- a/config/locales/doorkeeper.eo.yml
+++ b/config/locales/doorkeeper.eo.yml
@@ -57,7 +57,7 @@ eo:
         prompt: La aplikaĵo %{client_name} petas aliron al via konto
         title: Rajtigo bezonata
       show:
-        title: Rajtiga kodo
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Malrajtigi
diff --git a/config/locales/doorkeeper.es.yml b/config/locales/doorkeeper.es.yml
index f3efb2301..2c3bc724c 100644
--- a/config/locales/doorkeeper.es.yml
+++ b/config/locales/doorkeeper.es.yml
@@ -57,7 +57,7 @@ es:
         prompt: La aplicación %{client_name} solicita tener acceso a su cuenta
         title: Se requiere autorización
       show:
-        title: Código de autorización
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revocar
diff --git a/config/locales/doorkeeper.fa.yml b/config/locales/doorkeeper.fa.yml
index 343580530..6a4be575e 100644
--- a/config/locales/doorkeeper.fa.yml
+++ b/config/locales/doorkeeper.fa.yml
@@ -63,7 +63,7 @@ fa:
         prompt: Application %{client_name} requests access to your account
         title: Authorization required
       show:
-        title: Authorization code
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revoke
diff --git a/config/locales/doorkeeper.fi.yml b/config/locales/doorkeeper.fi.yml
index cd1a9d058..44aceec4c 100644
--- a/config/locales/doorkeeper.fi.yml
+++ b/config/locales/doorkeeper.fi.yml
@@ -57,7 +57,7 @@ fi:
         prompt: Applikaatio %{client_name} pyytää lupaa tilillesi
         title: Valtuutus vaaditaan
       show:
-        title: Valtuutus koodi
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Evää
diff --git a/config/locales/doorkeeper.fr.yml b/config/locales/doorkeeper.fr.yml
index 487018209..3398b248d 100644
--- a/config/locales/doorkeeper.fr.yml
+++ b/config/locales/doorkeeper.fr.yml
@@ -59,7 +59,7 @@ fr:
         prompt: Autoriser %{client_name} à utiliser votre compte ?
         title: Autorisation requise
       show:
-        title: Code d’autorisation
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Annuler
diff --git a/config/locales/doorkeeper.he.yml b/config/locales/doorkeeper.he.yml
index 778902788..1d366b179 100644
--- a/config/locales/doorkeeper.he.yml
+++ b/config/locales/doorkeeper.he.yml
@@ -57,7 +57,7 @@ he :
         prompt: ישום %{client_name} מבקש גישה לחשבונך
         title: נדרשת הרשאה
       show:
-        title: קוד הרשאה
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: ביטול
diff --git a/config/locales/doorkeeper.hr.yml b/config/locales/doorkeeper.hr.yml
index 26d21c10d..e0240938e 100644
--- a/config/locales/doorkeeper.hr.yml
+++ b/config/locales/doorkeeper.hr.yml
@@ -57,7 +57,7 @@ hr:
         prompt: Aplikacija %{client_name} je zatražila pristup tvom računu
         title: Traži se autorizacija
       show:
-        title: Autorizacijski kod
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Odbij
diff --git a/config/locales/doorkeeper.hu.yml b/config/locales/doorkeeper.hu.yml
index b1c6dd6c9..583e0ad9f 100644
--- a/config/locales/doorkeeper.hu.yml
+++ b/config/locales/doorkeeper.hu.yml
@@ -57,7 +57,7 @@ hu:
         prompt: "%{client_name} nevű alkalmazás engedélyt kér a fiókodhoz való hozzáféréshez."
         title: Engedély szükséges
       show:
-        title: Engedély kódja
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Visszavonás
diff --git a/config/locales/doorkeeper.id.yml b/config/locales/doorkeeper.id.yml
index 4ae97c5df..95560ecf9 100644
--- a/config/locales/doorkeeper.id.yml
+++ b/config/locales/doorkeeper.id.yml
@@ -57,7 +57,7 @@ id:
         prompt: Aplikasi %{client_name} meminta akses pada akun anda
         title: Izin diperlukan
       show:
-        title: Kode izin
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Cabut izin
diff --git a/config/locales/doorkeeper.io.yml b/config/locales/doorkeeper.io.yml
index 8c093a9d8..28466d3ae 100644
--- a/config/locales/doorkeeper.io.yml
+++ b/config/locales/doorkeeper.io.yml
@@ -57,7 +57,7 @@ io:
         prompt: Application %{client_name} requests access to your account
         title: Authorization required
       show:
-        title: Authorization code
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revoke
diff --git a/config/locales/doorkeeper.it.yml b/config/locales/doorkeeper.it.yml
index 4b5e463b0..e5a2d3f6e 100644
--- a/config/locales/doorkeeper.it.yml
+++ b/config/locales/doorkeeper.it.yml
@@ -57,7 +57,7 @@ it:
         prompt: L'applicazione %{client_name} richiede l'accesso al tuo account
         title: Autorizzazione richiesta
       show:
-        title: Codice autorizzazione
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Disabilita
diff --git a/config/locales/doorkeeper.ja.yml b/config/locales/doorkeeper.ja.yml
index 9e3b72761..0b670fda4 100644
--- a/config/locales/doorkeeper.ja.yml
+++ b/config/locales/doorkeeper.ja.yml
@@ -63,7 +63,7 @@ ja:
         prompt: アプリ %{client_name} があなたのアカウントへのアクセスを要求しています。
         title: 認証が必要です。
       show:
-        title: 認証コード
+        title: 認証コードをコピーしてアプリに貼り付けて下さい。
     authorized_applications:
       buttons:
         revoke: 取消
diff --git a/config/locales/doorkeeper.nl.yml b/config/locales/doorkeeper.nl.yml
index ae1f8bc52..66936d381 100644
--- a/config/locales/doorkeeper.nl.yml
+++ b/config/locales/doorkeeper.nl.yml
@@ -63,7 +63,7 @@ nl:
         prompt: "%{client_name} autoriseren om uw account te gebruiken?"
         title: Autorisatie vereist
       show:
-        title: Autorisatie-code
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Intrekken
diff --git a/config/locales/doorkeeper.no.yml b/config/locales/doorkeeper.no.yml
index 23ca61d4d..ba061e0ca 100644
--- a/config/locales/doorkeeper.no.yml
+++ b/config/locales/doorkeeper.no.yml
@@ -57,7 +57,7 @@
         prompt: Applikasjon %{client_name} spør om tilgang til din konto
         title: Autorisasjon påkrevd
       show:
-        title: Autoriserings kode
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Opphev
diff --git a/config/locales/doorkeeper.oc.yml b/config/locales/doorkeeper.oc.yml
index 8ebfe2137..1606b92c4 100644
--- a/config/locales/doorkeeper.oc.yml
+++ b/config/locales/doorkeeper.oc.yml
@@ -63,7 +63,7 @@ oc:
         prompt: L’aplicacion %{client_name} demanda l’accès al vòstre compte.
         title: Cal l’autorizacion
       show:
-        title: Còdi d’autorizacion
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revocar
diff --git a/config/locales/doorkeeper.pl.yml b/config/locales/doorkeeper.pl.yml
index ee3f4cad8..824a6be90 100644
--- a/config/locales/doorkeeper.pl.yml
+++ b/config/locales/doorkeeper.pl.yml
@@ -63,7 +63,7 @@ pl:
         prompt: Aplikacja %{client_name} prosi o dostęp do Twojego konta
         title: Wymagana jest autoryzacja
       show:
-        title: Kod autoryzacji
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Unieważnij
diff --git a/config/locales/doorkeeper.pt-BR.yml b/config/locales/doorkeeper.pt-BR.yml
index f0f3c6893..53cadec38 100644
--- a/config/locales/doorkeeper.pt-BR.yml
+++ b/config/locales/doorkeeper.pt-BR.yml
@@ -63,7 +63,7 @@ pt-BR:
         prompt: O aplicativo %{client_name} solicita acesso à sua conta
         title: Autorização necessária
       show:
-        title: Código de autorização
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revogar
diff --git a/config/locales/doorkeeper.pt.yml b/config/locales/doorkeeper.pt.yml
index 87e01ba94..30d9f7f5a 100644
--- a/config/locales/doorkeeper.pt.yml
+++ b/config/locales/doorkeeper.pt.yml
@@ -57,7 +57,7 @@ pt:
         prompt: Aplicação %{client_name} pede acesso à tua conta
         title: Autorização é necessária
       show:
-        title: Código de autorização
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Revogar
diff --git a/config/locales/doorkeeper.ru.yml b/config/locales/doorkeeper.ru.yml
index 8862936dc..2234a9bbe 100644
--- a/config/locales/doorkeeper.ru.yml
+++ b/config/locales/doorkeeper.ru.yml
@@ -57,7 +57,7 @@ ru:
         prompt: Приложение %{client_name} запрашивает доступ к Вашему аккаунту
         title: Требуется авторизация
       show:
-        title: Код авторизации
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Отозвать авторизацию
diff --git a/config/locales/doorkeeper.th.yml b/config/locales/doorkeeper.th.yml
index 29673971b..60edae1e4 100644
--- a/config/locales/doorkeeper.th.yml
+++ b/config/locales/doorkeeper.th.yml
@@ -57,7 +57,7 @@ th:
         prompt: Application %{client_name} requests access to your account
         title: Authorization required
       show:
-        title: Authorization code
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: ยกเลิกการอนุญาติ
diff --git a/config/locales/doorkeeper.uk.yml b/config/locales/doorkeeper.uk.yml
index a5289541b..d80abf01a 100644
--- a/config/locales/doorkeeper.uk.yml
+++ b/config/locales/doorkeeper.uk.yml
@@ -57,7 +57,7 @@ uk:
         prompt: Податок %{client_name} просить доступу до вашого акаунту
         title: Необхідна авторизація
       show:
-        title: Код авторизації
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: Відкликати авторизацію
diff --git a/config/locales/doorkeeper.zh-CN.yml b/config/locales/doorkeeper.zh-CN.yml
index 6db8697b8..12b38b81f 100644
--- a/config/locales/doorkeeper.zh-CN.yml
+++ b/config/locales/doorkeeper.zh-CN.yml
@@ -58,7 +58,7 @@ zh-CN:
         prompt: 授权 %{client_name} 使用你的帐号?
         title: 需要你授权
       show:
-        title: 授权码
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: 注销
diff --git a/config/locales/doorkeeper.zh-HK.yml b/config/locales/doorkeeper.zh-HK.yml
index bb44c272b..ac1e3180a 100644
--- a/config/locales/doorkeeper.zh-HK.yml
+++ b/config/locales/doorkeeper.zh-HK.yml
@@ -57,7 +57,7 @@ zh-HK:
         prompt: 應用程式 %{client_name} 要求得到你用戶的部份權限
         title: 需要用戶授權
       show:
-        title: 授權代碼
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: 取消授權
diff --git a/config/locales/doorkeeper.zh-TW.yml b/config/locales/doorkeeper.zh-TW.yml
index 7e8c78cd9..5110c8aa3 100644
--- a/config/locales/doorkeeper.zh-TW.yml
+++ b/config/locales/doorkeeper.zh-TW.yml
@@ -57,7 +57,7 @@ zh-TW:
         prompt: 應用程式 %{client_name} 要求取得您帳號的部份權限
         title: 需要授權
       show:
-        title: 授權代碼
+        title: Copy this authorization code and paste it to the application.
     authorized_applications:
       buttons:
         revoke: 取消授權