@aXen | 1s2ki woould try to make the Movie App bay Adriano more responsive. So my first choice was so set a fix width for the container for Cast/Crew..
Then i tried to change the grid on view. So full view 4 items, tablet 2 or 3 items and phone 1 item..
But everytime i reloade the page the css isn't working. This is my responsive css:
@media (max-width: 480px) {
[data-pageModule="movies"] .ipsList_inline .ipsGrid_span3.profilePath {
height: 325px;
max-height: 325px;
}
.profilePath img.profileImg,
.profilePath img.defaultImg {
width: 200px;
height: auto;
}
}
@media (max-width: 768px) {
.cMoviesIndexCarouselItemSidebar {
min-height: 135px;
width: 101px;
overflow: hidden;
}
.cMoviesIndexCarouselItemSidebar .cMoviesCarouselItem_info {
width: 101px;
}
.cMoviesIndexCarouselItemSidebar .cMoviesCarouselItem_info a span.cMoviesCarouselTitle {
padding: 5px;
max-width: 101px;
}
.cMoviesIndexCarouselItemSidebar .bgmovieCover {
height: 135px;
}
.shelvesList_desc,
.shelvesList_books,
.shelvesList_avatar {
width: 100%!important;
display: block!important;
float: none!important;
}
.ipsDataItem_modCheck {
margin-top: -10px;
}
.cMoviesTable .ipsDataItem_generic .ipsThumb.ipsThumb_medium {
width: 100%;
max-width: 100%;
}
[data-pageModule="movies"] .ipsApp .ipsGrid > .ipsGrid_span3 { width: 48.93617021276595%; }
}
@media (max-width: 979px) {
[data-pageModule="movies"] .ipsDataList.ipsDataList_reducedSpacing .ipsDataItem {
padding: 10px 10px 20px 10px;
}
[data-pageModule="movies"] .ipsDataItem_icon:not( .ipsResponsive_hidePhone ):not( .ipsResponsive_hideTablet ) + .ipsDataItem_main,
[data-pageModule="movies"] .ipsDataItem_icon:not( .ipsResponsive_hidePhone ):not( .ipsResponsive_hideTablet ) + .ipsDataItem_main + .ipsDataItem_stats {
margin-left: 85px !important;
}
[data-pageModule="movies"] .ipsApp .ipsGrid > .ipsGrid_span3 { width: 48.93617021276595%; }
[data-pageModule="movies"] .ipsList_inline .ipsGrid_span3.profilePath { height: 220px; }
[data-pageModule="movies"] .ipsList_inline .ipsGrid_span3.similar { height: auto; }
}