github/plexpy
1
0
Fork 0
mirror of https://github.com/Tautulli/Tautulli.git synced 2025-07-13 08:42:59 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update user images

Browse source
This commit is contained in:
Jonathan Wong 2015-08-23 23:25:55 -07:00
parent 77f5224e13
commit 79757da2b1
3 changed files with 37 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

37
data/interfaces/default/css/plexpy.css
View file

@ -431,6 +431,19 @@ input[type="color"],
-moz-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); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
} }
.users-poster-face {
overflow: hidden;
float: left;
background-size: contain;
height: 40px;
width: 40px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
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);
}
.users-poster-face img { .users-poster-face img {
bottom: 0; bottom: 0;
overflow: hidden; overflow: hidden;
@ -1127,6 +1140,16 @@ input[type="color"],
.user-info-poster-face { .user-info-poster-face {
float: left; float: left;
margin-top: 15px; margin-top: 15px;
margin-right: 15px;
background-size: contain;
height: 80px;
width: 80px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
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);
} }
.user-info-poster-face img { .user-info-poster-face img {
bottom: 0; bottom: 0;
@ -1249,9 +1272,9 @@ input[type="color"],
float: left; float: left;
width: 75px; width: 75px;
border-radius: 3px; border-radius: 3px;
-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5); 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 5px rgba(0,0,0,0.5); -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 5px rgba(0,0,0,0.5); box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1);
background-size: contain; background-size: contain;
position: relative; position: relative;
height: 80px; height: 80px;
@ -1308,7 +1331,12 @@ input[type="color"],
bottom: 35px; bottom: 35px;
height: 80px; height: 80px;
width: 80px; width: 80px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; border-radius: 3px;
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-oval { .home-platforms-instance-oval {
background-size: contain; background-size: contain;
@ -1320,6 +1348,9 @@ input[type="color"],
-webkit-border-radius: 50%; -webkit-border-radius: 50%;
-moz-border-radius: 50%; -moz-border-radius: 50%;
border-radius: 50%; border-radius: 50%;
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-name { .home-platforms-instance-name {
float: left; float: left;

5
data/interfaces/default/js/tables/users.js
View file

@ -36,15 +36,14 @@ users_list_table_options = {
"data": "user_thumb", "data": "user_thumb",
"createdCell": function (td, cellData, rowData, row, col) { "createdCell": function (td, cellData, rowData, row, col) {
if (cellData === '') { if (cellData === '') {
$(td).html('<img src="interfaces/default/images/gravatar-default-80x80.png" alt="User Logo"/>'); $(td).html('<div class="users-poster-face" style="background-image: url(interfaces/default/images/gravatar-default-80x80.png);"></div>');
} else { } else {
$(td).html('<img src="' + cellData + '" alt="User Logo"/>'); $(td).html('<div class="users-poster-face" style="background-image: url(' + cellData + ');"></div>');
} }
}, },
"orderable": false, "orderable": false,
"searchable": false, "searchable": false,
"width": "5%", "width": "5%",
"className": "users-poster-face"
}, },
{ {
"targets": [2], "targets": [2],

3
data/interfaces/default/user.html
View file

@ -40,8 +40,7 @@ from plexpy import helpers
<div class="col-md-12"> <div class="col-md-12">
<div class="table-card-back"> <div class="table-card-back">
<div class="user-info-wrapper"> <div class="user-info-wrapper">
<div class="user-info-poster-face" id="user-gravatar"> <div class="user-info-poster-face" id="user-gravatar" style="background-image: url(${data['thumb']});">
<img id="user-profile-thumb" src="${data['thumb']}" height="80px" width="80px">
</div> </div>
<div class="user-info-username"> <div class="user-info-username">
<span class="set-username">${data['friendly_name']}</span> <span id="edit-user-tooltip" data-target="tooltip" title="Edit user details"><a href="#" data-toggle="modal" data-target="#edit-user-modal" id="toggle-edit-user-modal"><i class="fa fa-pencil"></i></a></span> <span class="set-username">${data['friendly_name']}</span> <span id="edit-user-tooltip" data-target="tooltip" title="Edit user details"><a href="#" data-toggle="modal" data-target="#edit-user-modal" id="toggle-edit-user-modal"><i class="fa fa-pencil"></i></a></span>