hyperzlib
/
nodebb-theme-persona
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

WIP user-icons

Browse Source
main
Julian Lam 10 years ago
parent 49517de3cf
commit eefad3dad7
16 changed files with 88 additions and 22 deletions
Show Stats Download Patch File Download Diff File

2
less/account.less
Unescape Escape View File

@ -33,6 +33,8 @@
width:128px;
height:128px;
border-radius: 50%;
line-height: 128px;
font-size: 7.5rem;
}
.user-picture-label {

5
less/categories.less
Unescape Escape View File

@ -21,10 +21,13 @@
margin-top: 2px;
}
img {
img, .user-icon {
margin-right: 15px;
width: 46px;
height: 46px;
line-height: 46px;
font-size: 2.4rem;
border-radius: 50%;
}
h2 {

6
less/category.less
Unescape Escape View File

@ -42,11 +42,11 @@
}
}
.user-img {
.user-img, .user-icon {
opacity: 1;
}
.fa-check, .user-img {
.fa-check, .user-img, .user-icon {
.transition(.2s ease-in-out opacity);
}
@ -55,7 +55,7 @@
}
&.selected {
.user-img {
.user-img, .user-icon {
opacity: 0;
}

7
less/groups.less
Unescape Escape View File

@ -26,9 +26,10 @@
list-style-type: none;
display: inline-block;
img {
img, .user-icon {
width: 32px;
height: 32px;
line-height: 32px;
}
}
@ -133,8 +134,10 @@
}
[component="groups/members"], [component="groups/pending"], [component="groups/invited"] {
img {
img, .user-icon {
width: 32px;
height: 32px;
line-height: 32px;
}
.member-name {

4
less/header.less
Unescape Escape View File

@ -127,11 +127,13 @@
#user_dropdown {
padding: 10px 15px;
img {
img, .user-icon {
width: 30px;
height: 30px;
border-radius: 50%;
border: 0px none;
font-size: 1.8rem;
line-height: 30px;
span {
font-size: 14px;

2
less/posts_list.less
Unescape Escape View File

@ -10,6 +10,8 @@
height: 24px;
float: left;
border-radius: 50%;
line-height: 24px;
font-size: 1.5rem;
}
a {

19
less/topic.less
Unescape Escape View File

@ -40,11 +40,13 @@
min-height: 46px;
margin-top: 2px;
img {
img, .user-icon {
margin-right: 15px;
width: 46px;
height: 46px;
border-radius: 50%;
font-size: 2.4rem;
line-height: 46px;
}
}
@ -190,9 +192,11 @@
min-height: 0;
margin-top: 5px;
img {
img, .user-icon {
width: 23px;
height: 23px;
font-size: 1.3rem;
line-height: 23px;
}
}
}
@ -308,13 +312,14 @@
a[data-uid] {
position: relative;
margin-left: 14px;
img {
img, .user-icon {
border-radius: 50%;
width: 20px;
height: 20px;
vertical-align: middle;
line-height: 20px;
margin: 0 7px;
}
&::after {
@ -325,15 +330,15 @@
font-family: "FontAwesome";
content: "\f11c";
padding: 4px 0.25em;
top: 0px;
left: 0px;
top: -36px;
left: 7px;
.transition(~"opacity ease 250ms, top ease 250ms")
}
&.replying::after {
opacity: 1;
top: -24px;
top: -50px;
.animation(topic-reply-pulse 2s ease-in infinite);
}
}

4
less/users.less
Unescape Escape View File

@ -43,10 +43,12 @@
vertical-align: top;
width: 104px;
img {
img, .user-icon {
width:80px;
height:80px;
border-radius: 50%;
line-height: 80px;
font-size: 4rem;
}
a {

4
templates/account/profile.tpl
Unescape Escape View File

@ -8,7 +8,11 @@
<div class="account-picture-block panel panel-default">
<div class="panel-body">
<div class="text-center">
<!-- IF picture -->
<img src="{picture}" class="user-profile-picture" />
<!-- ELSE -->
<div class="user-icon user-profile-picture" style="background-color: {icon:bgColor};" title="{username}">{icon:text}</div>
<!-- ENDIF picture -->
</div>
<div>

16
templates/groups/details.tpl
Unescape Escape View File

@ -41,7 +41,11 @@
<!-- BEGIN members -->
<tr data-uid="{group.members.uid}">
<td>
<!-- IF group.members.picture -->
<a href="{config.relative_path}/user/{group.members.userslug}"><img src="{group.members.picture}" /></a>
<!-- ELSE -->
<div class="user-icon" style="background-color: {group.members.icon:bgColor};">{group.members.icon:text}</div>
<!-- ENDIF group.members.picture -->
</td>
<td class="member-name">
<a href="{config.relative_path}/user/{group.members.userslug}">{group.members.username}</a> <i title="[[groups:owner]]" class="fa fa-star text-warning <!-- IF !group.members.isOwner -->invisible<!-- ENDIF !group.members.isOwner -->"></i>
@ -98,7 +102,11 @@
<!-- BEGIN pending -->
<tr data-uid="{group.pending.uid}">
<td>
<a href="{config.relative_path}/user/{group.pending.userslug}"><img src="{group.pending.picture}" /></a>
<!-- IF group.members.picture -->
<a href="{config.relative_path}/user/{group.members.userslug}"><img src="{group.members.picture}" /></a>
<!-- ELSE -->
<div class="user-icon" style="background-color: {group.members.icon:bgColor};">{group.members.icon:text}</div>
<!-- ENDIF group.members.picture -->
</td>
<td class="member-name">
<a href="{config.relative_path}/user/{group.pending.userslug}">{group.pending.username}</a>
@ -134,7 +142,11 @@
<!-- BEGIN invited -->
<tr data-uid="{group.invited.uid}">
<td>
<a href="{config.relative_path}/user/{group.invited.userslug}"><img src="{group.invited.picture}" /></a>
<!-- IF group.members.picture -->
<a href="{config.relative_path}/user/{group.members.userslug}"><img src="{group.members.picture}" /></a>
<!-- ELSE -->
<div class="user-icon" style="background-color: {group.members.icon:bgColor};">{group.members.icon:text}</div>
<!-- ENDIF group.members.picture -->
</td>
<td class="member-name">
<a href="{config.relative_path}/user/{group.invited.userslug}">{group.invited.username}</a>

6
templates/partials/groups/list.tpl
Unescape Escape View File

@ -9,7 +9,11 @@
<!-- BEGIN members -->
<li>
<a href="{config.relative_path}/user/{groups.members.userslug}">
<img src="{groups.members.picture}" title="{groups.members.userslug}" />
<!-- IF groups.members.picture -->
<img src="{groups.members.picture}" title="{groups.members.username}" />
<!-- ELSE -->
<div class="user-icon" style="background-color: {groups.members.icon:bgColor};" title="{groups.members.username}">{groups.members.icon:text}</div>
<!-- ENDIF groups.members.picture -->
</a>
</li>
<!-- END members -->

7
templates/partials/menu.tpl
Unescape Escape View File

@ -27,7 +27,12 @@
<ul id="logged-in-menu" class="nav navbar-nav navbar-right">
<li id="user_label" class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="user_dropdown" title="[[global:header.profile]]">
<img component="header/userpicture" src="{user.picture}" alt="{user.username}" /> <span id="user-header-name" class="visible-xs-inline">{user.username}</span>
<!-- IF user.picture -->
<img component="header/userpicture" src="{user.picture}" alt="{user.username}" />
<!-- ELSE -->
<div component="header/usericon" class="user-icon" style="background-color: {user.icon:bgColor};">{user.icon:text}</div>
<!-- ENDIF user.picture -->
<span id="user-header-name" class="visible-xs-inline">{user.username}</span>
</a>
<ul id="user-control-list" component="header/usercontrol" class="dropdown-menu" aria-labelledby="user_dropdown">
<li>

4
templates/partials/posts_list.tpl
Unescape Escape View File

@ -6,7 +6,11 @@
<div class="panel panel-default">
<div class="panel-body">
<a href="{config.relative_path}/user/{posts.user.userslug}">
<!-- IF posts.user.picture -->
<img title="{posts.user.username}" class="img-rounded user-img" src="{posts.user.picture}">
<!-- ELSE -->
<div class="user-icon user-img" style="background-color: {posts.user.icon:bgColor};" title="{posts.user.username}">{posts.user.icon:text}</div>
<!-- ENDIF posts.user.picture -->
</a>
<a href="{config.relative_path}/user/{posts.user.userslug}">

4
templates/partials/topic/post.tpl
Unescape Escape View File

@ -1,7 +1,11 @@
<div class="clearfix">
<div class="icon pull-left">
<a href="<!-- IF posts.user.userslug -->{config.relative_path}/user/{posts.user.userslug}<!-- ELSE -->#<!-- ENDIF posts.user.userslug -->">
<!-- IF posts.user.picture -->
<img src="{posts.user.picture}" align="left" itemprop="image" />
<!-- ELSE -->
<div class="user-icon" style="background-color: {posts.user.icon:bgColor};">{posts.user.icon:text}</div>
<!-- ENDIF posts.user.picture -->
<!-- IF posts.user.banned -->
<span class="label label-danger">[[user:banned]]</span>
<!-- ENDIF posts.user.banned -->

12
templates/partials/topics_list.tpl
Unescape Escape View File

@ -8,12 +8,20 @@
<div class="avatar pull-left">
<!-- IF showSelect -->
<div class="select fa-square-o">
<img src="<!-- IF topics.thumb -->{topics.thumb}<!-- ELSE -->{topics.user.picture}<!-- ENDIF topics.thumb -->" class="img-circle user-img" />
<!-- IF topics.user.picture -->
{function.renderTopicImage}
<!-- ELSE -->
<div class="user-icon" style="background-color: {topics.user.icon:bgColor};" title="{topics.user.username}">{topics.user.icon:text}</div>
<!-- ENDIF topics.user.picture -->
<i class="fa fa-check"></i>
</div>
<!-- ELSE -->
<a href="{config.relative_path}/user/{topics.user.userslug}" class="pull-left">
<img src="<!-- IF topics.thumb -->{topics.thumb}<!-- ELSE -->{topics.user.picture}<!-- ENDIF topics.thumb -->" class="img-circle user-img" title="{topics.user.username}"/>
<!-- IF topics.user.picture -->
{function.renderTopicImage}
<!-- ELSE -->
<div class="user-icon" style="background-color: {topics.user.icon:bgColor};" title="{topics.user.username}">{topics.user.icon:text}</div>
<!-- ENDIF topics.user.picture -->
</a>
<!-- ENDIF showSelect -->
</div>

8
templates/partials/users_list.tpl
Unescape Escape View File

@ -1,6 +1,12 @@
<!-- BEGIN users -->
<li class="users-box registered-user" data-uid="{users.uid}">
<a href="{config.relative_path}/user/{users.userslug}"><img src="{users.picture}" /></a>
<a href="{config.relative_path}/user/{users.userslug}">
<!-- IF users.picture -->
<img src="{users.picture}" />
<!-- ELSE -->
<div class="user-icon" style="background-color: {users.icon:bgColor};">{users.icon:text}</div>
<!-- ENDIF users.picture -->
</a>
<br/>
<div class="user-info">
<span>

Write Preview
Loading…
Cancel
Save