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

serious clean up of topic.less

Browse Source
v1.18.x
psychobunny 12 years ago
parent ac4803961a
commit 19be3bc55c
4 changed files with 185 additions and 213 deletions
Show Stats Download Patch File Download Diff File

10
public/src/forum/topic.js
Unescape Escape View File

@ -611,7 +611,7 @@
var postAuthorImage, postAuthorInfo, pagination;
var postAuthorImage, mobileAuthorOverlay, pagination;
var postcount = templates.get('postcount');
function updateHeader() {
@ -624,9 +624,9 @@
});
}
jQuery('.mobile-author-info').css('bottom', '0px');
jQuery('.mobile-author-overlay').css('bottom', '0px');
postAuthorImage = postAuthorImage || document.getElementById('mobile-author-image');
postAuthorInfo = postAuthorInfo || document.getElementById('mobile-author-info');
mobileAuthorOverlay = mobileAuthorOverlay || document.getElementById('mobile-author-overlay');
pagination = pagination || document.getElementById('pagination');
pagination.parentNode.style.display = 'block';
@ -637,7 +637,7 @@
if (scrollTop < 50 && postcount > 1) {
postAuthorImage.src = (jQuery('.main-avatar img').attr('src'));
postAuthorInfo.innerHTML = 'Posted by ' + jQuery('.main-post').attr('data-username') + ', ' + jQuery('.main-post').find('.relativeTimeAgo').html();
mobileAuthorOverlay.innerHTML = 'Posted by ' + jQuery('.main-post').attr('data-username') + ', ' + jQuery('.main-post').find('.relativeTimeAgo').html();
pagination.innerHTML = '0 out of ' + postcount;
return;
}
@ -662,7 +662,7 @@
if (inView) {
pagination.innerHTML = this.postnumber + ' out of ' + postcount;
postAuthorImage.src = (jQuery(this).find('.profile-image-block img').attr('src'));
postAuthorInfo.innerHTML = 'Posted by ' + jQuery(this).attr('data-username') + ', ' + jQuery(this).find('.relativeTimeAgo').html();
mobileAuthorOverlay.innerHTML = 'Posted by ' + jQuery(this).attr('data-username') + ', ' + jQuery(this).find('.relativeTimeAgo').html();
}
});

132
public/templates/topic.tpl
Unescape Escape View File

