natty
/
fox-send
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

updated noscript style

This commit is contained in:
Danny Coates 2018-02-19 23:10:03 -08:00
parent 343627eb82
commit afb099f9df
No known key found for this signature in database
GPG Key ID: 4C442633C62E00CB
3 changed files with 21 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/base.css
View File

@ -20,8 +20,6 @@ html {
background-size: 110%; background-size: 110%;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center top; background-position: center top;
height: 100%;
margin: auto;
} }
body { body {
@ -31,7 +29,6 @@ body {
flex-direction: column; flex-direction: column;
margin: 0; margin: 0;
min-height: 100vh; min-height: 100vh;
position: relative;
} }
input, input,
@ -46,11 +43,8 @@ a {
text-decoration: none; text-decoration: none;
} }
.all { .main {
flex: 1; flex: auto;
display: flex;
flex-direction: column;
justify-content: flex-start;
max-width: 650px; max-width: 650px;
margin: 0 auto; margin: 0 auto;
padding: 0 20px; padding: 0 20px;
@ -58,6 +52,12 @@ a {
width: 96%; width: 96%;
} }
.noscript {
text-align: center;
border: 3px solid var(--errorColor);
border-radius: 6px;
}
.btn { .btn {
font-size: 15px; font-size: 15px;
font-weight: 500; font-weight: 500;

20
app/routes/index.js
View File

@ -29,18 +29,20 @@ function body(template) {
const b = html`<body> const b = html`<body>
${banner(state, emit)} ${banner(state, emit)}
${header(state)} ${header(state)}
<div class="all"> <main class="main">
<noscript> <noscript>
<h2>${state.translate('javascriptRequired')}</h2> <div class="noscript">
<p> <h2>${state.translate('javascriptRequired')}</h2>
<a href="https://github.com/mozilla/send/blob/master/docs/faq.md#why-does-firefox-send-require-javascript"> <p>
${state.translate('whyJavascript')} <a class="link" href="https://github.com/mozilla/send/blob/master/docs/faq.md#why-does-firefox-send-require-javascript">
</a> ${state.translate('whyJavascript')}
</p> </a>
<p>${state.translate('enableJavascript')}</p> </p>
<p>${state.translate('enableJavascript')}</p>
</div>
</noscript> </noscript>
${template(state, emit)} ${template(state, emit)}
</div> </main>
${footer(state)} ${footer(state)}
</body>`; </body>`;
if (state.layout) { if (state.layout) {

4
app/templates/footer/index.js
View File

@ -2,7 +2,7 @@ const html = require('choo/html');
const assets = require('../../../common/assets'); const assets = require('../../../common/assets');
module.exports = function(state) { module.exports = function(state) {
return html`<div class="footer"> return html`<footer class="footer">
<div class="legalSection"> <div class="legalSection">
<a <a
href="https://www.mozilla.org" href="https://www.mozilla.org"
@ -60,5 +60,5 @@ module.exports = function(state) {
alt="twitter"/> alt="twitter"/>
</a> </a>
</div> </div>
</div>`; </footer>`;
}; };