diff --git a/i18n/en.js b/i18n/en.js
index af020e6..c86c50f 100644
--- a/i18n/en.js
+++ b/i18n/en.js
@@ -3,7 +3,7 @@ Object.assign((typeof window === 'undefined' ? module.exports : window).i18n = (
TitleText: 'Connect on Delta Chat',
DescriptionText: 'Delta Chat is a messaging app that works over e-mail.',
FormBlurbText: 'Create a Delta Chat invite link',
- StepCodeText: 'Open Delta Chat, then navigate to QR code
, Show QR Invite Code
, Copy to Clipboard
',
+ StepCodeText: 'Open Delta Chat, then navigate to QR code → Show QR Invite Code → Copy to Clipboard',
StepPasteText: 'Paste into the following field:',
StepShareText: 'Share the generated link over any channel',
ShareLinkText: 'Open link',
diff --git a/i18n/fr.js b/i18n/fr.js
index ce6203d..b79d48a 100644
--- a/i18n/fr.js
+++ b/i18n/fr.js
@@ -3,7 +3,7 @@ Object.assign((typeof window === 'undefined' ? module.exports : window).i18n = (
TitleText: 'Connecte sur Delta Chat',
DescriptionText: 'Delta Chat est une application de messagerie qui fonctionne par e-mail.',
FormBlurbText: "Crée un lien d'invitation à Delta Chat",
- StepCodeText: "Ouvre Delta Chat, navigue jusqu'à QR code
, Afficher le code d'invitation QR
, Copier dans le presse-papiers
.",
+ StepCodeText: "Ouvre Delta Chat, navigue jusqu'à QR code → Afficher le code d'invitation QR → Copier dans le presse-papiers .",
StepPasteText: 'Colle dans le champ suivant :',
StepShareText: "Partage le lien généré sur n'importe quel canal",
ShareLinkText: 'Ouvre lien',
diff --git a/index.html b/index.html
index 6a6c2dd..0b13f6f 100644
--- a/index.html
+++ b/index.html
@@ -18,6 +18,7 @@
+
@@ -34,7 +35,7 @@
margin: 0;
font-family: Arial,Avant Garde,Avantgarde,Century Gothic,CenturyGothic,AppleGothic,sans-serif;
- font-size: 18pt;
+ font-size: 12pt;
background: url('background.jpg');
background-size: 500px;
@@ -53,6 +54,7 @@
header {
padding: var(--pad);
font-family: Arial, 'Helvetica Neue', Helvetica;
+ font-size: 18pt;
background: var(--dc-gradient);
box-shadow: 0px 0px 3px #888;
}
@@ -62,6 +64,13 @@
color: white;
}
+ h2 {
+ font-weight: normal;
+ font-size: 18pt;
+ text-align: center;
+ margin-bottom: 2em;
+ }
+
.logo {
display: flex;
align-items: center;
@@ -88,7 +97,6 @@
}
#box li {
- font-size: 14pt;
margin-bottom: 40px;
}
@@ -102,9 +110,8 @@
#dc-link, .download, .share-link {
padding: 10px;
border-radius: 30px;
-
+ font-size: 10pt;
font-weight: bold;
- font-size: 60%;
text-transform: uppercase;
text-decoration: none;
color: white;
@@ -121,12 +128,9 @@
left: 100px;
}
- form ol {
+ ol {
left: 30px;
- }
-
- #box form li {
- font-size: 60%;
+ width: 80%;
}
@media (max-width: 450px) {
@@ -164,13 +168,6 @@
text-align: center;
}
- code {
- font-size: 80%;
- background: #eee;
- padding: 4px;
- border-radius: 10px;
- }
-
textarea {
width: 80%;
height: 4.5em;
@@ -179,6 +176,28 @@
.hidden {
display: none;
}
+
+ details {
+ margin-top: 4em;
+ text-align: center;
+ }
+
+ details summary {
+ cursor: pointer;
+ font-size: 11pt;
+ text-decoration: none;
+ }
+
+ details summary:hover {
+ text-decoration: underline;
+ }
+
+ details #qrcode {
+ width:200px;
+ padding-top: 1em;
+ height:200px;
+ margin: auto;
+ }
+
+ Scan to open the chat on the other device +
+