@ -18,44 +18,41 @@
<li class="row post-row main-post" data-pid="{main_posts.pid}" data-uid="{main_posts.uid}" data-username="{main_posts.username}" data-deleted="{main_posts.deleted}">
<div class="col-md-12">
<div class="post-block">
<div class="main-post-buttons">
<a class="main-avatar" href="/users/{main_posts.userslug}">
<img src="{main_posts.picture}" align="left" class="img-thumbnail" width=150 height=150 /><br />
</a>
<h3>
<p id="topic_title_{main_posts.pid}" class="topic-title">{topic_name}</p>
</h3>
<div class="topic-buttons" >
<div class="btn-group">
<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" type="button" title="Posted by {main_posts.username}">
<span class="username-field" href="/users/{main_posts.userslug}">{main_posts.username}&nbsp;</span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="/users/{main_posts.userslug}"><i class="icon-user"></i> Profile</a></li>
<li><div class="chat"><i class="icon-comment"></i> Chat</div></li>
</ul>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-default follow" type="button" title="Be notified of new replies in this topic"><i class="icon-eye-open"></i></button>
<button class="favourite btn btn-sm btn-default {main_posts.fav_button_class}" type="button">
<span class="favourite-text">Favourite</span>
<span class="post_rep_{main_posts.pid}">{main_posts.post_rep} </span><i class="{main_posts.fav_star_class}"></i>
</button>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-default quote" type="button" title="Quote"><i class="icon-quote-left"></i></button>
<button class="btn btn-sm btn-primary btn post_reply" type="button">Reply <i class="icon-reply"></i></button>
</div>
<div class="btn-group pull-right post-tools">
<button class="btn btn-sm btn-default edit {main_posts.display_moderator_tools}" type="button" title="Edit"><i class="icon-pencil"></i></button>
<button class="btn btn-sm btn-default delete {main_posts.display_moderator_tools}" type="button" title="Delete"><i class="icon-trash"></i></button>
</div>
<a class="avatar" href="/users/{main_posts.userslug}">
<img src="{main_posts.picture}" align="left" class="img-thumbnail" width=150 height=150 /><br />
</a>
<h3>
<p id="topic_title_{main_posts.pid}" class="topic-title">{topic_name}</p>
</h3>
<div class="topic-buttons">
<div class="btn-group">
<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" type="button" title="Posted by {main_posts.username}">
<span class="username-field" href="/users/{main_posts.userslug}">{main_posts.username}&nbsp;</span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="/users/{main_posts.userslug}"><i class="icon-user"></i> Profile</a></li>
<li><div class="chat"><i class="icon-comment"></i> Chat</div></li>
</ul>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-default follow" type="button" title="Be notified of new replies in this topic"><i class="icon-eye-open"></i></button>
<button class="favourite btn btn-sm btn-default {main_posts.fav_button_class}" type="button">
<span class="favourite-text">Favourite</span>
<span class="post_rep_{main_posts.pid}">{main_posts.post_rep} </span><i class="{main_posts.fav_star_class}"></i>
</button>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-default quote" type="button" title="Quote"><i class="icon-quote-left"></i></button>
<button class="btn btn-sm btn-primary btn post_reply" type="button">Reply <i class="icon-reply"></i></button>
</div>
<div class="btn-group pull-right post-tools">
<button class="btn btn-sm btn-default edit {main_posts.display_moderator_tools}" type="button" title="Edit"><i class="icon-pencil"></i></button>
<button class="btn btn-sm btn-default delete {main_posts.display_moderator_tools}" type="button" title="Delete"><i class="icon-trash"></i></button>
</div>
<div style="clear:both; margin-bottom: 10px;"></div>
</div>
<div id="content_{main_posts.pid}" class="post-content">{main_posts.content}</div>
@ -88,37 +85,34 @@
</div>
<div class="col-md-11">
<div class="post-block">
<div class="post-buttons">
<div class="topic-buttons">
<div class="btn-group">
<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" type="button" title="Posted by {posts.username}">
<span class="username-field" href="/users/{posts.userslug}">{posts.username}&nbsp;</span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="/users/{posts.userslug}"><i class="icon-user"></i> Profile</a></li>
<li><div class="chat"><i class="icon-comment"></i> Chat</div></li>
</ul>
</div>
<div class="btn-group">
<button class="favourite btn btn-sm btn-default {posts.fav_button_class}" type="button">
<span class="favourite-text">Favourite</span>
<span class="post_rep_{posts.pid}">{posts.post_rep} </span><i class="{posts.fav_star_class}"></i>
</button>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-default quote" type="button" title="Quote"><i class="icon-quote-left"></i></button>
<button class="btn btn-sm btn-primary btn post_reply" type="button">Reply <i class="icon-reply"></i></button>
</div>
<div class="btn-group pull-right post-tools">
<button class="btn btn-sm btn-default edit {posts.display_moderator_tools}" type="button" title="Edit"><i class="icon-pencil"></i></button>
<button class="btn btn-sm btn-default delete {posts.display_moderator_tools}" type="button" title="Delete"><i class="icon-trash"></i></button>
</div>
<div class="topic-buttons">
<div class="btn-group">
<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" type="button" title="Posted by {posts.username}">
<span class="username-field" href="/users/{posts.userslug}">{posts.username}&nbsp;</span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="/users/{posts.userslug}"><i class="icon-user"></i> Profile</a></li>
<li><div class="chat"><i class="icon-comment"></i> Chat</div></li>
</ul>
</div>
<div class="btn-group">
<button class="favourite btn btn-sm btn-default {posts.fav_button_class}" type="button">
<span class="favourite-text">Favourite</span>
<span class="post_rep_{posts.pid}">{posts.post_rep} </span><i class="{posts.fav_star_class}"></i>
</button>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-default quote" type="button" title="Quote"><i class="icon-quote-left"></i></button>
<button class="btn btn-sm btn-primary btn post_reply" type="button">Reply <i class="icon-reply"></i></button>
</div>
<div class="btn-group pull-right post-tools">
<button class="btn btn-sm btn-default edit {posts.display_moderator_tools}" type="button" title="Edit"><i class="icon-pencil"></i></button>
<button class="btn btn-sm btn-default delete {posts.display_moderator_tools}" type="button" title="Delete"><i class="icon-trash"></i></button>
</div>
<div style="clear:both; margin-bottom: 7px;"></div>
</div>
<div id="content_{posts.pid}" class="post-content">{posts.content}</div>
@ -162,13 +156,13 @@
</div>
</div>
<div class="mobile-author-info">
<div class="mobile-author-overlay">
<div class="row">
<div class="col-xs-3">
<img id="mobile-author-image" src="" width=50 height=50 />
</div>
<div class="col-xs-9">
<h4><div id="mobile-author-info"></div></h4>
<h4><div id="mobile-author-overlay"></div></h4>
</div>
</div>
</div>

9
public/themes/cerulean/topic.less
Unescape Escape View File

@ -35,6 +35,15 @@
}
}
.profile-block {
background: rgba(0, 0, 0, 0.02);
margin: 15px -11px -11px -11px;
border-radius: 0 0 5px 5px;
font-size: 10px;
line-height: 15px;
padding: 5px 8px 5px 5px;
color: #777;
}
.active-users {
color: rgb(153,153,153);

247
public/themes/vanilla/topic.less
Unescape Escape View File

@ -14,161 +14,135 @@
&.deleted {
-moz-opacity: 0.30;
opacity: 0.30;
height:30px;
overflow-y:hidden;
height: 30px;
overflow-y: hidden;
}
&.deleted-expanded {
height:100%;
overflow-y:default;
height: 100%;
overflow-y: default;
}
}
}
@media (max-width: 767px) {
.topic-main-buttons {
margin-bottom: 0px;
}
}
@media (max-width: 475px) {
.post-tools {
display: none;
}
.favourite-text {
display: none;
}
}
// styling the chat button in the dropdown to match. surely there's a better way...
.chat {
display: block;
padding: 3px 20px;
clear: both;
.pointer;
&:hover, &:focus {
color: white;
background-color: rgb(66, 139, 202);
@media (max-width: 767px) {
.topic-main-buttons {
margin-bottom: 0px;
}
}
.post-signature {
color: #666;
font-size: 12px;
border-top: 1px solid #ddd;
display: inline-block;
.main-post, .sub-posts {
.profile-block, .post-block {
position: relative;
border: 1px solid rgba(0, 0, 0, 0.06);
border-radius: 5px;
padding: 10px;
img {
max-width:200px;
max-height:60px;
}
.post-signature {
color: #666;
font-size: 12px;
border-top: 1px solid #ddd;
display: inline-block;
margin-left: 5px;
}
.profile-block, .post-block {
position: relative;
border: 1px solid rgba(0, 0, 0, 0.06);
border-radius: 5px;
padding: 10px;
img {
max-width: 200px;
max-height: 60px;
}
p {
line-height: 1.75em;
margin-left: 5px;
}
}
}
.profile-block {
background: rgba(0, 0, 0, 0.02);
margin: 15px -11px -11px -11px;
border-radius: 0 0 5px 5px;
font-size: 10px;
line-height: 15px;
padding: 5px 8px 5px 5px;
color: #777;
}
.post-block {
.topic-buttons {
background: rgba(0, 0, 0, 0.02);
border: 1px solid rgba(0, 0, 0, 0.06);
margin: -5px 0 0 0;
padding: 8px 0 0 23px;
.post-block {
.post-buttons {
background: rgba(0, 0, 0, 0.02);
border: 1px solid rgba(0, 0, 0, 0.06);
margin: -5px 0 0 0;
padding: 8px 0 0 23px;
button.show {
display: inline-block !important;
}
button.show {
display: inline-block !important;
@media (max-width: 767px) {
padding-left: 9px;
}
}
@media (max-width: 767px) {
padding-left: 9px;
.post-content {
padding: 10px 5px 0 5px;
word-wrap: break-word;
}
}
}
.post-content {
min-height: 50px;
padding: 10px 5px 0 5px;
word-wrap: break-word;
}
.post-images{
padding: 2px 5px 0 5px;
.post-images{
padding: 2px 5px 0 5px;
}
}
}
.sub-posts {
.post-block {
.post-signature {
margin-left: 15px;
}
.topic-buttons {
margin: -11px -10px 0px -10px;
border: 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
padding: 8px 9px 7px 23px;
}
.sub-posts {
.post-tools {
margin-right: 9px;
}
.post-content {
margin-left: 10px;
}
.post-signature {
margin-left: 15px;
.post-content {
margin-left: 10px;
}
}
.img-thumbnail {
padding: 2px;
border-radius: 0;
margin-left: 16px;
}
.post-buttons {
margin: -11px -10px 0 -10px;
border: 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
}
.main-post {
.main-post-buttons {
h3 {
margin: 0;
.topic-title {
width: auto;
overflow: hidden;
margin: 0 0 -5px 0;
padding: 0 0 5px 0
}
h3 {
margin: 0;
.topic-title {
width: auto;
overflow: hidden;
margin: 0 0 -5px 0;
padding: 0 0 5px 0
}
}
.main-avatar {
color: white;
position: relative;
float: left;
margin: 0 10px 0 0;
padding-bottom: 0px;
text-align: center;
width:100px;
.avatar {
color: white;
position: relative;
float: left;
margin: 0 10px 0 0;
padding-bottom: 0px;
text-align: center;
width: 100px;
@media (max-width: 767px) {
display: none;
}
@media (max-width: 767px) {
display: none;
}
.img-thumbnail {
padding: 2px;
border-radius: 0;
}
.img-thumbnail {
padding: 2px;
border-radius: 0;
}
}
@ -181,44 +155,26 @@
}
.post-block {
.post-buttons {
.topic-buttons {
background: rgba(0, 0, 0, 0.02);
border: 1px solid rgba(0, 0, 0, 0.06);
margin: 0 -11px 0 92px;
padding: 10px;
border-right: 0;
@media (max-width: 767px) {
margin-left: -11px;
border-left: 0;
}
button.show {
display: inline-block!important;
}
}
}
.favourite {
.pointer;
}
.btn {
display: inline-block;
}
.topic-buttons { //main-post version is called post-buttons, needs to be consolidated.
background: rgba(0, 0, 0, 0.02);
border: 1px solid rgba(0, 0, 0, 0.06);
margin: 0 -11px 0 92px;
padding: 10px;
border-right: 0;
@media (max-width: 767px) {
margin-left: -11px;
border-left: 0;
}
button.show {
display: inline-block!important;
}
}
}
.mobile-author-info {
.mobile-author-overlay {
display: none;
z-index: 9999;
@ -248,4 +204,17 @@
font-size: 16px;
}
}
// styling the chat button in the dropdown to match. surely there's a better way...
.chat {
display: block;
padding: 3px 20px;
clear: both;
.pointer;
&:hover, &:focus {
color: white;
background-color: rgb(66, 139, 202);
}
}
}
Write Preview
Loading…
Cancel
Save