Add noscript messages

ashermorgan · Apr 27, 2024 · 7561505 · 7561505
1 parent 68422e4
commit 7561505
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 0 deletions.
diff --git a/songs2slides/static/slides.css b/songs2slides/static/slides.css
@@ -23,3 +23,10 @@ header .icon:active {
 :fullscreen header {
     display: none;
 }
+
+#noscript-message {
+    max-width: 500px;
+    margin: auto;
+    padding: 1rem;
+    text-align: center;
+}
diff --git a/songs2slides/templates/create-step-3.html b/songs2slides/templates/create-step-3.html
@@ -39,6 +39,7 @@ <h1>Step 3: Create Slideshow</h1>
         <label>
             <input type="radio" name="output-type" value="html" checked/>
             Web View
+            <noscript>(requires JavaScript)</noscript>
         </label>
         <label>
             <input type="radio" name="output-type" value="pptx"/>

diff --git a/songs2slides/templates/slides.html b/songs2slides/templates/slides.html
@@ -22,6 +22,14 @@
     </button>
 </header>
 
+<noscript>
+    <p id="noscript-message">
+    Songs2Slides requires JavaScript to display slideshows in Web View.
+    Please enable it to continue or go back and download your slideshow as a
+    PowerPoint instead.
+    </p>
+</noscript>
+
 <div class="reveal">
     <div class="slides">
         {% for slide in slides %}