mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fixes #238 - MBServer Client Theme Background
This commit is contained in:
Luke Pulverenti
parent
443299c687
commit
d9cf304d0f
37 changed files with 824 additions and 722 deletions
|
|
@ -11,7 +11,6 @@
|
|||
text-align: left;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.stretchedDetailTable {
|
||||
|
|
@ -46,11 +45,6 @@
|
|||
background: #555;
|
||||
}
|
||||
|
||||
.detailTable .imgUserItemRating {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.userDataCell {
|
||||
width: 130px;
|
||||
text-align: right;
|
||||
|
|
|
|||
|
|
@ -6,14 +6,13 @@
|
|||
.viewMenuBar {
|
||||
background: #444;
|
||||
background-image: linear-gradient(#444,#2d2d2d);
|
||||
border-bottom: 1px solid #444;
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.viewMenuLink {
|
||||
text-decoration: none;
|
||||
color: #bbb;
|
||||
color: #ccc;
|
||||
padding: 7px .9em 6px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
|
|
@ -82,15 +81,45 @@
|
|||
|
||||
.libraryViewNav {
|
||||
text-align: center;
|
||||
background-image: linear-gradient(#444,#2d2d2d);
|
||||
border-bottom: 1px solid #111;
|
||||
border-top: 1px solid #111;
|
||||
}
|
||||
|
||||
.libraryViewNav .ui-btn-inner {
|
||||
padding: .6em 5px;
|
||||
.libraryViewNav .ui-btn-active {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.libraryViewNav a {
|
||||
display: inline-block;
|
||||
padding: .5em .25em;
|
||||
color: #eee!important;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.libraryViewNav a:hover {
|
||||
color: #bbb!important;
|
||||
}
|
||||
|
||||
.ehsContent {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.ehsContent td {
|
||||
padding: 0;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
.detailPageContent {
|
||||
margin: 0 auto;
|
||||
width: 90%;
|
||||
padding: 0;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.viewSettings {
|
||||
|
|
@ -111,12 +140,6 @@
|
|||
display: none;
|
||||
}
|
||||
|
||||
|
||||
.detailPageContent .ui-collapsible-content {
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.galleryImageContainer {
|
||||
display: inline-block;
|
||||
margin: 5px;
|
||||
|
|
@ -140,6 +163,7 @@
|
|||
height: 17px;
|
||||
display: inline-block;
|
||||
background-size: cover;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.halfStarRating {
|
||||
|
|
@ -158,6 +182,7 @@
|
|||
background-size: cover;
|
||||
background-position: left center;
|
||||
background-repeat: no-repeat;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.fresh {
|
||||
|
|
@ -173,32 +198,46 @@
|
|||
vertical-align: top;
|
||||
margin-left: 5px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.criticRatingSummary {
|
||||
padding: 5px;
|
||||
font-size: 13px;
|
||||
background: #2489ce;
|
||||
margin-top: 1em;
|
||||
background-color: #FFE482!important;
|
||||
color: #000!important;
|
||||
}
|
||||
|
||||
.criticRatingSummaryHeader {
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 5px;
|
||||
display: block;
|
||||
.criticRatingScore {
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
margin: .5em 0;
|
||||
}
|
||||
|
||||
.itemTag {
|
||||
display: inline-block;
|
||||
background-color: #999;
|
||||
background-color: #555;
|
||||
border-radius: 4px;
|
||||
padding: 3px 5px;
|
||||
padding: 5px 7px;
|
||||
font-size: 13px;
|
||||
margin: 0 5px 5px 0;
|
||||
color: #fff!important;
|
||||
text-decoration: none;
|
||||
font-weight: normal!important;
|
||||
}
|
||||
|
||||
a.itemTag:hover {
|
||||
background-color: #2489ce;
|
||||
}
|
||||
|
||||
.itemLinks {
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.itemLinks p {
|
||||
margin: .5em 0;
|
||||
}
|
||||
|
||||
.criticReview {
|
||||
font-size: 14px;
|
||||
margin: 1.5em 0;
|
||||
background: #222;
|
||||
padding: .8em .8em .8em 55px;
|
||||
|
|
@ -233,6 +272,126 @@
|
|||
left: .8em;
|
||||
}
|
||||
|
||||
.itemBackdrop {
|
||||
background-size: cover;
|
||||
background-position: center 15%;
|
||||
background-repeat: no-repeat;
|
||||
height: 540px;
|
||||
border-bottom: 1px solid #111;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.itemBackdropContent {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
font-size: 13px;
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
}
|
||||
|
||||
.noBackdrop {
|
||||
height: 280px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.noBackdrop .itemBackdropContent {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.itemBackdropContent {
|
||||
height: 230px;
|
||||
}
|
||||
|
||||
.itemBackdropContent p:not(.itemOverview) {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.itemDetailImage {
|
||||
height: 240px;
|
||||
-moz-box-shadow: 0px 0 20px #000;
|
||||
-webkit-box-shadow: 0px 0 20px #000;
|
||||
box-shadow: 0px 0 20px #000;
|
||||
border: solid 1px #222;
|
||||
margin-top: -30px;
|
||||
}
|
||||
|
||||
.parentName {
|
||||
padding: .5em;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.parentName a {
|
||||
color: #000!important;
|
||||
}
|
||||
|
||||
.itemName {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.itemName + .itemMiscInfo {
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.itemOverview {
|
||||
max-height: 80px;
|
||||
overflow-y: auto;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.libraryPage ::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.libraryPage ::-webkit-scrollbar-button:start:decrement,
|
||||
.libraryPage ::-webkit-scrollbar-button:end:increment {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.libraryPage ::-webkit-scrollbar-track-piece {
|
||||
background-color: #3b3b3b;
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
|
||||
.libraryPage ::-webkit-scrollbar-thumb:vertical {
|
||||
-webkit-border-radius: 6px;
|
||||
background: #666 no-repeat center;
|
||||
}
|
||||
|
||||
.detailSectionHeader {
|
||||
padding: .5em 1em;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
border: 1px solid #181818;
|
||||
background: #222;
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
.detailSectionContent {
|
||||
}
|
||||
|
||||
@media all and (max-width: 750px) {
|
||||
|
||||
.itemBackdrop {
|
||||
background-image: none!important;
|
||||
height: 510px;
|
||||
}
|
||||
|
||||
.itemImageContainer {
|
||||
position: absolute;
|
||||
top: -230px;
|
||||
margin: 0 auto 0 -20px;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.noBackdrop {
|
||||
height: 510px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 750px) {
|
||||
|
||||
|
|
@ -247,6 +406,17 @@
|
|||
.viewMenuImageLink {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.libraryViewNav a {
|
||||
padding: .5em 1em;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1000px) {
|
||||
|
||||
.itemBackdrop {
|
||||
background-size: 100% auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1200px) {
|
||||
|
|
@ -275,27 +445,21 @@
|
|||
}
|
||||
|
||||
@media all and (min-width: 750px) {
|
||||
.libraryViewNav .ui-btn-inner {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.detailPageContent .ui-collapsible-content {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
.detailPageContent {
|
||||
max-width: 900px;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1000px) {
|
||||
.detailPageContent {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
max-width: 1200px;
|
||||
}
|
||||
|
||||
.ehsContent {
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.detailPageContent {
|
||||
max-width: 900px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1200px) {
|
||||
|
|
@ -303,17 +467,25 @@
|
|||
.ehsContent {
|
||||
max-width: 940px;
|
||||
}
|
||||
|
||||
.detailPageContent {
|
||||
max-width: 1000px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1440px) {
|
||||
|
||||
.detailPageContent {
|
||||
width: 1200px;
|
||||
}
|
||||
|
||||
.ehsContent {
|
||||
max-width: 1070px;
|
||||
}
|
||||
|
||||
.detailPageContent {
|
||||
max-width: 1170px;
|
||||
}
|
||||
|
||||
.primaryDetailPageContent {
|
||||
max-width: 1100px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1920px) {
|
||||
|
|
@ -328,18 +500,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.playFlyout a {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.detailPageName {
|
||||
margin: 0 0 .1em;
|
||||
}
|
||||
|
||||
.detailPageName + .detailPageName {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.detailPageParentLink {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -350,20 +510,13 @@
|
|||
|
||||
.itemMiscInfo {
|
||||
color: #ddd;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.detailPageName .itemMiscInfo {
|
||||
margin-left: 1.5em;
|
||||
font-family: Arial;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.itemMediaInfo {
|
||||
font-size: 14px;
|
||||
padding-left: .5em;
|
||||
}
|
||||
|
||||
.mediaInfoStream {
|
||||
|
|
@ -408,20 +561,11 @@
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
.detailPagePrimaryInfo {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.scenePosterViewItem img {
|
||||
max-width: 150px!important;
|
||||
}
|
||||
|
||||
@media all and (min-width: 650px) {
|
||||
.detailPagePrimaryInfo {
|
||||
padding: 0 10px;
|
||||
margin-top: 1.5em;
|
||||
}
|
||||
|
||||
.libraryTabs .ui-btn-inner {
|
||||
padding: .5em 15px!important;
|
||||
}
|
||||
|
|
@ -450,7 +594,7 @@
|
|||
height: 14px;
|
||||
border: 1px solid #666;
|
||||
border-radius: 0;
|
||||
width: 100px;
|
||||
width: 50px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@
|
|||
text-shadow: none;
|
||||
font-weight: normal!important;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
color: #fff!important;
|
||||
text-decoration: none;
|
||||
|
|
|
|||
|
|
@ -57,7 +57,6 @@
|
|||
position: absolute;
|
||||
z-index: 999;
|
||||
margin-top: 1px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.searchHintsContent {
|
||||
|
|
|
|||
|
|
@ -32,6 +32,7 @@
|
|||
|
||||
body {
|
||||
overflow-y: scroll!important;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.textlink {
|
||||
|
|
@ -401,10 +402,6 @@ form, .readOnlyContent {
|
|||
top: 6px;
|
||||
}
|
||||
|
||||
#divVirtualFolders .ui-btn-inner, .mediaLocationsHeader, #divVirtualFolders .ui-btn-text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#ulDirectoryPickerList a {
|
||||
padding-top: .4em;
|
||||
padding-bottom: .4em;
|
||||
|
|
@ -419,7 +416,6 @@ form, .readOnlyContent {
|
|||
display: inline-block;
|
||||
margin: 5px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
padding-bottom: 28px;
|
||||
|
|
@ -669,96 +665,18 @@ progress {
|
|||
|
||||
/* Detail Page*/
|
||||
|
||||
.itemDetailImage {
|
||||
max-width: 100%;
|
||||
max-height: 400px;
|
||||
}
|
||||
|
||||
.itemImageBlock {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.itemDetailBlock {
|
||||
vertical-align: top;
|
||||
padding-top: 1em;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.imgUserItemRating {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
height: 17px;
|
||||
width: 17px;
|
||||
margin-right: 1em;
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.imgUserItemRating:hover {
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
@media all and (min-width: 650px) {
|
||||
.itemImageBlock {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.itemDetailImage {
|
||||
max-width: 220px;
|
||||
}
|
||||
|
||||
.itemDetailBlock {
|
||||
padding-top: 0;
|
||||
display: inline-block;
|
||||
width: 57%;
|
||||
padding-left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 750px) {
|
||||
|
||||
.itemDetailImage {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.itemDetailBlock {
|
||||
width: 52%;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1000px) {
|
||||
|
||||
.itemDetailBlock {
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1440px) {
|
||||
|
||||
.itemDetailImage {
|
||||
max-width: 350px;
|
||||
}
|
||||
|
||||
.itemDetailBlock {
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1700px) {
|
||||
|
||||
.itemDetailImage {
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.itemDetailBlock {
|
||||
width: 61%;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width: 1920px) {
|
||||
|
||||
.itemDetailBlock {
|
||||
width: 63%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Now playing bar */
|
||||
#nowPlayingBar {
|
||||
padding: 8px 20px;
|
||||
|
|
|
|||
|
|
@ -5,15 +5,9 @@
|
|||
text-shadow: none;
|
||||
font-weight: normal!important;
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
.tileItem .itemProgress {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.tileItem .starRating {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
|
|
@ -45,11 +39,6 @@
|
|||
margin: .5em 0 0;
|
||||
}
|
||||
|
||||
.tileItem .imgUserItemRating {
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
}
|
||||
|
||||
.tileContent {
|
||||
display: inline-block;
|
||||
padding-left: 10px;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue