mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Merge pull request #1022 from ferferga/fix-mobile-layout

Browse source 
Fix mobile layout for itemdetails
This commit is contained in:
dkanada 2020-04-19 20:21:27 +09:00 • committed by GitHub
commit d4427e8a37
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/assets/css/librarybrowser.css
View file

@ -517,6 +517,13 @@
.itemName { .itemName {
margin: 0.5em 0; margin: 0.5em 0;
font-weight: 600;
}
.nameContainer {
display: flex;
flex-direction: column;
flex-wrap: wrap;
} }
.itemMiscInfo { .itemMiscInfo {
@ -534,7 +541,6 @@
.layout-mobile .itemName, .layout-mobile .itemName,
.layout-mobile .itemMiscInfo, .layout-mobile .itemMiscInfo,
.layout-mobile .mainDetailButtons { .layout-mobile .mainDetailButtons {
display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
text-align: center; text-align: center;
@ -576,7 +582,6 @@
.infoText { .infoText {
white-space: nowrap; white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
text-align: left; text-align: left;
} }

24
src/controllers/itemdetailpage.js
View file

@ -336,7 +336,6 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "userSetti
return html = html.join(" / "); return html = html.join(" / ");
} }
function renderName(item, container, isStatic, context) { function renderName(item, container, isStatic, context) {
var parentRoute; var parentRoute;
var parentNameHtml = []; var parentNameHtml = [];
@ -401,14 +400,25 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "userSetti
} else if (item.Album) { } else if (item.Album) {
parentNameHtml.push(item.Album); parentNameHtml.push(item.Album);
} }
// FIXME: This whole section needs some refactoring, so it becames easier to scale across all form factors. See GH #1022
var html = ""; var html = "";
var tvShowHtml = parentNameHtml[0];
var tvSeasonHtml = parentNameHtml[1];
if (parentNameHtml.length) { if (parentNameHtml.length) {
if (parentNameLast) { if (parentNameLast) {
html = '<h3 class="parentName" style="margin: .25em 0;">' + parentNameHtml.join(" - ") + "</h3>"; // Music
if (layoutManager.mobile) {
html = '<h3 class="parentName" style="margin: .25em 0;">' + parentNameHtml.join("</br>") + "</h3>";
} else { } else {
html = '<h1 class="parentName" style="margin: .1em 0 .25em;">' + parentNameHtml.join(" - ") + "</h1>"; html = '<h3 class="parentName" style="margin: .25em 0;">' + parentNameHtml.join(" - ") + "</h3>";
}
} else {
if (layoutManager.mobile) {
html = '<h1 class="parentName" style="margin: .1em 0 .25em;">' + parentNameHtml.join("</br>") + "</h1>";
} else {
html = '<h1 class="parentName" style="margin: .1em 0 .25em;">' + tvShowHtml + "</h1>";
}
} }
} }
@ -418,13 +428,17 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "userSetti
var offset = parentNameLast ? ".25em" : ".5em"; var offset = parentNameLast ? ".25em" : ".5em";
if (html && !parentNameLast) { if (html && !parentNameLast) {
if (!layoutManager.mobile && tvSeasonHtml) {
html += '<h3 class="itemName infoText" style="margin: .25em 0 .5em;">' + tvSeasonHtml + ' - ' + name + '</h3>';
} else {
html += '<h3 class="itemName infoText" style="margin: .25em 0 .5em;">' + name + '</h3>'; html += '<h3 class="itemName infoText" style="margin: .25em 0 .5em;">' + name + '</h3>';
}
} else { } else {
html = '<h1 class="itemName infoText" style="margin: .1em 0 ' + offset + ';">' + name + "</h1>" + html; html = '<h1 class="itemName infoText" style="margin: .1em 0 ' + offset + ';">' + name + "</h1>" + html;
} }
if (item.OriginalTitle && item.OriginalTitle != item.Name) { if (item.OriginalTitle && item.OriginalTitle != item.Name) {
html += '<h4 class="itemName infoText" style="margin: -' + offset + ' 0 0">' + item.OriginalTitle + '</h4>'; html += '<h4 class="itemName infoText" style="margin: -' + offset + ' 0 0;">' + item.OriginalTitle + '</h4>';
} }
container.innerHTML = html; container.innerHTML = html;