diff options
Diffstat (limited to 'animism-align/frontend/app/views/viewer/sections/viewer.sections.js')
| -rw-r--r-- | animism-align/frontend/app/views/viewer/sections/viewer.sections.js | 44 |
1 files changed, 23 insertions, 21 deletions
diff --git a/animism-align/frontend/app/views/viewer/sections/viewer.sections.js b/animism-align/frontend/app/views/viewer/sections/viewer.sections.js index f4abbd6..4bb61ec 100644 --- a/animism-align/frontend/app/views/viewer/sections/viewer.sections.js +++ b/animism-align/frontend/app/views/viewer/sections/viewer.sections.js @@ -12,29 +12,31 @@ class ViewerSections extends Component { const { sections } = this.props return ( <div className="viewer-sections"> - {sections.map(section => { - // console.log(section) - return ( - <div - className="viewer-section" - key={section.index} - onClick={() => actions.viewer.seekToSection(section)} - > - <div> - <div className="section-thumbnail" style={{ - backgroundImage: section.media.length && 'url(' + thumbnailURL(section.media[0].media) + ')', - }}/> - <div className="section-title"> - {ROMAN_NUMERALS[section.index]}<br /> - {section.title} - </div> - <div className="section-media"> - {section.mediaLabels} + <div className="viewer-sections-scroll"> + {sections.map(section => { + // console.log(section) + return ( + <div + className="viewer-section" + key={section.index} + onClick={() => actions.viewer.seekToSection(section)} + > + <div> + <div className="section-thumbnail" style={{ + backgroundImage: section.media.length && 'url(' + thumbnailURL(section.media[0].media) + ')', + }}/> + <div className="section-title"> + {ROMAN_NUMERALS[section.index]}<br /> + {section.title} + </div> + <div className="section-media"> + {section.mediaLabels} + </div> </div> </div> - </div> - ) - })} + ) + })} + </div> <ViewerSectionsNav /> </div> ) |