${content}
- ${intro(state)}
-
diff --git a/android/pages/upload.js b/android/pages/upload.js
index 8bf1191b..c98962dd 100644
--- a/android/pages/upload.js
+++ b/android/pages/upload.js
@@ -12,13 +12,15 @@ export default function progressBar(state, emit) {
}
emit('pushState', '/');
}
- return html`
-
-
-
- `;
+
+
+
+
+ `;
};
diff --git a/app/ui/error.js b/app/ui/error.js
index fa2d0457..0b6591ed 100644
--- a/app/ui/error.js
+++ b/app/ui/error.js
@@ -3,18 +3,21 @@ const assets = require('../../common/assets');
module.exports = function(state) {
return html`
-
- `;
+
+
+ `;
};
diff --git a/app/ui/expiryOptions.js b/app/ui/expiryOptions.js
index dbcf20e7..5b638579 100644
--- a/app/ui/expiryOptions.js
+++ b/app/ui/expiryOptions.js
@@ -7,15 +7,18 @@ const signupDialog = require('./signupDialog');
module.exports = function(state, emit) {
const el = html`
-
- `;
+
+
+ `;
};
function replaceLinks(str, urls) {
diff --git a/app/ui/modal.js b/app/ui/modal.js
index 9a0b812f..67e90661 100644
--- a/app/ui/modal.js
+++ b/app/ui/modal.js
@@ -2,13 +2,20 @@ const html = require('choo/html');
module.exports = function(state, emit) {
return html`
-
-
-`;
+ return html`
+
+
-
- ${percent}%
- .
- CANCEL
-
+
+
+ `;
}
diff --git a/app/ui/blank.js b/app/ui/blank.js
index f6411022..8364ca80 100644
--- a/app/ui/blank.js
+++ b/app/ui/blank.js
@@ -1,5 +1,7 @@
const html = require('choo/html');
module.exports = function() {
- return html``;
+ return html`
+
+ `;
};
diff --git a/app/ui/copyDialog.js b/app/ui/copyDialog.js
index ebd4f368..99df32ab 100644
--- a/app/ui/copyDialog.js
+++ b/app/ui/copyDialog.js
@@ -4,20 +4,29 @@ const { copyToClipboard } = require('../utils');
module.exports = function(name, url) {
return function(state, emit, close) {
return html`
-
+
+ ${percent}%
+ .
+ CANCEL
+
-
`;
+ ${state.translate('notifyUploadDone')}
-${state.translate( - 'copyUrlFormLabelWithName', - { filename: name } - )}
- - - ${state.translate( - 'okButton' - )} -
+
+ `;
function copy(event) {
event.stopPropagation();
diff --git a/app/ui/download.js b/app/ui/download.js
index a4d89639..06e94804 100644
--- a/app/ui/download.js
+++ b/app/ui/download.js
@@ -8,31 +8,39 @@ function password(state, emit) {
const invalid = fileInfo.password === null;
const div = html`
- ${state.translate('notifyUploadDone')}
++ ${state.translate('copyUrlFormLabelWithName', { filename: name })} +
+ + + ${state.translate('okButton')} +
+
+ `;
if (!(div instanceof String)) {
setTimeout(() => document.getElementById('password-input').focus());
@@ -87,16 +95,20 @@ module.exports = function(state, emit) {
break;
case 'complete':
content = html`
-
-
-
`;
+
-
`;
+ ${state.translate( - 'downloadFinish' - )}
- -
+
+ `;
break;
default:
content = archiveTile.preview(state, emit);
@@ -105,10 +117,11 @@ module.exports = function(state, emit) {
content = password(state, emit);
}
return html`
- + ${state.translate('downloadFinish')} +
+ +${content}
+ ${intro(state)}
+
- })
-
- ${state.translate( - 'errorPageHeader' - )}
-
- - ${state.translate('uploadPageExplainer')} -
- - ${state.translate('sendYourFilesLink')} - -
+
+
+ + ${state.translate('errorPageHeader')} +
+
+ + ${state.translate('uploadPageExplainer')} +
+ + ${state.translate('sendYourFilesLink')} + +
- ${raw(
- state.translate('frontPageExpireInfo', {
- downloadCount:
- '',
- timespan: ''
- })
- )}
-
`;
+
+ ${
+ raw(
+ state.translate('frontPageExpireInfo', {
+ downloadCount:
+ '',
+ timespan: ''
+ })
+ )
+ }
+
+ `;
if (el.__encoded) {
// we're rendering on the server
return el;
diff --git a/app/ui/legal.js b/app/ui/legal.js
index c8c4ab3c..0f38c465 100644
--- a/app/ui/legal.js
+++ b/app/ui/legal.js
@@ -3,24 +3,31 @@ const raw = require('choo/html/raw');
module.exports = function(state) {
return html`
-
-
- ${state.translate('legalHeader')}
- ${raw( - replaceLinks(state.translate('legalNoticeTestPilot'), [ - 'https://testpilot.firefox.com/terms', - 'https://testpilot.firefox.com/privacy', - 'https://testpilot.firefox.com/experiments/send' - ]) - )} - ${raw( - replaceLinks(state.translate('legalNoticeMozilla'), [ - 'https://www.mozilla.org/privacy/websites/', - 'https://www.mozilla.org/about/legal/terms/mozilla/' - ]) - )} -
+
+ ${state.translate('legalHeader')}
+ ${ + raw( + replaceLinks(state.translate('legalNoticeTestPilot'), [ + 'https://testpilot.firefox.com/terms', + 'https://testpilot.firefox.com/privacy', + 'https://testpilot.firefox.com/experiments/send' + ]) + ) + } + ${ + raw( + replaceLinks(state.translate('legalNoticeMozilla'), [ + 'https://www.mozilla.org/privacy/websites/', + 'https://www.mozilla.org/about/legal/terms/mozilla/' + ]) + ) + } +
-
-
- `;
+
+
+ `;
};
diff --git a/app/ui/okDialog.js b/app/ui/okDialog.js
index 0bca4442..f76d9439 100644
--- a/app/ui/okDialog.js
+++ b/app/ui/okDialog.js
@@ -3,11 +3,15 @@ const html = require('choo/html');
module.exports = function(message) {
return function(state, emit, close) {
return html`
-
${strings.button} + + `; } else { strings = outdatedStrings(state); url = 'https://support.mozilla.org/kb/update-firefox-latest-version'; buttonAction = html` -
-
e.stopPropagation()}>
- ${state.modal(state, emit, close)}
+
`;
+ `;
function close(event) {
if (event) {
diff --git a/app/ui/notFound.js b/app/ui/notFound.js
index dbc6788c..f95cc6c9 100644
--- a/app/ui/notFound.js
+++ b/app/ui/notFound.js
@@ -3,20 +3,25 @@ const assets = require('../../common/assets');
module.exports = function(state) {
return html`
-
+
-
+
+ ${state.modal(state, emit, close)}
+
- })
-
- ${state.translate( - 'expiredPageHeader' - )}
-
- - ${state.translate('uploadPageExplainer')} -
- - ${state.translate('sendYourFilesLink')} - -
+ })
+
+ + ${state.translate('expiredPageHeader')} +
+
+ + ${state.translate('uploadPageExplainer')} +
+ + ${state.translate('sendYourFilesLink')} + +
-
`;
+ ${message}
-
-
+
+ `;
};
};
diff --git a/app/ui/selectbox.js b/app/ui/selectbox.js
index 4b8e0688..e1f7a040 100644
--- a/app/ui/selectbox.js
+++ b/app/ui/selectbox.js
@@ -4,14 +4,22 @@ module.exports = function(selected, options, translate, changed) {
let x = selected;
return html`
- `;
+
+ `;
function choose(event) {
const target = event.target;
diff --git a/app/ui/unsupported.js b/app/ui/unsupported.js
index c7a75425..9233db7d 100644
--- a/app/ui/unsupported.js
+++ b/app/ui/unsupported.js
@@ -11,41 +11,49 @@ module.exports = function(state) {
strings = unsupportedStrings(state);
why = html`
- ${state.translate('notSupportedLink')}
- `;
+ class="text-blue"
+ href="https://github.com/mozilla/send/blob/master/docs/faq.md#why-is-my-browser-not-supported"
+ >
+ ${state.translate('notSupportedLink')}
+
+ `;
url =
'https://www.mozilla.org/firefox/new/?utm_campaign=send-acquisition&utm_medium=referral&utm_source=send.firefox.com';
buttonAction = html`
${message}
+
+
- Firefox
${strings.button}
-
${strings.button} + + `; } else { strings = outdatedStrings(state); url = 'https://support.mozilla.org/kb/update-firefox-latest-version'; buttonAction = html` -
- ${strings.button} -
`; +${strings.button}
+ `; } return html`
- })
- ${buttonAction}
-
+
- `;
+
+ `;
};
function outdatedStrings(state) {
diff --git a/server/initScript.js b/server/initScript.js
index 599e01ac..9bf1749c 100644
--- a/server/initScript.js
+++ b/server/initScript.js
@@ -5,10 +5,13 @@ module.exports = function(state) {
// return '';
return state.cspNonce
? html`
- `
+
+ `
: '';
};
diff --git a/server/layout.js b/server/layout.js
index daa3c2cb..a911fe0a 100644
--- a/server/layout.js
+++ b/server/layout.js
@@ -5,87 +5,117 @@ const initScript = require('./initScript');
module.exports = function(state, body = '') {
const firaTag = state.fira
- ? html``
+ ? html`
+
+ `
: '';
return html`
-
-
-
-
-
-
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
- ${state.title}
+ ${state.title}
-
+
-
-
-
-
-
+
+
+
+
+
-
-
+
+
-
-
-
-
+
+
+
+
-
-
-
+
+
+
-
-
+
+
-
- ${firaTag}
-
-
-
-
-
-
-
-
- ${body}
- ${initScript(state)}
-
+ ${firaTag}
+
+
+
+
+
+
+
+
+ ${body} ${initScript(state)}
+
`;
};
diff --git a/test/frontend/routes.js b/test/frontend/routes.js
index 8c51864d..41dcc390 100644
--- a/test/frontend/routes.js
+++ b/test/frontend/routes.js
@@ -11,37 +11,37 @@ module.exports = function(app) {
app.get('/test', function(req, res) {
res.send(
html`
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
`.toString()
);
});
${strings.header}
-- ${strings.description} -
- ${why} - -
- ${buttonAction}
-
+
- `;
+
+ `;
};
function outdatedStrings(state) {
diff --git a/server/initScript.js b/server/initScript.js
index 599e01ac..9bf1749c 100644
--- a/server/initScript.js
+++ b/server/initScript.js
@@ -5,10 +5,13 @@ module.exports = function(state) {
// return '';
return state.cspNonce
? html`
- `
+
+ `
: '';
};
diff --git a/server/layout.js b/server/layout.js
index daa3c2cb..a911fe0a 100644
--- a/server/layout.js
+++ b/server/layout.js
@@ -5,87 +5,117 @@ const initScript = require('./initScript');
module.exports = function(state, body = '') {
const firaTag = state.fira
- ? html``
+ ? html`
+
+ `
: '';
return html`
-
-
-
-
-
-
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
-