fixed user data icon wrapping

This commit is contained in:
Luke Pulverenti 2013-05-18 18:48:19 -04:00
parent bfab5f2404
commit fca737be13
3 changed files with 41 additions and 45 deletions

View File

@ -379,6 +379,13 @@ a.itemTag:hover {
overflow: hidden; overflow: hidden;
} }
@media all and (min-width: 600px) {
.inlineDetailSection:not(.hide) {
display: inline-block;
margin-bottom: 2em;
}
}
@media all and (max-width: 750px) { @media all and (max-width: 750px) {
.itemBackdrop { .itemBackdrop {
@ -425,9 +432,6 @@ a.itemTag:hover {
} }
} }
@media all and (min-width: 1200px) {
}
@media all and (min-width: 650px) { @media all and (min-width: 650px) {
.libraryPage .ui-content { .libraryPage .ui-content {
padding: 15px 20px 100px; padding: 15px 20px 100px;

View File

@ -122,47 +122,39 @@
<div data-role="content"> <div data-role="content">
<div class="detailPageContent"> <div class="detailPageContent">
<div style="display: inline-block;"> <div id="detailsSection" class="detailSection inlineDetailSection hide">
<div id="detailsSection" style="display: none;" class="detailSection"> <div class="detailSectionHeader" style="margin-top: 0;">
<div class="detailSectionHeader" style="margin-top: 0;"> Details
Details </div>
</div> <div class="detailSectionContent" style="padding: 0 1em;">
<div class="detailSectionContent" style="padding: 0 1em;">
<div id="mediaInfoContent"></div> <div id="mediaInfoContent"></div>
<p id="players"></p> <p id="players"></p>
<p id="seriesAirTime"></p> <p id="seriesAirTime"></p>
<p id="itemPremiereDate"></p> <p id="itemPremiereDate"></p>
<p id="itemBudget"></p> <p id="itemBudget"></p>
<p id="itemRevenue"></p> <p id="itemRevenue"></p>
<p class="itemStudios"></p> <p class="itemStudios"></p>
<p class="itemExternalLinks"></p> <p class="itemExternalLinks"></p>
<div class="mediaInfo"></div> <div class="mediaInfo"></div>
<p class="itemTags"></p> <p class="itemTags"></p>
</div>
</div> </div>
</div> </div>
<div style="display: inline-block;" class="detailSection"> <div id="childrenCollapsible" class="hide detailSection inlineDetailSection">
<div id="childrenCollapsible" class="hide"> <div class="detailSectionHeader"><span id="childrenTitle"></span></div>
<div class="detailSectionHeader"><span id="childrenTitle"></span></div> <div id="childrenContent" class="detailSectionContent"></div>
<div id="childrenContent" class="detailSectionContent"></div>
</div>
</div> </div>
<div style="display: inline-block;" class="detailSection"> <div id="trailersCollapsible" class="detailSection inlineDetailSection hide">
<div id="trailersCollapsible" style="display: none;"> <div class="detailSectionHeader">
<div class="detailSectionHeader"> Trailers
Trailers
</div>
<div id="trailersContent" class="detailSectionContent"></div>
</div> </div>
<div id="trailersContent" class="detailSectionContent"></div>
</div> </div>
<div style="display: inline-block;" class="detailSection"> <div id="specialsCollapsible" class="detailSection inlineDetailSection hide">
<div id="specialsCollapsible" style="display: none;"> <div class="detailSectionHeader">
<div class="detailSectionHeader"> Special Features
Special Features
</div>
<div id="specialsContent" class="detailSectionContent"></div>
</div> </div>
<div id="specialsContent" class="detailSectionContent"></div>
</div> </div>
<div id="castCollapsible" style="display: none;" class="detailSection"> <div id="castCollapsible" style="display: none;" class="detailSection">
<div class="detailSectionHeader"> <div class="detailSectionHeader">

View File

@ -119,11 +119,11 @@
function setInitialCollapsibleState(page, item, context) { function setInitialCollapsibleState(page, item, context) {
if (item.ChildCount) { if (item.ChildCount) {
$('#childrenCollapsible', page).show(); $('#childrenCollapsible', page).removeClass('hide');
renderChildren(page, item); renderChildren(page, item);
} }
else { else {
$('#childrenCollapsible', page).hide(); $('#childrenCollapsible', page).addClass('hide');
} }
if (LibraryBrowser.shouldDisplayGallery(item)) { if (LibraryBrowser.shouldDisplayGallery(item)) {
$('#galleryCollapsible', page).show(); $('#galleryCollapsible', page).show();
@ -142,15 +142,15 @@
renderScenes(page, item, 6); renderScenes(page, item, 6);
} }
if (!item.LocalTrailerCount || item.LocalTrailerCount == 0) { if (!item.LocalTrailerCount || item.LocalTrailerCount == 0) {
$('#trailersCollapsible', page).hide(); $('#trailersCollapsible', page).addClass('hide');
} else { } else {
$('#trailersCollapsible', page).show(); $('#trailersCollapsible', page).removeClass('hide');
renderTrailers(page, item); renderTrailers(page, item);
} }
if (!item.SpecialFeatureCount || item.SpecialFeatureCount == 0) { if (!item.SpecialFeatureCount || item.SpecialFeatureCount == 0) {
$('#specialsCollapsible', page).hide(); $('#specialsCollapsible', page).addClass('hide');
} else { } else {
$('#specialsCollapsible', page).show(); $('#specialsCollapsible', page).removeClass('hide');
renderSpecials(page, item, 6); renderSpecials(page, item, 6);
} }
if (!item.People || !item.People.length) { if (!item.People || !item.People.length) {
@ -224,9 +224,9 @@
var text = elem.textContent || elem.innerText; var text = elem.textContent || elem.innerText;
if (!text.trim()) { if (!text.trim()) {
detailsSection.hide(); detailsSection.addClass('hide');
} else { } else {
detailsSection.show(); detailsSection.removeClass('hide');
} }
renderSeriesAirTime(page, item, context); renderSeriesAirTime(page, item, context);