Show message when JavaScript is disabled

11 years ago · 5079756d87
parent 062ccd2c5b
commit 5079756d87
4 changed files with 7 additions and 1 deletions
--- a/assets/javascripts/app/app.coffee
+++ b/assets/javascripts/app/app.coffee
@ -101,6 +101,7 @@
    return

  showLoading: ->
+    document.body.classList.remove '_noscript'
    document.body.classList.add '_loading'
    return

--- a/assets/stylesheets/components/_app.scss
+++ b/assets/stylesheets/components/_app.scss
@ -9,6 +9,7 @@
  @extend %border-box;

  ._booting > & { opacity: 0; }
+  ._noscript > & { display: none; }
 }

 ._booting {
@ -33,3 +34,5 @@
            transition: opacity .1s .3s;
  }
 }
+
+._noscript { opacity: 1; }
--- a/assets/stylesheets/components/_fail.scss
+++ b/assets/stylesheets/components/_fail.scss
@ -1,4 +1,5 @@
 ._fail {
+  display: block;
  position: relative;
  top: 1.5rem;
  width: 24rem;
--- a/views/index.erb
+++ b/views/index.erb
@ -29,6 +29,7 @@
  <%= javascript_tag 'docs' %><% unless App.production? %>
  <%= javascript_tag 'debug' %><% end %>
 </head>
-<body class="_booting">
+<body class="_booting _noscript">
+<noscript class="_fail">DevDocs requires JavaScript to run.</noscript>
 <%= erb :app %></body>
 </html>