2 files changed, 12 insertions, 10 deletions
diff --git a/src/client/views/collections/CollectionCarousel3DView.scss b/src/client/views/collections/CollectionCarousel3DView.scss
index ee92cde4c..0f2d20242 100644
--- a/src/client/views/collections/CollectionCarousel3DView.scss
+++ b/src/client/views/collections/CollectionCarousel3DView.scss
@@ -3,10 +3,9 @@
     height: 100%;
 
     .collectionCarouselView-image {
-        overflow: hidden; //fix ContentFittingView size
         position: absolute;
         height: 100%;
-        width: 70%;
+        width: 60%;
         top: 0;
         left: 0;
         right: 0;
@@ -16,21 +15,17 @@
     }
 
     .collectionCarouselView-prev {
-        overflow: hidden;
         position: absolute;
         height: 50%;
-        width: 50%;
-        background-color: lightgrey;
+        width: 30%;
         left: 0;
         top: 25%;
     }
 
     .collectionCarouselView-next {
-        overflow: hidden;
         position: absolute;
         height: 50%;
-        width: 50%;
-        background-color: lightgrey;
+        width: 30%;
         right: 0;
         top: 25%;
     }
diff --git a/src/client/views/collections/CollectionCarousel3DView.tsx b/src/client/views/collections/CollectionCarousel3DView.tsx
index 4452ceb6b..c2ed39cc9 100644
--- a/src/client/views/collections/CollectionCarousel3DView.tsx
+++ b/src/client/views/collections/CollectionCarousel3DView.tsx
@@ -40,6 +40,10 @@ export class CollectionCarousel3DView extends CollectionSubView(Carousel3DDocume
         this.layoutDoc._itemIndex = (NumCast(this.layoutDoc._itemIndex) - 1 + this.childLayoutPairs.length) % this.childLayoutPairs.length;
     }
 
+    mainPanelWidth = () => this.props.PanelWidth() * 0.6;
+    sidePanelWidth = () => this.props.PanelWidth() * 0.3;
+    sidePanelHeight = () => this.props.PanelHeight() * 0.5;
+
     @computed get content() {
         const index = NumCast(this.layoutDoc._itemIndex);
         const prevIndex = (index - 1 + this.childLayoutPairs.length) % this.childLayoutPairs.length;
@@ -55,7 +59,8 @@ export class CollectionCarousel3DView extends CollectionSubView(Carousel3DDocume
                         LayoutTemplateString={this.props.ChildLayoutString}
                         Document={this.childLayoutPairs[prevIndex].layout}
                         DataDoc={this.childLayoutPairs[prevIndex].data}
-                        PanelHeight={this.props.PanelHeight}
+                        PanelWidth={this.sidePanelWidth}
+                        PanelHeight={this.sidePanelHeight}
                         ScreenToLocalTransform={this.props.ScreenToLocalTransform}
                         bringToFront={returnFalse}
                         parentActive={this.props.active}
@@ -70,7 +75,8 @@ export class CollectionCarousel3DView extends CollectionSubView(Carousel3DDocume
                         LayoutTemplateString={this.props.ChildLayoutString}
                         Document={this.childLayoutPairs[nextIndex].layout}
                         DataDoc={this.childLayoutPairs[nextIndex].data}
-                        PanelHeight={this.props.PanelHeight}
+                        PanelWidth={this.sidePanelWidth}
+                        PanelHeight={this.sidePanelHeight}
                         ScreenToLocalTransform={this.props.ScreenToLocalTransform}
                         bringToFront={returnFalse}
                         parentActive={this.props.active}
@@ -85,6 +91,7 @@ export class CollectionCarousel3DView extends CollectionSubView(Carousel3DDocume
                         LayoutTemplateString={this.props.ChildLayoutString}
                         Document={this.childLayoutPairs[index].layout}
                         DataDoc={this.childLayoutPairs[index].data}
+                        PanelWidth={this.mainPanelWidth}
                         PanelHeight={this.props.PanelHeight}
                         ScreenToLocalTransform={this.props.ScreenToLocalTransform}
                         bringToFront={returnFalse}