Change info navbar to use bootstrap breadcrumb

This commit is contained in:
Jonathan Wong 2015-09-30 00:00:21 -07:00
commit 721bd606cb
2 changed files with 40 additions and 41 deletions

View file

@ -961,14 +961,24 @@ a:hover .dashboard-recent-media-cover {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
} }
.summary-navbar-list span { .summary-navbar-list .breadcrumb {
display: inline-block; padding: 0;
margin-right: 15px; margin: 0;
background: none;
} }
.summary-navbar-list span a { .summary-navbar-list .breadcrumb > li + li:before {
color: #444;
font-family: FontAwesome;
content: "\f054";
padding: 0 15px;
}
.summary-navbar-list .breadcrumb > .active {
color: #eee;
}
.summary-navbar-list .breadcrumb a {
color: #999; color: #999;
} }
.summary-navbar-list span a:hover { .summary-navbar-list .breadcrumb a:hover {
color: #F9AA03; color: #F9AA03;
} }
.summary-content-title-wrapper { .summary-content-title-wrapper {

View file

@ -67,55 +67,44 @@ DOCUMENTATION :: END
<div class="summary-navbar"> <div class="summary-navbar">
<div class="col-md-12"> <div class="col-md-12">
<div class="summary-navbar-list"> <div class="summary-navbar-list">
<ul class="list-unstyled breadcrumb">
% if data['type'] == 'library': % if data['type'] == 'library':
% if data['library'] == 'movie': % if data['library'] == 'movie':
<span><a href="#">Movies</a></span> <li class="active">Movies</li>
% elif data['library'] == 'show': % elif data['library'] == 'show':
<span><a href="#">TV Shows</a></span> <li class="active">TV Shows</li>
% elif data['library'] == 'artist': % elif data['library'] == 'artist':
<span><a href="#">Music</a></span> <li class="active">Music</li>
% endif % endif
% elif data['type'] == 'movie': % elif data['type'] == 'movie':
<span><a href="info?item_id=movie">Movies</a></span> <li><a href="info?item_id=movie">Movies</a></li>
<span><i class="fa fa-chevron-right"></i></span> <li class="active">${data['title']}</li>
<span><a href="#">${data['title']}</a></span>
% elif data['type'] == 'show': % elif data['type'] == 'show':
<span><a href="info?item_id=show">TV Shows</a></span> <li><a href="info?item_id=show">TV Shows</a></li>
<span><i class="fa fa-chevron-right"></i></span> <li class="active">${data['title']}</li>
<span><a href="#">${data['title']}</a></span>
% elif data['type'] == 'season': % elif data['type'] == 'season':
<span class="hidden-xs hidden-sm"><a href="info?item_id=show">TV Shows</a></span> <li class="hidden-xs hidden-sm"><a href="info?item_id=show">TV Shows</a></li>
<span class="hidden-xs hidden-sm"><i class="fa fa-chevron-right"></i></span> <li><a href="info?item_id=${data['parent_rating_key']}">${data['parent_title']}</a></li>
<span><a href="info?item_id=${data['parent_rating_key']}">${data['parent_title']}</a></span> <li class="active">Season ${data['index']}</li>
<span><i class="fa fa-chevron-right"></i></span>
<span><a href="#">Season ${data['index']}</a></span>
% elif data['type'] == 'episode': % elif data['type'] == 'episode':
<span class="hidden-xs hidden-sm"><a href="info?item_id=show">TV Shows</a></span> <li class="hidden-xs hidden-sm"><a href="info?item_id=show">TV Shows</a></li>
<span class="hidden-xs hidden-sm"><i class="fa fa-chevron-right"></i></span> <li class="hidden-xs hidden-sm"><a href="info?item_id=${data['grandparent_rating_key']}">${data['grandparent_title']}</a></li>
<span class="hidden-xs hidden-sm"><a href="info?item_id=${data['grandparent_rating_key']}">${data['grandparent_title']}</a></span> <li><a href="info?item_id=${data['parent_rating_key']}">Season ${data['parent_index']}</a></li>
<span class="hidden-xs hidden-sm"><i class="fa fa-chevron-right"></i></span> <li class="active">Episode ${data['index']} - ${data['title']}</li>
<span><a href="info?item_id=${data['parent_rating_key']}">Season ${data['parent_index']}</a></span>
<span><i class="fa fa-chevron-right"></i></span>
<span><a href="#">Episode ${data['index']} - ${data['title']}</a></span>
% elif data['type'] == 'artist': % elif data['type'] == 'artist':
<span><a href="info?item_id=artist">Music</a></span> <li><a href="info?item_id=artist">Music</a></li>
<span><i class="fa fa-chevron-right"></i></span> <li class="active">${data['title']}</li>
<span><a href="#">${data['title']}</a></span>
% elif data['type'] == 'album': % elif data['type'] == 'album':
<span class="hidden-xs hidden-sm"><a href="info?item_id=artist">Music</a></span> <li class="hidden-xs hidden-sm"><a href="info?item_id=artist">Music</a></li>
<span class="hidden-xs hidden-sm"><i class="fa fa-chevron-right"></i></span> <li><a href="info?item_id=${data['parent_rating_key']}">${data['parent_title']}</a></li>
<span><a href="info?item_id=${data['parent_rating_key']}">${data['parent_title']}</a></span> <li class="active">${data['title']}</li>
<span><i class="fa fa-chevron-right"></i></span>
<span><a href="#">${data['title']}</a></span>
% elif data['type'] == 'track': % elif data['type'] == 'track':
<span class="hidden-xs hidden-sm"><a href="info?item_id=artist">Music</a></span> <li class="hidden-xs hidden-sm"><a href="info?item_id=artist">Music</a></li>
<span class="hidden-xs hidden-sm"><i class="fa fa-chevron-right"></i></span> <li class="hidden-xs hidden-sm"><a href="info?item_id=${data['grandparent_rating_key']}">${data['grandparent_title']}</a></li>
<span class="hidden-xs hidden-sm"><a href="info?item_id=${data['grandparent_rating_key']}">${data['grandparent_title']}</a></span> <li><a href="info?item_id=${data['parent_rating_key']}">${data['parent_title']}</a></li>
<span class="hidden-xs hidden-sm"><i class="fa fa-chevron-right"></i></span> <li class="active">Track ${data['index']} - ${data['title']}</li>
<span><a href="info?item_id=${data['parent_rating_key']}">${data['parent_title']}</a></span>
<span><i class="fa fa-chevron-right"></i></span>
<span><a href="#">Track ${data['index']} - ${data['title']}</a></span>
% endif % endif
</ul>
</div> </div>
</div> </div>
</div> </div>