Add noscript
message for users with JavaScript disabled
Committed f67d2b
--- a/canopy/static/screen.css
+++ b/canopy/static/screen.css
grid-column-gap: 1em;
/* grid-template-columns: 5em 40em 13em; */
grid-template-columns: 8.333% 66.666% 21.666%;
- grid-template-rows: min-content min-content min-content;
+ grid-template-rows: min-content min-content min-content min-content;
margin: 0 auto;
max-width: 60em;
padding: 1em 0 0 0; }
/* body.widescreen > nav {
display: none; } */
+.noscript {
+ color: #b58900;
+ grid-column-start: 1;
+ grid-column-end: 4;
+ grid-row: 1;
+ display: block;
+ font-size: .7em;
+ margin-bottom: 1em;
+ text-align: center;
+}
+
body > header {
display: grid;
grid-column-start: 1;
grid-column-end: 4;
- grid-row: 1;
+ grid-row: 2;
grid-template-columns: auto auto;
margin-bottom: 1em; }
body > header > div:last-child {
article#content {
grid-column: 2;
- grid-row: 2; }
+ grid-row: 3; }
body > nav {
grid-column: 1;
- grid-row: 2; }
+ grid-row: 3; }
body > aside {
grid-column: 3;
- grid-row-start: 2;
- grid-row-end: 3; }
+ grid-row-start: 3;
+ grid-row-end: 4; }
body > aside #livestream {
font-size: 8px;
height: 7em;
font-size: .8em;
grid-column-start: 1;
grid-column-end: 4;
- grid-row: 3;
+ grid-row: 4;
padding: 1.25em 0 0 0;
text-align: center; }
--- a/canopy/templates/template.html
+++ b/canopy/templates/template.html
class="$' '.join(resource.body_classes)"\
>
+<noscript class=noscript>You have JavaScript disabled — some features of
+this site will not be available.</noscript>
+
<header>
<div class=h-card>
$if "photo" in owner: