diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css
index dc3eda9261..a9dd5809b2 100644
--- a/dashboard-ui/css/librarybrowser.css
+++ b/dashboard-ui/css/librarybrowser.css
@@ -141,6 +141,14 @@
display: block;
}
+.itemTag {
+ display: inline-block;
+ background-color: #999;
+ border-radius: 4px;
+ padding: 3px 5px;
+ font-size: 13px;
+ margin: 0 5px 0 0;
+}
@media all and (min-width: 750px) {
diff --git a/dashboard-ui/itemdetails.html b/dashboard-ui/itemdetails.html
index 7ef32d9651..96b7f14a07 100644
--- a/dashboard-ui/itemdetails.html
+++ b/dashboard-ui/itemdetails.html
@@ -133,7 +133,7 @@
-
+
diff --git a/dashboard-ui/scripts/Itemdetailpage.js b/dashboard-ui/scripts/Itemdetailpage.js
index d00ee9ffe6..6e15c042a7 100644
--- a/dashboard-ui/scripts/Itemdetailpage.js
+++ b/dashboard-ui/scripts/Itemdetailpage.js
@@ -225,7 +225,7 @@
LibraryBrowser.renderStudios($('#itemStudios', page), item, context);
renderUserDataIcons(page, item);
LibraryBrowser.renderLinks($('#itemLinks', page), item);
-
+
if (item.CriticRatingSummary) {
$('#criticRatingSummary', page).show();
$('#criticRatingSummaryText', page).html(item.CriticRatingSummary);
@@ -233,6 +233,27 @@
} else {
$('#criticRatingSummary', page).hide();
}
+
+ renderTags(page, item);
+ }
+
+ function renderTags(page, item) {
+
+ if (item.Tags && item.Tags.length) {
+
+ var html = '';
+
+ for (var i = 0, length = item.Tags.length; i < length; i++) {
+
+ html += '
' + item.Tags[i] + '
';
+
+ }
+
+ $('#itemTags', page).show().html(html);
+
+ } else {
+ $('#itemTags', page).hide();
+ }
}
function renderChildren(page, item) {