From 49bf241d0fa275053424db3458a057de7b9d418f Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Sat, 21 Nov 2020 16:44:07 +0100
Subject: messaging if rest of chapters are disabled. grayscale all disabled
 media

---
 .../frontend/app/views/viewer/nav/eflux.chrome.js         | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

(limited to 'animism-align/frontend/app/views/viewer/nav/eflux.chrome.js')

diff --git a/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js b/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
index 6da6f76..f2f02d2 100644
--- a/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
+++ b/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
@@ -48,10 +48,20 @@ class EfluxChrome extends Component {
     }
   }
   render() {
-    const { navStyle, playing, transcriptOpen, growlOpen, growlMessage, atEndOfSection, currentSection } = this.props
+    const {
+      navStyle, navGradient,
+      playing, transcriptOpen,
+      growlOpen, growlMessage,
+      atEndOfSection, currentSection
+    } = this.props
     const showingTranscriptTooltip = ((atEndOfSection && currentSection.index === 0) || this.state.transcript)
+    let className = "eflux-header"
+    if (navStyle) className += ' ' + navStyle
+    if (navGradient) className += ' gradient'
+    if (transcriptOpen) className += ' transcript-open'
     return (
-      <div className={"eflux-header " + navStyle + (transcriptOpen ? ' transcript-open' : '')}>
+      <div className={className}>
+        <div className="eflux-gradient" />
         <div className="eflux-logo">
           <a
             href={URLS.eflux_logo}
@@ -99,6 +109,7 @@ class EfluxChrome extends Component {
 
 const mapStateToProps = state => ({
   navStyle: state.viewer.navStyle,
+  navGradient: state.viewer.navGradient,
   playing: state.audio.playing,
   transcriptOpen: state.viewer.transcript,
   growlOpen: state.viewer.growlOpen,
-- 
cgit v1.2.3-70-g09d2