Square cover for music home stats

This commit is contained in:
JonnyWong16 2016-09-17 14:39:58 -07:00
parent a4be73da3b
commit 0478f40d02
2 changed files with 57 additions and 25 deletions

View file

@ -1929,6 +1929,12 @@ a .library-user-instance-box:hover {
position: absolute;
overflow: hidden;
}
.home-platforms-instance-cover {
margin-left: 0px;
position: absolute;
top: 20px;
overflow: hidden;
}
.home-platforms-instance-poster .home-platforms-poster-face {
background-position: center;
background-size: cover;
@ -1938,6 +1944,15 @@ a .library-user-instance-box:hover {
-moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
}
.home-platforms-instance-cover .home-platforms-cover-face {
background-position: center;
background-size: cover;
height: 80px;
width: 80px;
-webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
-moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
}
.home-platforms-instance-poster .home-platforms-library-thumb {
background-position: center;
background-size: cover;
@ -2087,6 +2102,12 @@ a .library-user-instance-box:hover {
left: 20px;
overflow: hidden;
}
.home-platforms-instance-list-cover {
position: absolute;
top: 10px;
left: 20px;
overflow: hidden;
}
.home-platforms-instance-list-poster .home-platforms-list-poster-face {
background-position: center;
background-size: cover;
@ -2096,6 +2117,15 @@ a .library-user-instance-box:hover {
-moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
}
.home-platforms-instance-list-cover .home-platforms-list-cover-face {
background-position: center;
background-size: cover;
height: 40px;
width: 40px;
-webkit-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
-moz-box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
}
.home-platforms-instance-list-box {
background-position: center;
background-size: cover;
@ -2154,7 +2184,9 @@ a .home-platforms-instance-oval:hover,
a .home-platforms-instance-list-box:hover,
a .home-platforms-instance-list-oval:hover,
a .home-platforms-poster-face:hover,
a .home-platforms-list-poster-face:hover
a .home-platforms-cover-face:hover,
a .home-platforms-list-poster-face:hover,
a .home-platforms-list-cover-face:hover
{
-webkit-box-shadow: inset 0 0 0 2px #e9a049;
-moz-box-shadow: inset 0 0 0 2px #e9a049;

View file

@ -509,21 +509,21 @@ DOCUMENTATION :: END
% if top_stat['rows'][0]['rating_key']:
<a href="info?rating_key=${top_stat['rows'][0]['rating_key']}" title="${top_stat['rows'][0]['title']}">
% if top_stat['rows'][0]['grandparent_thumb']:
<div class="home-platforms-instance-poster">
<div class="home-platforms-poster-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][0]['grandparent_thumb']}&width=300&height=300&fallback=poster);"></div>
<div class="home-platforms-instance-cover">
<div class="home-platforms-cover-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][0]['grandparent_thumb']}&width=300&height=300&fallback=cover);"></div>
% if _session['user_group'] == 'admin':
<span class="overlay-refresh-image" title="Refresh image"><i class="fa fa-refresh refresh_pms_image"></i></span>
% endif
</div>
% else:
<div class="home-platforms-instance-poster">
<div class="home-platforms-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-cover">
<div class="home-platforms-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
</a>
% else:
<div class="home-platforms-instance-poster">
<div class="home-platforms-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-cover">
<div class="home-platforms-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
% if len(top_stat['rows']) > 1:
@ -558,21 +558,21 @@ DOCUMENTATION :: END
% if top_stat['rows'][loop.index]['rating_key']:
<a href="info?rating_key=${top_stat['rows'][loop.index]['rating_key']}" title="${top_stat['rows'][loop.index]['title']}">
% if top_stat['rows'][loop.index]['grandparent_thumb']:
<div class="home-platforms-instance-list-poster">
<div class="home-platforms-list-poster-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][loop.index]['grandparent_thumb']}&width=300&height=300&fallback=poster);"></div>
<div class="home-platforms-instance-list-cover">
<div class="home-platforms-list-cover-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][loop.index]['grandparent_thumb']}&width=300&height=300&fallback=cover);"></div>
% if _session['user_group'] == 'admin':
<span class="overlay-refresh-image" title="Refresh image"><i class="fa fa-refresh refresh_pms_image"></i></span>
% endif
</div>
% else:
<div class="home-platforms-instance-list-poster">
<div class="home-platforms-list-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-list-cover">
<div class="home-platforms-list-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
</a>
% else:
<div class="home-platforms-instance-list-poster">
<div class="home-platforms-list-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-list-cover">
<div class="home-platforms-list-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
<div class="home-platforms-instance-list-number">
@ -611,21 +611,21 @@ DOCUMENTATION :: END
% if top_stat['rows'][0]['rating_key']:
<a href="info?rating_key=${top_stat['rows'][0]['rating_key']}" title="${top_stat['rows'][0]['title']}">
% if top_stat['rows'][0]['grandparent_thumb'] != '':
<div class="home-platforms-instance-poster">
<div class="home-platforms-poster-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][0]['grandparent_thumb']}&width=300&height=300&fallback=poster);"></div>
<div class="home-platforms-instance-cover">
<div class="home-platforms-cover-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][0]['grandparent_thumb']}&width=300&height=300&fallback=cover);"></div>
% if _session['user_group'] == 'admin':
<span class="overlay-refresh-image" title="Refresh image"><i class="fa fa-refresh refresh_pms_image"></i></span>
% endif
</div>
% else:
<div class="home-platforms-instance-poster">
<div class="home-platforms-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-cover">
<div class="home-platforms-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
</a>
% else:
<div class="home-platforms-instance-poster">
<div class="home-platforms-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-cover">
<div class="home-platforms-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
% if len(top_stat['rows']) > 1:
@ -656,21 +656,21 @@ DOCUMENTATION :: END
% if top_stat['rows'][loop.index]['rating_key']:
<a href="info?rating_key=${top_stat['rows'][loop.index]['rating_key']}" title="${top_stat['rows'][loop.index]['title']}">
% if top_stat['rows'][loop.index]['grandparent_thumb']:
<div class="home-platforms-instance-list-poster">
<div class="home-platforms-list-poster-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][loop.index]['grandparent_thumb']}&width=300&height=300&fallback=poster);"></div>
<div class="home-platforms-instance-list-cover">
<div class="home-platforms-list-cover-face" style="background-image: url(pms_image_proxy?img=${top_stat['rows'][loop.index]['grandparent_thumb']}&width=300&height=300&fallback=cover);"></div>
% if _session['user_group'] == 'admin':
<span class="overlay-refresh-image" title="Refresh image"><i class="fa fa-refresh refresh_pms_image"></i></span>
% endif
</div>
% else:
<div class="home-platforms-instance-list-poster">
<div class="home-platforms-list-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-list-cover">
<div class="home-platforms-list-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
</a>
% else:
<div class="home-platforms-instance-list-poster">
<div class="home-platforms-list-poster-face" style="background-image: url(${http_root}images/poster.png);"></div>
<div class="home-platforms-instance-list-cover">
<div class="home-platforms-list-cover-face" style="background-image: url(${http_root}images/cover.png);"></div>
</div>
% endif
<div class="home-platforms-instance-list-number">