xoops forums

xd9527

Just popping in
Posted on: 6/26 16:05
xd9527
xd9527 (Show more)
Just popping in
Posts: 8
Since: 2016/1/13
#1

hack newbb rate & quickreply to facebook UI style

Resized Image

newbb topic rate is less useful features
I think it is a problem with the UI
so i try hack it to facebook style

result
Resized Image

Quote:
xoops : 2.5.9
module : newbb 4.34 Final
template : newbb_viewtopic.tpl
css framework: Bootstrap3
icon : Font Awesome 4.7.0



<!-- only for login user //-->
<{if $viewer_level gt 0}>

<!-- 
modal for rate //-->
<div class="modal fade bs-example-modal-sm container" id="replyrate" tabindex="-1" role="dialog" aria-labelledby="replyrate">
<
div class="modal-dialog btn-bottom" role="document">
<
div class="modal-content btn-group" role="group">
<
button type="button" class="btn btn-default" onclick="location.href='/modules/<{$xoops_dirname}>/ratethread.php?topic_id=<{$topic_id}>&amp;forum=<{$forum_id}>&amp;rate=5';"><class="fa fa-thumbs-o-up fa-2x" aria-hidden="true"></i><br><{$smarty.const._MD_RATE5}></button>
<
button type="button" class="btn btn-default" onclick="location.href='/modules/<{$xoops_dirname}>/ratethread.php?topic_id=<{$topic_id}>&amp;forum=<{$forum_id}>&amp;rate=4';"><class="fa fa-smile-o fa-2x" aria-hidden="true"></i><br><{$smarty.const._MD_RATE4}></button>
<
button type="button" class="btn btn-default" onclick="location.href='/modules/<{$xoops_dirname}>/ratethread.php?topic_id=<{$topic_id}>&amp;forum=<{$forum_id}>&amp;rate=3';"><class="fa fa-meh-o fa-2x" aria-hidden="true"></i><br><{$smarty.const._MD_RATE3}></button>
<
button type="button" class="btn btn-default" onclick="location.href='/modules/<{$xoops_dirname}>/ratethread.php?topic_id=<{$topic_id}>&amp;forum=<{$forum_id}>&amp;rate=2';"><class="fa fa-frown-o fa-2x" aria-hidden="true"></i><br><{$smarty.const._MD_RATE2}></button>
<
button type="button" class="btn btn-default" onclick="location.href='/modules/<{$xoops_dirname}>/ratethread.php?topic_id=<{$topic_id}>&amp;forum=<{$forum_id}>&amp;rate=1';"><class="fa fa-thumbs-o-down fa-2x" aria-hidden="true"></i><br><{$smarty.const._MD_RATE1}></button>
</
div>
</
div>
</
div>

<!-- 
modal for quickreply //-->
<div class="modal fade bs-example-modal-sm container" id="replyquick" tabindex="-1" role="dialog" aria-labelledby="replyquick">
<
div class="modal-dialog btn-bottom" role="document">
<
div class="modal-content modal-body"><button type="button btn-default" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<{
$quickreply.form}>
</
div>
</
div>
</
div>

<!-- 
fix bottom navbar //-->
<div class="navbar-fixed-bottom container" id="postnav" style="bottom:12px;">

<!-- 
rate button //-->
<{if $rating_enable}>
<
class="btn btn-default btn-lg" style="box-shadow: 0 0 15px 0 grey" data-toggle="modal" data-target="#replyrate"><class="fa fa-thumbs-o-up" aria-hidden="true"></i><{$smarty.const.THEME_LIKE}></a>&nbsp;
<{/if}>

<!-- 
reply button //-->
<{if $quickreply.show}>
<
class="btn btn-default btn-lg" style="box-shadow: 0 0 15px 0 grey" data-toggle="modal" data-target="#replyquick"><class="fa fa-comment-o" aria-hidden="true"></i><{$smarty.const.THEME_FORUM_REPLY}></a>&nbsp;
<{/if}>

​​​​​​​<!-- modal-dialog move to bottom //-->
<style>.btn-bottom {positionabsolute;bottom:48px;z-index:9999;} </style>

<!-- 
scroll hide bottom navbar //-->
<script>
$(
window).scroll(function(){
var 
scrollBottom = $("body").height()-$(window).height()-60;
if (
scrollBottom 120 )
{
if ($(
this).scrollTop() > 60 && $(this).scrollTop() < scrollBottom)
{ $(
'#postnav').fadeIn(); }
else {  $(
'#postnav').fadeOut(); }
}
else
{
$(
'#postnav').fadeIn();
}
});
</
script>
</
div>
<{/if}>


done.

my blog https://3q.9527.tw/125

heyula

Theme Designer
Posted on: 6/26 16:09
heyula
heyula (Show more)
Theme Designer
Posts: 467
Since: 2008/4/24
#2

Re: hack newbb rate & quickreply to facebook style

thanks for sharing.

Mamba

Moderator
Posted on: 6/29 4:48
Mamba
Mamba (Show more)
Moderator
Posts: 10770
Since: 2004/4/23
#3

Re: hack newbb rate & quickreply to facebook style

Very cool!! Thanks for sharing.

We'll need to look into adding it to Newbb 5.0
Support XOOPS => DONATE
Use 2.5.10 | Docs | Modules | Bugs

Mamba

Moderator
Posted on: 6/30 8:34
Mamba
Mamba (Show more)
Moderator
Posts: 10770
Since: 2004/4/23
#4

Re: hack newbb rate & quickreply to facebook style

OK, I've added it to NewBB 5.01 at:
https://github.com/mambax7/newbb

You'll need to copy the theme files from:
/newbb/EXTRA/xbootstrap/

to /themes/xbootstrap

You'll also need to set the Facebook UI Style in Preferences.

Please test and let me know if it works.
Support XOOPS => DONATE
Use 2.5.10 | Docs | Modules | Bugs