carousel

2 files changed, 12 insertions, 2 deletions

diff --git a/animism-align/frontend/app/views/viewer/player/components.media/media.carousel.js b/animism-align/frontend/app/views/viewer/player/components.media/media.carousel.js
index 8d91675..6d08e28 100644
--- a/animism-align/frontend/app/views/viewer/player/components.media/media.carousel.js
+++ b/animism-align/frontend/app/views/viewer/player/components.media/media.carousel.js
@@ -15,7 +15,7 @@ const SLIDES_PER_VIEW = 2
 let slideChangedHook = slider => console.log(slider)
 let slideChanged = slider => slideChangedHook(slider)
 
-const CarouselContainer = ({ element, media, play_ts }) => {
+const CarouselContainer = ({ element, media, play_ts, withMouseWheel }) => {
   const { image_order, caption_lookup } = media.settings
 
   const [currentSlide, setCurrentSlide] = React.useState(0)
@@ -26,6 +26,7 @@ const CarouselContainer = ({ element, media, play_ts }) => {
     centered: true,
     loop: false,
     slideChanged: slideChanged,
+    withMouseWheel: withMouseWheel,
   })
 
   slideChangedHook = s => {
diff --git a/animism-align/frontend/app/views/viewer/player/components.media/media.css b/animism-align/frontend/app/views/viewer/player/components.media/media.css
index cb15150..2296d73 100644
--- a/animism-align/frontend/app/views/viewer/player/components.media/media.css
+++ b/animism-align/frontend/app/views/viewer/player/components.media/media.css
@@ -97,7 +97,9 @@
 .carousel-container {
   margin-top: 0.5rem;
   margin-bottom: 1.5rem;
-  padding: 1rem;
+  /*padding: 1rem;*/
+  height: calc(100vh - 1rem);
+  position: relative;
 }
 .carousel-items {
   width: 100%;
@@ -140,6 +142,13 @@
 .viewer-fullscreen .carousel .citation {
   height: 5rem;
 }
+.player-transcript .media .citation {
+  height: 9rem;
+  padding-top: 4rem;
+}
+.player-transcript .carousel-nav .dots {
+  bottom: 5rem;
+}
 
 /* gallery */