diff --git a/src/components/Overlay/Content.js b/src/components/Overlay/Content.js index 6dab3cf..75e530d 100644 --- a/src/components/Overlay/Content.js +++ b/src/components/Overlay/Content.js @@ -20,6 +20,7 @@ export default ({ media, viewIdx, translations, switchLanguage, langIdx }) => { src={path} loader={
} unloader={} + onClick={() => window.open(path, '_blank')} /> ) diff --git a/src/scss/cover.scss b/src/scss/cover.scss index 73c79af..2266e7d 100644 --- a/src/scss/cover.scss +++ b/src/scss/cover.scss @@ -25,7 +25,7 @@ display: flex; width: 100vw; - @media only screen and (max-width: 992px) { + @media only screen and (max-width: 1200px) { position: inherit; } @@ -183,6 +183,9 @@ min-height: 10px; background-color: black; letter-spacing: 1px; + @media only screen and (max-width: 1200px) { + min-height: 100px; + } } &.yellow { color: black !important; @@ -193,6 +196,9 @@ background-color: $darkwhite; color: white; } + @media only screen and (max-width: 1200px) { + min-height: 100px; + } } } } @@ -209,7 +215,7 @@ h5 { margin-top: -15px; } // mobile styles, remove overlay buttons - @media only screen and (max-width: 992px) { + @media only screen and (max-width: 1200px) { font-size: 22pt !important; max-width: 100vw; padding: 0 40px 80px 40px; diff --git a/src/scss/overlay.scss b/src/scss/overlay.scss index 6aa4e77..0585e06 100644 --- a/src/scss/overlay.scss +++ b/src/scss/overlay.scss @@ -316,6 +316,7 @@ $overlay-bg: rgba(239,239,239,0.9); padding: 20px; min-width: calc(100% - 40px); z-index: $final-level; + max-height: calc(100% - 200px); } .media-player { @@ -332,15 +333,19 @@ $overlay-bg: rgba(239,239,239,0.9); } .source-image, .source-video { - padding: 0px; + padding: 1px; font-family: 'Lato', Helvetica, sans-serif; // max-width: calc(#{$panel-width} - 100px); - max-height: $panel-height; + max-height: 100%; margin: auto; width: auto; height: auto; max-width: 100%; object-fit: contain; + &:hover { + cursor: pointer; + background-color: $yellow; + } } .source-image-loader {