pagesassos/server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Activity

fix(Public): media mosaic container

Browse source
This commit is contained in:
Matthieu Bessat 2020-08-05 14:38:14 +02:00
parent 9872e46847
commit 7c6af664dd
1 changed files with 15 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
assets/development/styles/organization.css
View file

@ -155,12 +155,16 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.mosaic-1 .media-container { .mosaic-1 .media-container {
width: 70%; width: 70%;
} }
/* Mosaic level 2 */ /* Mosaic level 2 */
.mosaic-2 { .mosaic-2 {
width: 80%;
margin-left: auto;
margin-right: auto;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr; grid-template-rows: 1fr;
} }
@ -176,6 +180,9 @@
/* Mosaic level 4 */ /* Mosaic level 4 */
.mosaic-4 { .mosaic-4 {
width: 70%;
margin-left: auto;
margin-right: auto;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr; grid-template-rows: 1fr 1fr;
} }
@ -237,6 +244,13 @@
.media-modal .media-modal-content { .media-modal .media-modal-content {
border-radius: 4px; border-radius: 4px;
width: 100%; width: 100%;
/** crop not very cool images in modal **/
max-height: 80vh;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
} }
.media-modal img, .media-modal video { .media-modal img, .media-modal video {
@ -738,6 +752,7 @@ RESPONSIVE
} }
.media-mosaic { .media-mosaic {
width: 100% !important;
height: 33em; height: 33em;
} }