diff --git a/client/src/components/photo-viewer/photo-viewer.js b/client/src/components/photo-viewer/photo-viewer.js
index 2fad980..4027f53 100644
--- a/client/src/components/photo-viewer/photo-viewer.js
+++ b/client/src/components/photo-viewer/photo-viewer.js
@@ -129,7 +129,7 @@ export function PhotoViewer() {
- {hasNext && }
+
: null}
>
diff --git a/client/src/components/photo-viewer/photo-viewer.scss b/client/src/components/photo-viewer/photo-viewer.scss
index 26a5b8f..f90082e 100644
--- a/client/src/components/photo-viewer/photo-viewer.scss
+++ b/client/src/components/photo-viewer/photo-viewer.scss
@@ -18,6 +18,7 @@
overflow: hidden;
flex-shrink: 1;
max-height: 90vh;
+ margin: 0 10px;
.photo {
position: relative;
@@ -29,6 +30,9 @@
@media (max-width: 768px) {
max-width: calc(100vw - 150px);
}
+ @media (max-width: 520px) {
+ max-width: calc(100vw - 20px);
+ }
}
&.photo--placeholder {
@@ -49,22 +53,19 @@
svg {
color: white;
- opacity: 0.15;
- width: 75px;
- height: 75px;
-
- @media (max-width: 768px) {
- width: 75px;
- height: 75px;
- }
+ opacity: 0.5;
+ font-size: 48px;
}
-
}
.goto-btn {
cursor: pointer;
flex: 1;
+ @media (max-width: 520px) {
+ display: none;
+ }
+
&:hover {
svg {
transform: scale(1.2);