maximx1/photo-portfolio
1
0
Fork 0
Code Issues 20 Pull Requests Projects Releases Wiki Activity

[17] Images are contained in a box now whether it's horizontal or vertical #24

Merged
maximx1 merged 1 commits from 17-tall-images into develop 2022-05-30 16:09:40 -04:00
Conversation 1 Commits 1 Files Changed 1 +5 -3
1 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 89ca017983 - Show all commits

8
src/photoDisplays/PhotoGrid.scss
View File

@ -12,8 +12,8 @@
left: 50%; left: 50%;
top: 50%; top: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
height: auto; max-height: 100%;
width: 100%; max-width: 100%;
} }
} }
} }
@ -21,6 +21,7 @@
@media only screen and (min-width: 1500px) { @media only screen and (min-width: 1500px) {
.photo-grid { .photo-grid {
.photo-grid-thumb-container { .photo-grid-thumb-container {
height: 200px;
width: 23%; width: 23%;
} }
} }
@ -30,6 +31,7 @@
@media only screen and (max-width: 1499px) and (min-width: 1000px) { @media only screen and (max-width: 1499px) and (min-width: 1000px) {
.photo-grid { .photo-grid {
.photo-grid-thumb-container { .photo-grid-thumb-container {
height: 200px;
width: 30%; width: 30%;
} }
} }
@ -38,6 +40,7 @@
@media only screen and (max-width: 999px) and (min-width: 700px) { @media only screen and (max-width: 999px) and (min-width: 700px) {
.photo-grid { .photo-grid {
.photo-grid-thumb-container { .photo-grid-thumb-container {
height: 200px;
width: 44%; width: 44%;
} }
} }
@ -46,7 +49,6 @@
@media only screen and (max-width: 699px) { @media only screen and (max-width: 699px) {
.photo-grid { .photo-grid {
.photo-grid-thumb-container { .photo-grid-thumb-container {
margin: 10px 10px 0 10px; margin: 10px 10px 0 10px;
width: 100%; width: 100%;
} }