Good art is a taste, good design is an opinion.


Come as guest, stay as family.
Board Index

Come as guest, stay as family.


You are not connected. Please login or register

Foto

[Javascript] IPB thread moderation panel



View previous topic View next topic Go down Message [Page 1 of 1]

1
Offline

  Guest

avatar
Guest


Tutorial: Moderate your thread

This tutorial will give you the same look of IPB moderation threads.

Credit goes to: @Deamon


--> Tutorials, tips and tricks <--
Moderate your thread



- Javascript
Placement: In topics
Code:
[panda=js]    $(function(){
    var level = _userdata["user_level"];
    var del = $('.main-foot a[href*="mode=delete"]').attr('href');
    var trash = $('.main-foot a[href*="mode=trash"]').attr('href');
    var move = $('.main-foot a[href*="mode=move"]').attr('href');
    var lockunlock = $('.main-foot a[href*="mode=lock"]').attr('href');
    var split = $('.main-foot a[href*="mode=split"]').attr('href');
    var merge = $('.main-foot a[href*="merge"]').attr('href');

    if(level === 1 | level === 2 | trash) {
      $('.paged-head').after('<div id="moderation_tool" class="act_mod"><p class="mod" title="Moderate topic">Moderate topic</p></div>');
    $('#moderation_tool').append('<div id="popw" class="action_mod">
    <div class="mod_hover"></div>
    <div class="popwinner">
    <li><a href="'+del+'">Delete topic</a></li>
    <li><a href="'+trash+'">Trash this topic</a></li>
    <li><a href="'+move+'">Move this topic</a></li>
    <li><a href="'+lockunlock+'">Lock / Unlock topic</a></li>
    <li><a href="'+split+'">Split this topic</a></li>
    <li><a href="'+merge+'">Merge topic</a></li>
    </div></div>');
    $('.mod').click(function(){
      $('.action_mod').slideToggle(300);
    });
    }
    });


- CSS
Code:
[panda=css]#moderation_tool {
margin:0 0 8px;
}

#moderation_tool.act_mod p {
-moz-border-radius:3px;
-moz-box-shadow:0 1px 0 rgba(255,255,255,1) inset,0 1px 0 rgba(0,0,0,0.3);
-moz-transition:all .2s ease-in-out;
-webkit-border-radius:3px;
-webkit-box-shadow:0 1px 0 rgba(255,255,255,1) inset,0 1px 0 rgba(0,0,0,0.3);
-webkit-transition:all .2s ease-in-out;
cursor:pointer;
webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
background:0;
background-image:0;
border:1px solid #D9DBDD;
border-radius:3px;
box-shadow:0 1px 0 rgba(255,255,255,1) inset,0 1px 0 rgba(0,0,0,0.3);
color:#616161;
display:inline-block;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f8fa',endColorstr='#edeeef',GradientType=0);
font-size:12px;
height:22px;
line-height:22px;
white-space:nowrap;
padding:0 10px;
}

#popw {
background-color:rgba(70,70,70,0.6);
-webkit-box-shadow:0 8px 15px rgba(0,0,0,0.7);
-moz-box-shadow:0 8px 15px rgba(0,0,0,0.7);
box-shadow:0 8px 15px rgba(0,0,0,0.7);
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
display:none;
z-index:999;
margin-top:16px;
position:absolute;
padding:4px;
}

#popw .mod_hover {
background-image:url(http://i38.servimg.com/u/f38/18/24/85/15/bottom10.png);
width:31px;
height:16px;
top:-16px;
left:5px;
z-index:999;
position:absolute;
}

#popw .popwinner {
background:#fff;
max-height:465px;
width:190px;
overflow:auto;
-webkit-box-shadow:0 0 3px rgba(0,0,0,0.4);
-moz-box-shadow:0 0 3px rgba(0,0,0,0.4);
box-shadow:0 0 3px rgba(0,0,0,0.4);
overflow-x:hidden;
}

#popw .popwinner li {
background:#f8f8f8;
list-style-type:none;
border-bottom:1px solid #eaeaea;
text-align:center;
padding:3px 4px;
}

#popw .popwinner li a {
color:#333!important;
}


- Preview





© PunBB Design


If you have any questions related to this topic create a topic with the following title:
Moderate your thread

Powered by PunBB
Currently 0 users have thanked Guest for this post:

View previous topic View next topic Back to top Message [Page 1 of 1]


Topic URL's

URL
BBcode
HTML

Permissions in this forum:
You cannot reply to topics in this forum