son whitespace conflicts are so 1765
Baris Usakli
12 years ago
commit
64a9e5844d
@ -1,109 +1,146 @@
|
||||
@import "mixins";
|
||||
|
||||
.entry-row {
|
||||
border-radius: 10px;
|
||||
margin-bottom: 10px;
|
||||
padding: 10px;
|
||||
cursor: move;
|
||||
width: 800px;
|
||||
}
|
||||
.admin-categories {
|
||||
form {
|
||||
margin: 0 0 0px;
|
||||
.admin {
|
||||
.entry-row {
|
||||
border-radius: 10px;
|
||||
margin-bottom: 10px;
|
||||
padding: 10px;
|
||||
cursor: move;
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
input {
|
||||
height: 20px;
|
||||
padding: 5px;
|
||||
margin-left: 10px;
|
||||
width: 150px;
|
||||
border: 0;
|
||||
border-radius: 5px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
input.description {
|
||||
width: 400px;
|
||||
.admin-categories {
|
||||
form {
|
||||
margin: 0 0 0px;
|
||||
}
|
||||
}
|
||||
|
||||
select {
|
||||
border: 0;
|
||||
margin-left: 10px;
|
||||
padding: 5px;
|
||||
margin-top: -8px;
|
||||
.entry-row {
|
||||
border-radius: 10px;
|
||||
margin-bottom: 10px;
|
||||
padding: 10px;
|
||||
cursor: move;
|
||||
width: 555px;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-top: -7px;
|
||||
input.description {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.icon{
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
line-height: 35px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.themes {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
padding: 10px 16px;
|
||||
margin: 0.25em 1em;
|
||||
list-style-type: none;
|
||||
.pointer;
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
-webkit-transition: background-color 250ms linear;
|
||||
-moz-transition: background-color 250ms linear;
|
||||
-ms-transition: background-color 250ms linear;
|
||||
-o-transition: background-color 250ms linear;
|
||||
transition: background-color 250ms linear;
|
||||
|
||||
img {
|
||||
max-width: 150px;
|
||||
float: left;
|
||||
.admin-categories {
|
||||
form {
|
||||
margin: 0 0 0px;
|
||||
}
|
||||
|
||||
input {
|
||||
height: 20px;
|
||||
padding: 5px;
|
||||
margin-left: 10px;
|
||||
width: 150px;
|
||||
border: 0;
|
||||
border-radius: 5px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
h4, p {
|
||||
margin-left: 170px;
|
||||
select {
|
||||
border: 0;
|
||||
margin-left: 10px;
|
||||
padding: 5px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.9em;
|
||||
button {
|
||||
margin-top: -7px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(128, 128, 128, 0.2);
|
||||
.icon{
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
line-height: 35px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.motd textarea {
|
||||
width: 100%;
|
||||
}
|
||||
.themes {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
padding: 10px 16px;
|
||||
margin: 0.25em 1em;
|
||||
list-style-type: none;
|
||||
.pointer;
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
-webkit-transition: background-color 250ms linear;
|
||||
-moz-transition: background-color 250ms linear;
|
||||
-ms-transition: background-color 250ms linear;
|
||||
-o-transition: background-color 250ms linear;
|
||||
transition: background-color 250ms linear;
|
||||
|
||||
img {
|
||||
max-width: 150px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
h4, p {
|
||||
margin-left: 170px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.icon-container {
|
||||
.row {
|
||||
&:hover {
|
||||
background-color: rgba(128, 128, 128, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.motd textarea {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.topics {
|
||||
margin: 0;
|
||||
.span3 {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 1px;
|
||||
cursor: pointer;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
|
||||
> li {
|
||||
.zebra;
|
||||
list-style-type: none;
|
||||
padding: 1em;
|
||||
margin-bottom: 1em;
|
||||
|
||||
&:hover, &.selected {
|
||||
background: black;
|
||||
color: white;
|
||||
ul {
|
||||
margin: 0.5em 0;
|
||||
|
||||
li {
|
||||
list-style-type: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icon-container {
|
||||
.row {
|
||||
margin: 0;
|
||||
.span3 {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 1px;
|
||||
cursor: pointer;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
|
||||
&:hover, &.selected {
|
||||
background: black;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,84 @@
|
||||
$(document).ready(function() {
|
||||
var topicsListEl = document.querySelector('.topics');
|
||||
|
||||
$(topicsListEl).on('click', '[data-action]', function() {
|
||||
var $this = $(this),
|
||||
action = this.getAttribute('data-action'),
|
||||
tid = $this.parents('[data-tid]').attr('data-tid');
|
||||
|
||||
switch(action) {
|
||||
case 'pin':
|
||||
if (!$this.hasClass('active')) socket.emit('api:topic.pin', { tid: tid });
|
||||
else socket.emit('api:topic.unpin', { tid: tid });
|
||||
break;
|
||||
case 'lock':
|
||||
if (!$this.hasClass('active')) socket.emit('api:topic.lock', { tid: tid });
|
||||
else socket.emit('api:topic.unlock', { tid: tid });
|
||||
break;
|
||||
case 'delete':
|
||||
if (!$this.hasClass('active')) socket.emit('api:topic.delete', { tid: tid });
|
||||
else socket.emit('api:topic.restore', { tid: tid });
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
// Resolve proper button state for all topics
|
||||
var topicEls = topicsListEl.querySelectorAll('li'),
|
||||
numTopics = topicEls.length;
|
||||
for(var x=0;x<numTopics;x++) {
|
||||
if (topicEls[x].getAttribute('data-pinned')) topicEls[x].querySelector('[data-action="pin"]').className += ' active';
|
||||
if (topicEls[x].getAttribute('data-locked')) topicEls[x].querySelector('[data-action="lock"]').className += ' active';
|
||||
if (topicEls[x].getAttribute('data-deleted')) topicEls[x].querySelector('[data-action="delete"]').className += ' active';
|
||||
topicEls[x].removeAttribute('data-pinned');
|
||||
topicEls[x].removeAttribute('data-locked');
|
||||
topicEls[x].removeAttribute('data-deleted');
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('api:topic.pin', function(response) {
|
||||
if (response.status === 'ok') {
|
||||
var btnEl = document.querySelector('li[data-tid="' + response.tid + '"] button[data-action="pin"]');
|
||||
|
||||
$(btnEl).addClass('active');
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('api:topic.unpin', function(response) {
|
||||
if (response.status === 'ok') {
|
||||
var btnEl = document.querySelector('li[data-tid="' + response.tid + '"] button[data-action="pin"]');
|
||||
|
||||
$(btnEl).removeClass('active');
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('api:topic.lock', function(response) {
|
||||
if (response.status === 'ok') {
|
||||
var btnEl = document.querySelector('li[data-tid="' + response.tid + '"] button[data-action="lock"]');
|
||||
|
||||
$(btnEl).addClass('active');
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('api:topic.unlock', function(response) {
|
||||
if (response.status === 'ok') {
|
||||
var btnEl = document.querySelector('li[data-tid="' + response.tid + '"] button[data-action="lock"]');
|
||||
|
||||
$(btnEl).removeClass('active');
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('api:topic.delete', function(response) {
|
||||
if (response.status === 'ok') {
|
||||
var btnEl = document.querySelector('li[data-tid="' + response.tid + '"] button[data-action="delete"]');
|
||||
|
||||
$(btnEl).addClass('active');
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('api:topic.restore', function(response) {
|
||||
if (response.status === 'ok') {
|
||||
var btnEl = document.querySelector('li[data-tid="' + response.tid + '"] button[data-action="delete"]');
|
||||
|
||||
$(btnEl).removeClass('active');
|
||||
}
|
||||
});
|
||||
@ -1,55 +1,22 @@
|
||||
<h1>Topics</h1>
|
||||
<hr />
|
||||
|
||||
<ul class="nav nav-pills">
|
||||
<li class='active'><a href='/admin/topics'>All</a></li>
|
||||
<li class=''><a href='/admin/topics/latest'>Latest</a></li>
|
||||
<li class=''><a href='/admin/topics/active'>Active</a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
<ul class="topic-container">
|
||||
<!-- BEGIN topics -->
|
||||
<a href="../../topic/{topics.slug}"><li class="topic-row">
|
||||
<div class="row" style="margin: 0">
|
||||
<div class="span1 topic-row-icon">
|
||||
<i class="icon-lock icon-4x"></i>
|
||||
<i class="{topics.pin-icon}"></i><i class="{topics.lock-icon}"></i>
|
||||
<ul class="topics">
|
||||
<!-- BEGIN topics -->
|
||||
<li data-tid="{topics.tid}" data-locked="{topics.locked}" data-pinned="{topics.pinned}" data-deleted="{topics.deleted}">
|
||||
<div class="btn-group pull-right">
|
||||
<button data-action="pin" class="btn"><i class="icon-pushpin"></i></button>
|
||||
<button data-action="lock" class="btn"><i class="icon-lock"></i></button>
|
||||
<button data-action="delete" class="btn"><i class="icon-trash"></i></button>
|
||||
</div>
|
||||
<div class="span11 topic-row-content">
|
||||
<div class="top-posters">
|
||||
<img src="http://www.gravatar.com/avatar/fd37ce111f863c6665045c2d72d199bf?s=60&default=identicon" class="img-polaroid" />
|
||||
<img src="http://www.gravatar.com/avatar/07c9c7170c3ac676c2561e3eeaee063c?s=60&default=identicon" class="img-polaroid" />
|
||||
<img src="http://www.gravatar.com/avatar/91050ce0072697b53380c6a03a1bc12a?s=60&default=identicon" class="img-polaroid" />
|
||||
</div>
|
||||
<div>
|
||||
<h3><span class="badge badge-important">3</span> {topics.title} <small>24<i class="icon-star"></i></small></h3>
|
||||
<p> Posted {topics.relativeTime} ago by
|
||||
<span class="username">{topics.username}</span>. {topics.post_count} posts.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li></a>
|
||||
<!-- END topics -->
|
||||
<a target="_blank" href="../../topic/{topics.slug}">{topics.title}</a>
|
||||
<ul>
|
||||
<li><i class="icon-time"></i> Posted {topics.relativeTime} ago by {topics.username}</li>
|
||||
<li><i class="icon-comments"></i> {topics.post_count} post(s)</li>
|
||||
</ul>
|
||||
<div class="clear"></div>
|
||||
</li>
|
||||
<!-- END topics -->
|
||||
</ul>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
//DRY Failure. this needs to go into an ajaxify onready style fn. Currently is copy pasted into every single function so after ACP is off the ground fix asap
|
||||
(function() {
|
||||
jQuery('document').ready(function() {
|
||||
var url = window.location.href,
|
||||
parts = url.split('/'),
|
||||
active = parts[parts.length-1];
|
||||
|
||||
jQuery('.nav-pills li').removeClass('active');
|
||||
jQuery('.nav-pills li a').each(function() {
|
||||
if (this.getAttribute('href').match(active)) {
|
||||
jQuery(this.parentNode).addClass('active');
|
||||
return false;
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
}());
|
||||
</script>
|
||||
<script type="text/javascript" src="../../src/forum/admin/topics.js"></script>
|
||||
Loading…
Reference in New Issue