diff --git a/.stylelintrc b/.stylelintrc index 3c593e83..c0c673c7 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,6 +1,6 @@ extends: stylelint-config-standard rules: - color-hex-case: upper + color-hex-case: lower declaration-colon-newline-after: null selector-list-comma-newline-after: null diff --git a/frontend/src/fileReceiver.js b/frontend/src/fileReceiver.js index 155a8dd9..ad1611df 100644 --- a/frontend/src/fileReceiver.js +++ b/frontend/src/fileReceiver.js @@ -58,41 +58,46 @@ class FileReceiver extends EventEmitter { true, ['encrypt', 'decrypt'] ) - ]).then(([fdata, key]) => { - this.emit('decrypting', true); - return Promise.all([ - window.crypto.subtle.decrypt( - { - name: 'AES-GCM', - iv: hexToArray(fdata.iv), - additionalData: hexToArray(fdata.aad) - }, - key, - fdata.data - ).then(decrypted => { - this.emit('decrypting', false); - return Promise.resolve(decrypted) - }), - fdata.filename, - hexToArray(fdata.aad) - ]); - }).then(([decrypted, fname, proposedHash]) => { - this.emit('hashing', true); - return window.crypto.subtle.digest('SHA-256', decrypted).then(calculatedHash => { - this.emit('hashing', false); - const integrity = new Uint8Array(calculatedHash).toString() === proposedHash.toString(); - if (!integrity) { - this.emit('unsafe', true) - return Promise.reject(); - } else { - this.emit('safe', true); - return Promise.all([ - decrypted, - decodeURIComponent(fname) - ]); - } + ]) + .then(([fdata, key]) => { + this.emit('decrypting', true); + return Promise.all([ + window.crypto.subtle + .decrypt( + { + name: 'AES-GCM', + iv: hexToArray(fdata.iv), + additionalData: hexToArray(fdata.aad) + }, + key, + fdata.data + ) + .then(decrypted => { + this.emit('decrypting', false); + return Promise.resolve(decrypted); + }), + fdata.filename, + hexToArray(fdata.aad) + ]); }) - }) + .then(([decrypted, fname, proposedHash]) => { + this.emit('hashing', true); + return window.crypto.subtle + .digest('SHA-256', decrypted) + .then(calculatedHash => { + this.emit('hashing', false); + const integrity = + new Uint8Array(calculatedHash).toString() === + proposedHash.toString(); + if (!integrity) { + this.emit('unsafe', true); + return Promise.reject(); + } else { + this.emit('safe', true); + return Promise.all([decrypted, decodeURIComponent(fname)]); + } + }); + }); } } diff --git a/frontend/src/upload.js b/frontend/src/upload.js index 194d50af..3f6ba2cf 100644 --- a/frontend/src/upload.js +++ b/frontend/src/upload.js @@ -40,7 +40,9 @@ $(document).ready(function() { //disable button for 3s $copyBtn.attr('disabled', true); $('#link').attr('disabled', true); - $copyBtn.html('<img src="/resources/check-16.svg" class="icon-check"></img>'); + $copyBtn.html( + '<img src="/resources/check-16.svg" class="icon-check"></img>' + ); window.setTimeout(() => { $copyBtn.attr('disabled', false); $('#link').attr('disabled', false); @@ -71,12 +73,14 @@ $(document).ready(function() { event.preventDefault(); let file = ''; if (event.type === 'drop') { - if (event.originalEvent.dataTransfer.files.length > 1 || event.originalEvent.dataTransfer.files[0].size === 0){ + if ( + event.originalEvent.dataTransfer.files.length > 1 || + event.originalEvent.dataTransfer.files[0].size === 0 + ) { $('.upload-window').removeClass('ondrag'); - document.l10n.formatValue('uploadPageMultipleFilesAlert') - .then(str => { - alert(str); - }); + document.l10n.formatValue('uploadPageMultipleFilesAlert').then(str => { + alert(str); + }); return; } file = event.originalEvent.dataTransfer.files[0]; @@ -95,10 +99,9 @@ $(document).ready(function() { $('#cancel-upload').click(() => { fileSender.cancel(); location.reload(); - document.l10n.formatValue('uploadCancelNotification') - .then(str => { - notify(str); - }); + document.l10n.formatValue('uploadCancelNotification').then(str => { + notify(str); + }); }); fileSender.on('progress', progress => { @@ -110,15 +113,21 @@ $(document).ready(function() { }); if (progress[1] < 1000000) { $('.progress-text').text( - `${file.name} (${(progress[0] / 1000).toFixed(1)}KB of ${(progress[1] / 1000).toFixed(1)}KB)` + `${file.name} (${(progress[0] / 1000).toFixed( + 1 + )}KB of ${(progress[1] / 1000).toFixed(1)}KB)` ); } else if (progress[1] < 1000000000) { $('.progress-text').text( - `${file.name} (${(progress[0] / 1000000).toFixed(1)}MB of ${(progress[1] / 1000000).toFixed(1)}MB)` + `${file.name} (${(progress[0] / 1000000).toFixed( + 1 + )}MB of ${(progress[1] / 1000000).toFixed(1)}MB)` ); } else { $('.progress-text').text( - `${file.name} (${(progress[0] / 1000000).toFixed(1)}MB of ${(progress[1] / 1000000000).toFixed(1)}GB)` + `${file.name} (${(progress[0] / 1000000).toFixed( + 1 + )}MB of ${(progress[1] / 1000000000).toFixed(1)}GB)` ); } }); @@ -163,7 +172,10 @@ $(document).ready(function() { expiry: expiration }; localStorage.setItem(info.fileId, JSON.stringify(fileData)); - $('#upload-filename').attr('data-l10n-id', 'uploadSuccessConfirmHeader'); + $('#upload-filename').attr( + 'data-l10n-id', + 'uploadSuccessConfirmHeader' + ); t = window.setTimeout(() => { $('#page-one').attr('hidden', true); $('#upload-progress').attr('hidden', true); @@ -172,10 +184,9 @@ $(document).ready(function() { }, 1000); populateFileList(JSON.stringify(fileData)); - document.l10n.formatValue('notifyUploadDone') - .then(str => { - notify(str); - }); + document.l10n.formatValue('notifyUploadDone').then(str => { + notify(str); + }); }) .catch(err => { Raven.captureException(err); @@ -219,10 +230,18 @@ $(document).ready(function() { const row = document.createElement('tr'); const name = document.createElement('td'); const link = document.createElement('td'); - const $copyIcon = $('<img>', { src: '/resources/copy-16.svg', class: 'icon-copy', 'data-l10n-id': 'copyUrlHover'}); + const $copyIcon = $('<img>', { + src: '/resources/copy-16.svg', + class: 'icon-copy', + 'data-l10n-id': 'copyUrlHover' + }); const expiry = document.createElement('td'); const del = document.createElement('td'); - const $delIcon = $('<img>', { src: '/resources/close-16.svg', class: 'icon-delete', 'data-l10n-id': 'deleteButtonHover' }); + const $delIcon = $('<img>', { + src: '/resources/close-16.svg', + class: 'icon-delete', + 'data-l10n-id': 'deleteButtonHover' + }); const popupDiv = document.createElement('div'); const $popupText = $('<div>', { class: 'popuptext' }); const cellText = document.createTextNode(file.name); @@ -230,14 +249,8 @@ $(document).ready(function() { const url = file.url.trim() + `#${file.secretKey}`.trim(); $('#link').attr('value', url); - $('#copy-text').attr( - 'data-l10n-args', - '{"filename": "' + file.name + '"}' - ); - $('#copy-text').attr( - 'data-l10n-id', - 'copyUrlFormLabelWithName' - ); + $('#copy-text').attr('data-l10n-args', '{"filename": "' + file.name + '"}'); + $('#copy-text').attr('data-l10n-id', 'copyUrlFormLabelWithName'); $popupText.attr('tabindex', '-1'); name.appendChild(cellText); @@ -264,10 +277,9 @@ $(document).ready(function() { aux.select(); document.execCommand('copy'); document.body.removeChild(aux); - document.l10n.formatValue('copiedUrl') - .then(translated => { - link.innerHTML = translated; - }); + document.l10n.formatValue('copiedUrl').then(translated => { + link.innerHTML = translated; + }); window.setTimeout(() => { const linkImg = document.createElement('img'); $(linkImg).addClass('icon-copy'); @@ -327,13 +339,7 @@ $(document).ready(function() { $(popupNvmSpan).addClass('nvm'); $(popupNvmSpan).attr('data-l10n-id', 'nevermindButton'); - $popupText.html([ - popupDelSpan, - ' ', - ' ', - popupNvmSpan - ]); - + $popupText.html([popupDelSpan, ' ', ' ', popupNvmSpan]); // add data cells to table row row.appendChild(name); @@ -378,7 +384,6 @@ $(document).ready(function() { $popupText.removeClass('show'); }); - toggleHeader(); } function toggleHeader() { diff --git a/public/locales/send.en-US.ftl b/public/locales/send.en-US.ftl index a3873fbb..a68ab579 100644 --- a/public/locales/send.en-US.ftl +++ b/public/locales/send.en-US.ftl @@ -1,4 +1,6 @@ title = Firefox Send +siteSubtitle = web experiment +siteFeedback = Feedback uploadPageHeader = Private, Encrypted File Sharing uploadPageExplainer = Send files through a safe, private, and encrypted link that automatically expires to ensure your stuff does not remain online forever. diff --git a/public/main.css b/public/main.css index e1a1bf7b..18ea52a0 100644 --- a/public/main.css +++ b/public/main.css @@ -1,7 +1,12 @@ /*** index.html ***/ html { background: url('resources/send_bg.svg'); - font-family: 'SF Pro Text', sans-serif; + font-family: -apple-system, + BlinkMacSystemFont, + 'SF Pro Text', + Helvetica, + Arial, + sans-serif; font-weight: 200; background-size: 100%; background-repeat: no-repeat; @@ -10,24 +15,94 @@ html { } body { - min-height: 100%; - position: relative; + display: flex; + flex-direction: column; margin: 0; + min-height: 100vh; + position: relative; +} + +.header { + align-items: flex-start; + box-sizing: border-box; + display: flex; + justify-content: space-between; + padding: 31px; + width: 100%; } .send-logo { + display: flex; position: relative; - top: 31px; - left: 31px; - display: inline-block; + align-items: center; +} + +.site-title { + font-size: 34px; + font-weight: 500; + margin: 0; + position: relative; + top: -1px; +} + +.site-subtitle { + font-size: 12px; + margin: 0 8px; + color: #0c0c0d; +} + +.site-subtitle a { + font-weight: bold; + color: #0c0c0d; + transition: color 50ms; +} + +.send-logo:hover a { + color: #0297f8; +} + +.feedback { + background-color: #0297f8; + background-image: url('resources/feedback.svg'); + background-position: 4px 6px; + background-repeat: no-repeat; + background-size: 14px; + border-radius: 3px; + border: 1px solid #0297f8; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); + color: #fff; + cursor: pointer; + display: block; + float: right; + font-size: 12px; + line-height: 12px; + opacity: 0.9; + padding: 6px 6px 5px 20px; +} + +.feedback:hover, +.feedback:focus { + background-color: #0287e8; +} + +.feedback:active { + background-color: #0277d8; } .all { - padding-top: 10%; - padding-bottom: 51px; + flex: 1; + display: flex; + flex-direction: column; + justify-content: flex-start; + max-width: 630px; + margin: 0 auto; + width: 96%; } -input, select, textarea, button { +input, +select, +textarea, +button { font-family: inherit; } @@ -38,24 +113,26 @@ a { /** page-one **/ .title { font-size: 33px; + line-height: 40px; margin: 20px auto; text-align: center; + max-width: 520px; font-family: 'SF Pro Display', sans-serif; } .description { font-size: 15px; line-height: 23px; - width: 630px; + max-width: 630px; text-align: center; margin: 0 auto 60px; - color: #0C0C0D; + color: #0c0c0d; + width: 92%; } .upload-window { border: 1px dashed rgba(0, 148, 251, 0.5); margin: 0 auto; - width: 640px; height: 255px; border-radius: 4px; display: flex; @@ -63,14 +140,15 @@ a { align-items: center; flex-direction: column; text-align: center; + transition: transform 150ms; + padding: 15px; } .upload-window.ondrag { border: 3px dashed rgba(0, 148, 251, 0.5); margin: 0 auto; - width: 636px; height: 251px; - transform: scale(1.05); + transform: scale(1.04); border-radius: 4.2px; display: flex; justify-content: center; @@ -80,7 +158,7 @@ a { } .link { - color: #0094FB; + color: #0094fb; text-decoration: none; } @@ -92,10 +170,10 @@ a { } #browse { - background: #0297F8; + background: #0297f8; border-radius: 5px; font-size: 15px; - color: #FFF; + color: #fff; width: 240px; height: 44px; display: flex; @@ -110,6 +188,7 @@ input[type="file"] { #file-size-msg { font-size: 12px; + line-height: 16px; color: #737373; margin-bottom: 22px; } @@ -129,7 +208,7 @@ th { td { font-size: 15px; vertical-align: top; - color: #4A4A4A; + color: #4a4a4a; padding: 17px 19px 0; line-height: 23px; } @@ -144,12 +223,13 @@ tbody { } #uploaded-files { - width: 640px; margin: 45.3px auto; table-layout: fixed; } -.icon-delete, .icon-copy, .icon-check { +.icon-delete, +.icon-copy, +.icon-check { cursor: pointer; } @@ -165,7 +245,7 @@ tbody { visibility: hidden; width: 160px; background-color: #555; - color: #FFF; + color: #fff; text-align: center; border-radius: 6px; padding: 8px 0; @@ -239,14 +319,13 @@ tbody { } #cancel-upload { - color: #D70022; + color: #d70022; cursor: pointer; text-decoration: underline; } /** share-link **/ #share-window { - width: 645px; margin: 0 auto; display: flex; justify-content: center; @@ -262,53 +341,59 @@ tbody { #copy { display: flex; flex-wrap: nowrap; + width: 640px; } #copy-text { align-self: flex-start; margin-top: 60px; margin-bottom: 10px; - color: #0C0C0D; + color: #0c0c0d; } #link { - width: 480px; + flex: 1; height: 56px; - border: 1px solid #0297F8; + border: 1px solid #0297f8; border-radius: 6px 0 0 6px; font-size: 24px; color: #737373; font-family: 'SF Pro Display', sans-serif; letter-spacing: 0; line-height: 23px; + padding-left: 5px; + padding-right: 5px; } #link:disabled { - border: 1px solid #05A700; - background: #FFF; + border: 1px solid #05a700; + background: #fff; } #copy-btn { - width: 165px; - height: 60px; - background: #0297F8; - border: 1px solid #0297F8; + flex: 0 1 165px; + background: #0297f8; border-radius: 0 6px 6px 0; + border: 1px solid #0297f8; color: white; cursor: pointer; font-size: 15px; + height: 60px; + padding-left: 10px; + padding-right: 10px; + white-space: nowrap; } #copy-btn:disabled { - background: #05A700; - border: 1px solid #05A700; + background: #05a700; + border: 1px solid #05a700; cursor: auto; } #delete-file { width: 176px; height: 44px; - background: #FFF; + background: #fff; border: 1px solid rgba(12, 12, 13, 0.3); border-radius: 5px; font-size: 15px; @@ -322,7 +407,7 @@ tbody { font-size: 15px; margin: auto; text-align: center; - color: #0094FB; + color: #0094fb; cursor: pointer; text-decoration: underline; } @@ -336,7 +421,8 @@ tbody { text-align: center; } -#upload-error[hidden], #unsupported-browser[hidden] { +#upload-error[hidden], +#unsupported-browser[hidden] { display: none; } @@ -356,9 +442,8 @@ tbody { .unsupported-description { font-size: 13px; line-height: 23px; - width: 630px; text-align: center; - color: #7D7D7D; + color: #7d7d7d; margin: 0 auto 23px; } @@ -370,14 +455,14 @@ tbody { margin-bottom: 181px; width: 260px; height: 80px; - background: #12BC00; + background: #12bc00; border-radius: 3px; cursor: pointer; border: 0; box-shadow: 0 5px 3px rgb(234, 234, 234); font-family: 'Fira Sans'; font-weight: 500; - color: #FFF; + color: #fff; font-size: 26px; display: flex; justify-content: center; @@ -406,15 +491,15 @@ tbody { margin-top: 20px; margin-bottom: 30px; text-align: center; - background: #0297F8; - border: 1px solid #0297F8; + background: #0297f8; + border: 1px solid #0297f8; border-radius: 5px; font-weight: 300; cursor: pointer; } #download-btn:disabled { - background: #47B04B; + background: #47b04b; cursor: auto; } @@ -434,9 +519,8 @@ tbody { .expired-description { font-size: 15px; line-height: 23px; - width: 630px; text-align: center; - color: #7D7D7D; + color: #7d7d7d; margin: 0 auto 23px; } @@ -460,14 +544,13 @@ tbody { /* footer */ .footer { - position: absolute; right: 0; bottom: 0; left: 0; font-size: 15px; display: flex; align-items: flex-end; - padding: 10px; + padding: 50px 10px 10px; } .mozilla-logo { @@ -495,8 +578,60 @@ tbody { margin-left: 30px; } -.github, .twitter { +.github, +.twitter { width: 32px; height: 32px; margin-bottom: -5px; } + +@media (max-width: 768px) { + .description { + margin: 0 auto 25px; + } + + #copy { + width: 100%; + } + + #link { + font-size: 18px; + } + + .mozilla-logo { + margin-left: -7px; + } + + .legal-links > * { + display: block; + padding: 10px 0; + } +} + +@media (max-width: 520px) { + #copy { + width: 100%; + flex-direction: column; + } + + #link { + font-size: 22px; + padding: 15px 10px; + border-radius: 6px 6px 0 0; + } + + #copy-btn { + border-radius: 0 0 6px 6px; + flex: 0 1 65px; + } + + th { + font-size: 14px; + padding: 0 5px; + } + + td { + font-size: 13px; + padding: 17px 5px 0; + } +} diff --git a/public/resources/feedback.svg b/public/resources/feedback.svg new file mode 100644 index 00000000..1e3e3fe5 --- /dev/null +++ b/public/resources/feedback.svg @@ -0,0 +1 @@ +<svg width="15" height="13" viewBox="0 0 15 13" xmlns="http://www.w3.org/2000/svg"><title>Combined Shape</title><path d="M10.274 9.193a5.957 5.957 0 0 1-2.98.778C4.37 9.97 2 7.963 2 5.485 2 3.008 4.37 1 7.294 1c2.924 0 5.294 2.008 5.294 4.485 0 .843-.274 1.632-.751 2.305l.577 2.21-2.14-.807zm-5.983-2.96a.756.756 0 0 0 .763-.748.756.756 0 0 0-.763-.747.756.756 0 0 0-.764.747c0 .413.342.748.764.748zm3.054 0a.756.756 0 0 0 .764-.748.756.756 0 0 0-.764-.747.756.756 0 0 0-.764.747c0 .413.342.748.764.748zm3.054 0a.756.756 0 0 0 .764-.748.756.756 0 0 0-.764-.747.756.756 0 0 0-.763.747c0 .413.342.748.763.748z" fill="#FFF" fill-rule="evenodd"/></svg> \ No newline at end of file diff --git a/public/resources/send_logo_type.svg b/public/resources/send_logo_type.svg deleted file mode 100644 index 07091885..00000000 --- a/public/resources/send_logo_type.svg +++ /dev/null @@ -1 +0,0 @@ -<svg width="180" height="25" viewBox="0 0 180 25" xmlns="http://www.w3.org/2000/svg"><title>logo design_01 copy</title><path d="M82.652.6h5.408v1.299h-3.89v2.446h3.556v1.252H84.17v3.407h-1.517V.6zm7.025.772a.733.733 0 0 1-.253-.574c0-.233.084-.424.253-.574A.938.938 0 0 1 90.323 0c.267 0 .483.075.65.224a.74.74 0 0 1 .25.574.736.736 0 0 1-.25.574c-.167.15-.383.224-.65.224a.938.938 0 0 1-.646-.224zm1.375 1.26v6.372H89.6V2.633h1.452zm3.21 0v.99h.1c.058-.209.17-.396.332-.561.162-.165.363-.295.602-.39.24-.096.494-.143.764-.143.11 0 .222.006.336.017.113.012.203.027.27.047v1.34a1.703 1.703 0 0 0-.32-.056 3.936 3.936 0 0 0-.427-.026c-.313 0-.591.061-.834.183a1.364 1.364 0 0 0-.568.519 1.46 1.46 0 0 0-.202.771v3.681h-1.458V2.633h1.405zm8.488 5.621a2.512 2.512 0 0 1-.985.652 3.77 3.77 0 0 1-1.349.228c-.627 0-1.168-.132-1.622-.396A2.615 2.615 0 0 1 97.747 7.6c-.242-.493-.364-1.08-.364-1.76 0-.679.122-1.269.367-1.77.245-.5.595-.887 1.05-1.159.454-.272.99-.408 1.604-.408.608 0 1.132.129 1.573.385a2.5 2.5 0 0 1 1.01 1.11c.234.483.35 1.057.35 1.72v.466h-4.49v.076c.011.35.084.654.217.915.133.26.32.46.559.6.239.14.517.21.834.21.36 0 .664-.064.908-.19a1.12 1.12 0 0 0 .527-.545h1.38c-.09.385-.264.719-.522 1.002zm-3.122-4.409a1.43 1.43 0 0 0-.543.545 1.841 1.841 0 0 0-.232.812h3.027a1.811 1.811 0 0 0-.2-.818 1.333 1.333 0 0 0-.517-.542 1.506 1.506 0 0 0-.764-.19 1.54 1.54 0 0 0-.77.193zm4.591-.017V2.673h1.052V2.05c0-.637.18-1.1.538-1.392.359-.291.899-.437 1.62-.437.223 0 .468.022.735.064v1.078a3.028 3.028 0 0 0-.559-.047c-.306 0-.532.068-.679.204-.147.136-.22.35-.22.64v.513h1.399v1.154h-1.382v5.177h-1.452V3.827h-1.052zm6.175 4.91a2.615 2.615 0 0 1-1.067-1.145c-.247-.499-.37-1.09-.37-1.773 0-.68.124-1.27.373-1.768a2.646 2.646 0 0 1 1.073-1.148c.466-.266 1.015-.399 1.646-.399.635 0 1.184.133 1.649.4.464.265.82.647 1.07 1.144.248.497.373 1.087.373 1.77 0 .684-.125 1.275-.373 1.774-.25.499-.606.88-1.07 1.145-.465.264-1.014.396-1.65.396-.638 0-1.19-.132-1.654-.396zm2.834-1.366c.276-.367.414-.885.414-1.552 0-.664-.14-1.18-.417-1.55-.279-.369-.67-.553-1.176-.553-.51 0-.903.184-1.182.553-.278.37-.417.886-.417 1.55 0 .667.14 1.185.417 1.552.279.367.673.55 1.182.55.51 0 .902-.183 1.179-.55zm4.14 1.633H115.8l2.081-3.162-2.098-3.21h1.687l1.281 2.19h.1l1.27-2.19h1.604l-2.075 3.152 2.099 3.22h-1.646l-1.317-2.195h-.1l-1.316 2.195zm11.14-7.105h-2.61v-1.3h6.742v1.3h-2.616v7.105h-1.516V1.9zm9.693 6.354a2.512 2.512 0 0 1-.985.652 3.77 3.77 0 0 1-1.349.228c-.627 0-1.168-.132-1.622-.396a2.615 2.615 0 0 1-1.047-1.136c-.243-.493-.364-1.08-.364-1.76 0-.679.122-1.269.367-1.77.245-.5.595-.887 1.05-1.159.454-.272.99-.408 1.604-.408.608 0 1.132.129 1.573.385a2.5 2.5 0 0 1 1.01 1.11c.234.483.35 1.057.35 1.72v.466h-4.49v.076c.011.35.084.654.217.915.133.26.32.46.559.6.239.14.517.21.834.21.36 0 .663-.064.908-.19s.42-.308.526-.545h1.382c-.09.385-.265.719-.523 1.002zm-3.122-4.409a1.43 1.43 0 0 0-.543.545 1.841 1.841 0 0 0-.232.812h3.027a1.811 1.811 0 0 0-.2-.818 1.333 1.333 0 0 0-.517-.542 1.506 1.506 0 0 0-.765-.19 1.54 1.54 0 0 0-.77.193zm5.352-.402c.218-.295.522-.525.912-.69.39-.165.835-.248 1.337-.248.505 0 .947.072 1.325.216.378.144.675.352.89.626.216.274.342.603.377.987h-1.37a.848.848 0 0 0-.396-.538c-.21-.13-.483-.196-.82-.196-.22 0-.418.033-.594.1a1.013 1.013 0 0 0-.417.273.593.593 0 0 0-.153.402c0 .179.077.326.232.443.155.116.395.211.72.285l1.135.256c.619.14 1.073.348 1.363.624.29.275.435.646.435 1.112 0 .4-.116.754-.35 1.063-.233.309-.557.548-.972.72-.416.17-.888.256-1.417.256-.533 0-.997-.073-1.393-.219-.396-.145-.708-.357-.938-.635a1.775 1.775 0 0 1-.396-.993h1.44c.07.241.218.426.444.556.225.13.518.196.878.196.243 0 .459-.033.647-.1a1.01 1.01 0 0 0 .44-.279.608.608 0 0 0 .16-.414.553.553 0 0 0-.215-.448c-.143-.116-.367-.208-.673-.274l-1.14-.262c-.62-.14-1.077-.356-1.373-.65-.296-.292-.444-.678-.444-1.155 0-.38.109-.719.326-1.014zm8.327-.769h1.375v1.154h-1.375v3.127c0 .315.07.545.211.69.141.146.365.219.67.219.134 0 .298-.01.494-.03v1.13c-.243.047-.497.07-.764.07-.498 0-.896-.058-1.196-.174-.3-.117-.52-.301-.658-.553-.14-.253-.21-.587-.21-1.002V3.827h-1.016V2.673h1.017V1.072h1.452v1.601zM159.862.958c.43.239.766.573 1.005 1.002.239.429.358.923.358 1.482 0 .548-.123 1.034-.37 1.46a2.58 2.58 0 0 1-1.032.992c-.44.237-.945.356-1.513.356h-1.84v2.754h-1.517V.6h3.421c.56 0 1.056.12 1.488.358zm-1.893 4.045c.545 0 .967-.136 1.267-.408.3-.271.45-.656.45-1.153 0-.512-.149-.905-.445-1.176-.295-.272-.718-.408-1.266-.408h-1.505v3.145h1.499zm4.867-3.631a.733.733 0 0 1-.253-.574c0-.233.084-.424.253-.574a.938.938 0 0 1 .646-.224c.267 0 .483.075.65.224.167.15.25.341.25.574a.736.736 0 0 1-.25.574c-.167.15-.383.224-.65.224a.938.938 0 0 1-.646-.224zm1.375 1.26v6.372h-1.452V2.633h1.452zM167.533.17v8.835h-1.458V.17h1.458zm2.96 8.568a2.615 2.615 0 0 1-1.068-1.145c-.247-.499-.37-1.09-.37-1.773 0-.68.124-1.27.373-1.768a2.646 2.646 0 0 1 1.073-1.148c.466-.266 1.015-.399 1.646-.399.635 0 1.184.133 1.649.4.464.265.82.647 1.07 1.144.248.497.373 1.087.373 1.77 0 .684-.125 1.275-.374 1.774-.248.499-.605.88-1.07 1.145-.464.264-1.013.396-1.648.396-.639 0-1.19-.132-1.655-.396zm2.832-1.366c.277-.367.415-.885.415-1.552 0-.664-.14-1.18-.418-1.55-.278-.369-.67-.553-1.175-.553-.51 0-.903.184-1.182.553-.278.37-.417.886-.417 1.55 0 .667.14 1.185.417 1.552.279.367.672.55 1.182.55.51 0 .902-.183 1.178-.55zm5.3-4.698H180v1.154h-1.375v3.127c0 .315.07.545.211.69.141.146.365.219.67.219.133 0 .298-.01.494-.03v1.13a4.02 4.02 0 0 1-.764.07c-.498 0-.897-.058-1.196-.174a1.23 1.23 0 0 1-.659-.553c-.139-.253-.208-.587-.208-1.002V3.827h-1.017V2.673h1.017V1.072h1.452v1.601zm-90.83 20.248l-1.557-5.207h-.076l-1.558 5.207h-.811L82 16.648h.782l1.405 5.323h.07l1.564-5.323h.77l1.563 5.323h.07l1.418-5.323h.775l-1.804 6.273h-.817zm8.404-.67a2.47 2.47 0 0 1-.903.574c-.356.134-.754.2-1.193.2-.576 0-1.077-.131-1.502-.396a2.602 2.602 0 0 1-.984-1.127c-.232-.487-.347-1.059-.347-1.715 0-.652.115-1.223.347-1.712a2.6 2.6 0 0 1 .987-1.133c.427-.266.925-.399 1.493-.399.557 0 1.04.125 1.45.376.409.25.723.61.943 1.077.219.468.329 1.019.329 1.651v.338h-4.756v.035c.012.47.104.88.277 1.23.172.349.411.618.717.809.305.19.66.285 1.064.285.446 0 .827-.084 1.14-.253.314-.17.539-.409.676-.72h.782a2.096 2.096 0 0 1-.52.88zm-3.125-4.767a1.9 1.9 0 0 0-.708.748 2.638 2.638 0 0 0-.297 1.124h3.944a2.542 2.542 0 0 0-.246-1.124 1.794 1.794 0 0 0-.673-.748 1.878 1.878 0 0 0-1.003-.265c-.38 0-.719.088-1.017.265zm7.142 5.18a2.203 2.203 0 0 1-.858-.996h-.076v1.253h-.735V14.15h.77v3.716h.07a2.09 2.09 0 0 1 .841-.967 2.414 2.414 0 0 1 1.293-.355c.53 0 .996.134 1.4.402.403.268.714.646.934 1.136.22.489.329 1.056.329 1.7 0 .641-.11 1.207-.332 1.698-.222.491-.533.872-.935 1.142-.401.27-.867.405-1.396.405-.486 0-.92-.12-1.305-.362zm.062-5.12c-.312.21-.553.509-.723.895-.17.386-.256.834-.256 1.342 0 .51.086.957.256 1.343s.411.684.723.894c.312.21.673.314 1.085.314.411 0 .77-.103 1.075-.311.306-.208.541-.505.706-.891.164-.387.246-.838.246-1.354 0-.517-.082-.966-.246-1.349a1.987 1.987 0 0 0-.706-.885 1.867 1.867 0 0 0-1.075-.312c-.412 0-.773.105-1.085.315zm13.437 4.707c-.245.248-.545.44-.902.574a3.37 3.37 0 0 1-1.193.2c-.576 0-1.077-.131-1.502-.396a2.602 2.602 0 0 1-.985-1.127c-.23-.487-.346-1.059-.346-1.715 0-.652.115-1.223.346-1.712.232-.49.56-.867.988-1.133.427-.266.925-.399 1.493-.399.556 0 1.04.125 1.449.376.41.25.724.61.943 1.077.22.468.33 1.019.33 1.651v.338h-4.756v.035c.012.47.104.88.276 1.23.173.349.412.618.718.809.305.19.66.285 1.063.285.447 0 .827-.084 1.14-.253.314-.17.54-.409.677-.72h.782a2.096 2.096 0 0 1-.52.88zm-3.124-4.767a1.9 1.9 0 0 0-.708.748 2.638 2.638 0 0 0-.297 1.124h3.944a2.542 2.542 0 0 0-.247-1.124 1.794 1.794 0 0 0-.673-.748 1.878 1.878 0 0 0-1.002-.265c-.38 0-.719.088-1.017.265zm5.567 5.437h-.882l2.234-3.157-2.252-3.116h.93l1.721 2.504h.071l1.71-2.504h.888l-2.222 3.087 2.246 3.186h-.923l-1.723-2.563h-.07l-1.728 2.563zm10.219-5.976c.402.268.713.646.934 1.136.222.489.333 1.056.333 1.7 0 .645-.111 1.212-.333 1.701-.22.49-.532.869-.934 1.139s-.867.405-1.396.405c-.49 0-.924-.116-1.302-.347a2.056 2.056 0 0 1-.832-.952h-.07V25h-.77v-8.352h.734v1.281h.07c.197-.43.487-.77.87-1.016.385-.247.818-.37 1.3-.37.529 0 .994.134 1.396.402zm-.485 5.076c.306-.208.542-.503.708-.885.167-.383.25-.832.25-1.349 0-.516-.083-.968-.25-1.354a2.002 2.002 0 0 0-.708-.891 1.867 1.867 0 0 0-1.076-.312 1.88 1.88 0 0 0-1.084.318 2.05 2.05 0 0 0-.723.894c-.17.384-.256.83-.256 1.34 0 .508.085.955.256 1.339.17.384.411.682.723.894.311.212.67.317 1.078.317.416 0 .776-.103 1.082-.311zm8.026.23c-.244.248-.545.44-.902.574-.356.134-.754.2-1.193.2-.576 0-1.077-.131-1.502-.396a2.602 2.602 0 0 1-.985-1.127c-.23-.487-.346-1.059-.346-1.715 0-.652.115-1.223.346-1.712.232-.49.56-.867.988-1.133.427-.266.925-.399 1.493-.399.557 0 1.04.125 1.449.376.41.25.724.61.943 1.077.22.468.33 1.019.33 1.651v.338h-4.756v.035c.012.47.104.88.277 1.23.172.349.411.618.717.809.305.19.66.285 1.064.285.446 0 .826-.084 1.14-.253.313-.17.539-.409.676-.72h.782a2.096 2.096 0 0 1-.52.88zm-3.124-4.767a1.9 1.9 0 0 0-.708.748 2.638 2.638 0 0 0-.297 1.124h3.944a2.542 2.542 0 0 0-.247-1.124 1.794 1.794 0 0 0-.673-.748 1.878 1.878 0 0 0-1.002-.265c-.38 0-.719.088-1.017.265zm6.149-.836v1.03h.076a1.44 1.44 0 0 1 .362-.593c.17-.171.377-.304.62-.4.243-.094.503-.142.782-.142.25 0 .448.018.593.052v.763a3.366 3.366 0 0 0-.688-.076c-.32 0-.612.075-.872.225-.26.15-.466.355-.615.617a1.754 1.754 0 0 0-.223.883v3.914h-.77v-6.273h.735zm3.853-1.567a.551.551 0 0 1-.168-.402c0-.155.056-.288.168-.399a.552.552 0 0 1 .403-.166c.156 0 .291.056.405.166.114.111.17.244.17.4a.547.547 0 0 1-.167.401.554.554 0 0 1-.408.17.547.547 0 0 1-.403-.17zm.79 1.567v6.273h-.77v-6.273h.77zm2.751 0v1.13h.077a1.79 1.79 0 0 1 .69-.906c.324-.22.703-.329 1.138-.329.435 0 .808.11 1.12.33.311.219.536.52.673.905h.076a1.97 1.97 0 0 1 .773-.903c.35-.221.752-.332 1.202-.332.635 0 1.128.182 1.479.545.35.363.526.876.526 1.54v4.293h-.77v-4.118c0-.513-.125-.903-.374-1.17-.248-.269-.612-.403-1.09-.403-.317 0-.6.075-.846.225-.247.15-.44.354-.576.614-.138.26-.206.551-.206.874v3.978h-.77v-4.2c0-.299-.061-.56-.182-.786a1.278 1.278 0 0 0-.512-.521 1.544 1.544 0 0 0-.764-.184c-.302 0-.577.082-.826.245a1.7 1.7 0 0 0-.588.667 2.02 2.02 0 0 0-.214.929v3.85h-.77v-6.273h.734zm14.293 5.603c-.245.248-.546.44-.902.574-.357.134-.755.2-1.193.2-.577 0-1.077-.131-1.502-.396a2.602 2.602 0 0 1-.985-1.127c-.231-.487-.347-1.059-.347-1.715 0-.652.116-1.223.347-1.712.231-.49.56-.867.988-1.133.427-.266.924-.399 1.493-.399.556 0 1.04.125 1.449.376.41.25.724.61.943 1.077.22.468.33 1.019.33 1.651v.338h-4.756v.035c.012.47.104.88.276 1.23.173.349.412.618.717.809.306.19.66.285 1.064.285.447 0 .827-.084 1.14-.253.314-.17.54-.409.677-.72h.781a2.096 2.096 0 0 1-.52.88zm-3.124-4.767a1.9 1.9 0 0 0-.708.748 2.638 2.638 0 0 0-.297 1.124h3.944a2.542 2.542 0 0 0-.247-1.124 1.794 1.794 0 0 0-.673-.748 1.878 1.878 0 0 0-1.002-.265c-.38 0-.72.088-1.017.265zm6.148-.836v1.13h.077c.168-.392.427-.696.776-.912.348-.215.772-.323 1.27-.323.705 0 1.25.201 1.636.603.386.402.58.968.58 1.698v4.077h-.77v-3.885c0-.598-.139-1.049-.415-1.351-.276-.303-.689-.455-1.237-.455a1.93 1.93 0 0 0-.979.245 1.703 1.703 0 0 0-.664.69c-.159.297-.238.64-.238 1.028v3.728h-.77v-6.273h.734zm7.442 0h1.464v.646h-1.464v3.891c0 .384.078.663.235.836.157.173.414.259.77.259.177 0 .33-.006.459-.017v.652a4.021 4.021 0 0 1-.54.04c-.409 0-.736-.053-.983-.16a1.039 1.039 0 0 1-.54-.51c-.114-.232-.17-.54-.17-.925v-4.066h-1.035v-.646h1.034v-1.63h.77v1.63zM4.739 19.117c.448.494 1.042.875 1.782 1.143s1.585.402 2.534.402c.876 0 1.663-.137 2.361-.41.699-.273 1.244-.654 1.635-1.143.39-.49.586-1.043.586-1.661 0-.804-.326-1.458-.977-1.963-.652-.505-1.702-.922-3.152-1.252l-2.924-.664c-2.044-.454-3.558-1.193-4.543-2.218C1.056 10.326.563 8.984.563 7.325c0-1.34.35-2.516 1.048-3.531.698-1.015 1.681-1.803 2.948-2.365C5.825.868 7.293.587 8.96.587c1.564 0 2.966.276 4.207.827 1.24.551 2.226 1.321 2.956 2.31.73.99 1.126 2.118 1.188 3.385H13.45c-.135-.979-.61-1.757-1.423-2.334-.813-.577-1.84-.865-3.08-.865-.855 0-1.609.129-2.26.386-.652.258-1.158.624-1.517 1.097a2.66 2.66 0 0 0-.54 1.654c0 .752.308 1.363.923 1.831.615.47 1.621.863 3.018 1.183l2.596.587c1.533.34 2.776.785 3.73 1.337.954.55 1.655 1.23 2.103 2.04.449.808.673 1.784.673 2.928 0 1.432-.357 2.679-1.071 3.74-.715 1.061-1.739 1.878-3.073 2.45-1.335.571-2.91.857-4.723.857-1.71 0-3.217-.27-4.52-.811-1.303-.541-2.328-1.309-3.073-2.303-.745-.994-1.15-2.16-1.212-3.5h3.941c.083.66.35 1.236.798 1.73zm29.895 2.333c-.688.752-1.561 1.33-2.62 1.73-1.058.403-2.254.604-3.589.604-1.668 0-3.107-.35-4.316-1.051-1.21-.7-2.137-1.705-2.784-3.014-.646-1.308-.97-2.864-.97-4.667s.326-3.369.978-4.698C21.985 9.025 22.915 8 24.125 7.28c1.209-.721 2.632-1.082 4.269-1.082 1.616 0 3.01.34 4.183 1.02 1.173.68 2.07 1.661 2.69 2.944.62 1.283.93 2.805.93 4.567v1.236H24.25v.2c.03.928.224 1.737.578 2.427.355.69.85 1.221 1.486 1.592.636.37 1.376.556 2.22.556.96 0 1.765-.167 2.417-.502.652-.335 1.118-.817 1.4-1.445h3.675a5.853 5.853 0 0 1-1.392 2.658zM26.33 9.751a3.8 3.8 0 0 0-1.447 1.445c-.36.624-.566 1.342-.618 2.156h8.054c-.02-.824-.198-1.548-.531-2.171a3.542 3.542 0 0 0-1.377-1.437c-.584-.335-1.261-.503-2.033-.503-.76 0-1.444.17-2.048.51zm16.899-3.214v2.704h.266c.417-.968 1.055-1.717 1.916-2.248.86-.53 1.915-.796 3.166-.796 1.898 0 3.355.546 4.372 1.638 1.016 1.092 1.524 2.648 1.524 4.667v10.942h-3.878v-10.03c0-1.298-.282-2.27-.845-2.913-.563-.644-1.433-.966-2.611-.966-.761 0-1.426.165-1.994.495a3.307 3.307 0 0 0-1.314 1.414c-.308.613-.461 1.331-.461 2.155v9.845h-3.88V6.537h3.738zm17.697 16.119c-1.064-.711-1.88-1.724-2.448-3.037-.568-1.314-.852-2.862-.852-4.644 0-1.772.287-3.312.86-4.62.574-1.31 1.39-2.319 2.448-3.03 1.058-.71 2.301-1.066 3.73-1.066 1.167 0 2.21.263 3.127.788a5.042 5.042 0 0 1 2.065 2.179h.266V0H74v23.444h-3.753V20.77h-.266a5.252 5.252 0 0 1-2.135 2.171c-.933.52-1.994.78-3.182.78-1.429 0-2.675-.355-3.738-1.065zm2.666-12.48c-.64.438-1.133 1.07-1.478 1.894-.344.824-.516 1.797-.516 2.92 0 1.134.172 2.11.516 2.929.345.819.837 1.447 1.478 1.885.642.438 1.4.657 2.276.657.886 0 1.652-.219 2.299-.657.646-.438 1.141-1.069 1.485-1.893.344-.824.516-1.798.516-2.92 0-1.113-.174-2.082-.523-2.906-.35-.824-.848-1.458-1.494-1.9-.646-.444-1.407-.665-2.283-.665-.876 0-1.634.219-2.276.656z" fill="#3E3D40" fill-rule="evenodd"/></svg> \ No newline at end of file diff --git a/server/server.js b/server/server.js index 24e1d418..97787255 100644 --- a/server/server.js +++ b/server/server.js @@ -34,10 +34,12 @@ app.engine( app.set('view engine', 'handlebars'); app.use(helmet()); -app.use(helmet.hsts({ - maxAge: 31536000, - force: conf.env === 'production' -})); +app.use( + helmet.hsts({ + maxAge: 31536000, + force: conf.env === 'production' + }) +); app.use( helmet.contentSecurityPolicy({ directives: { @@ -241,7 +243,7 @@ app.post('/upload', (req, res, next) => { .catch(err => { log.info('DeleteError:', newId); }); - }) + }); }); app.get('/__lbheartbeat__', (req, res) => { diff --git a/views/layouts/main.handlebars b/views/layouts/main.handlebars index 285ad3c7..5eb891ff 100644 --- a/views/layouts/main.handlebars +++ b/views/layouts/main.handlebars @@ -13,10 +13,17 @@ <script defer src="/l20n/dist/web/l20n.js"></script> </head> <body> - <div class="send-logo"> - <img src="/resources/send_logo.svg"/> - <img src="/resources/send_logo_type.svg"/> - </div> + <header class="header"> + <div class="send-logo"> + <img src="/resources/send_logo.svg" alt="Send"/> + <h1 class="site-title">Send</h1> + <div class="site-subtitle"> + <a href="https://testpilot.firefox.com" target="_blank">Firefox Test Pilot</a> + <div data-l10n-id="siteSubtitle">web experiment</div> + </div> + </div> + <a href="https://qsurvey.mozilla.com/s3/txp-firefox-send" rel="noreferrer noopener" class="feedback" target="_blank" data-l10n-id="siteFeedback">Feedback</a> + </header> <div class="all"> {{{body}}} </div>