diff --git a/src/components/SourceOverlay.jsx b/src/components/SourceOverlay.jsx
index c5214c9..5b3a254 100644
--- a/src/components/SourceOverlay.jsx
+++ b/src/components/SourceOverlay.jsx
@@ -141,9 +141,6 @@ class SourceOverlay extends React.Component {
) : null
- console.log(this.props)
- console.log(this.state.idx)
- console.log(this.props.source.paths.length)
const forwardArrow = this.state.idx < this.props.source.paths.length - 1 ? (
- {this.props.source.title}
+ {this.props.source.title.substring(0, 200)}
{this._renderContent(media)}
diff --git a/src/scss/sourceoverlay.scss b/src/scss/sourceoverlay.scss
index a580cee..6909eac 100644
--- a/src/scss/sourceoverlay.scss
+++ b/src/scss/sourceoverlay.scss
@@ -130,6 +130,7 @@ $header-inset: 10px;
display: flex;
flex-direction: row;
justify-content: space-between;
+ padding: 0 20px;
}
.mo-box {
@@ -222,7 +223,6 @@ $header-inset: 10px;
padding: 20px;
display: flex;
justify-content: center;
- // background: $lightwhite;
box-sizing: border-box;
padding: 0 calc(50% - 400px);
overflow-y: scroll;
@@ -245,9 +245,8 @@ $header-inset: 10px;
.source-image-container, .media-player {
display: flex;
justify-content: center;
- // height: 100%;
- // min-width: calc(100% - 20px);
padding: 20px;
+ min-width: calc(100% - 40px);
}
.media-player {
@@ -260,10 +259,14 @@ $header-inset: 10px;
}
.source-image, .source-video {
- // max-width: calc(100% - 20px);
- // max-height: calc(100% - 20px);
padding: 0px;
font-family: 'Lato', Helvetica, sans-serif;
+ max-width: calc(#{$panel-width} - 100px);
+ max-height: $panel-height;
+ margin: auto;
+ width: auto;
+ height: auto;
+ object-fit: contain;
}
.source-image-loader {