diff --git a/src/assets/css/librarybrowser.scss b/src/assets/css/librarybrowser.scss index dba4937931..a6464e2b33 100644 --- a/src/assets/css/librarybrowser.scss +++ b/src/assets/css/librarybrowser.scss @@ -32,6 +32,39 @@ } } +@mixin header-poster-padding-rtl() { + padding-left: unset; + padding-right: 37.5%; + + @media all and (min-width: 43.75em) { + padding-right: 25%; + } + + @media all and (min-width: 50em) { + padding-right: 20%; + } + + @media all and (min-width: 75em) { + padding-right: 16.666666666666666666666666666667%; + } + + @media all and (min-width: 87.5em) { + padding-right: 14.285714285714285714285714285714%; + } + + @media all and (min-width: 100em) { + padding-right: 12.5%; + } + + @media all and (min-width: 120em) { + padding-right: 11.111111111111111111111111111111%; + } + + @media all and (min-width: 131.25em) { + padding-right: 10%; + } +} + .headerUserImage, .navMenuOption, .pageTitle { @@ -622,9 +655,9 @@ .layout-mobile .itemName, .layout-mobile .itemMiscInfo, .layout-mobile .mainDetailButtons { - align-items: center; - justify-content: center; - text-align: center; + align-items: center !important; + justify-content: center !important; + text-align: center !important; } .layout-mobile .mainDetailButtons { @@ -641,6 +674,8 @@ } [dir="rtl"] & { + @include header-poster-padding-rtl; + @media all and (max-width: 32em) { padding-left: unset; padding-right: 0; @@ -714,6 +749,12 @@ position: relative; } } + + [dir="rtl"] & { + .layout-mobile & { + @include header-poster-padding-rtl; + } + } } .infoText { diff --git a/src/components/alphaPicker/style.scss b/src/components/alphaPicker/style.scss index 8feb3e50e0..b033891c9f 100644 --- a/src/components/alphaPicker/style.scss +++ b/src/components/alphaPicker/style.scss @@ -107,7 +107,7 @@ } .alphaPicker-fixed-right { - right: 0.4em; + inset-inline-end: 0.4em; } @media all and (min-width: 62.5em) { @@ -116,6 +116,15 @@ } } +[dir="rtl"] { + @media all and (min-width: 62.5em) { + .alphaPicker-fixed-right { + right: unset; + left: 1em; + } + } +} + @media all and (max-height: 31.25em) { .alphaPicker-fixed { display: none !important; diff --git a/src/components/listview/listview.js b/src/components/listview/listview.js index ee75656367..ad0cbccba8 100644 --- a/src/components/listview/listview.js +++ b/src/components/listview/listview.js @@ -149,7 +149,7 @@ import ServerConnections from '../ServerConnections'; elem.classList.add('listItemBodyText'); - elem.innerText = text; + elem.innerHTML = '' + text + ''; html += elem.outerHTML; } @@ -422,7 +422,7 @@ import ServerConnections from '../ServerConnections'; if (enableOverview && item.Overview) { html += '
'; - html += item.Overview; + html += '' + item.Overview + ''; html += '
'; } diff --git a/src/controllers/itemDetails/index.js b/src/controllers/itemDetails/index.js index 43cfce9e39..1022f8c127 100644 --- a/src/controllers/itemDetails/index.js +++ b/src/controllers/itemDetails/index.js @@ -473,7 +473,7 @@ function renderName(item, container, context) { html = '

' + parentNameHtml.join(' - ') + '

'; } } else { - html = '

' + tvShowHtml + '

'; + html = '

' + tvShowHtml + '

'; } } @@ -483,21 +483,21 @@ function renderName(item, container, context) { if (html && !parentNameLast) { if (tvSeasonHtml) { - html += '

' + tvSeasonHtml + ' - ' + name + '

'; + html += '

' + tvSeasonHtml + ' - ' + name + '

'; } else { html += '

' + name + '

'; } } else if (item.OriginalTitle && item.OriginalTitle != item.Name) { html = '

' + name + '

' + html; } else { - html = '

' + name + '

' + html; + html = '

' + name + '

' + html; } if (item.OriginalTitle && item.OriginalTitle != item.Name) { html += '

' + escapeHtml(item.OriginalTitle) + '

'; } - container.innerHTML = '' + html + ''; + container.innerHTML = html; if (html.length) { container.classList.remove('hide');