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

Merge pull request '[17] Images are contained in a box now whether it's horizontal or vertical' (#24) from 17-tall-images into develop

Browse Source 
Reviewed-on: #24
This commit is contained in:
maximx1 2022-05-30 16:09:39 -04:00
commit af10417192
1 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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%;
} }