some theming for emoji button

This commit is contained in:
Mario Vavti 2016-06-03 11:03:01 +02:00
parent f8949ed5d1
commit 29a0a11b7e
2 changed files with 97 additions and 97 deletions

View file

@ -59,6 +59,10 @@ aside .nav-pills > li > a,
padding: 6px 10px; padding: 6px 10px;
} }
.dropdown-menu {
min-width: auto;
}
.dropdown-menu li a { .dropdown-menu li a {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;

View file

@ -78,7 +78,30 @@
</div> </div>
{{/if}} {{/if}}
<div class="wall-item-tools"> <div class="wall-item-tools">
<div class="wall-item-tools-right btn-group pull-right"> <div class="wall-item-tools-right pull-right">
{{if $item.toplevel && $item.like}}
<div class="btn-group dropdown">
<button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" id="wall-item-react-{{$item.id}}">
<i class="fa fa-smile-o"></i>
</button>
<ul class="dropdown-menu dropdown-menu-left" role="menu" aria-labelledby="wall-item-react-{{$item.id}}">
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f60a'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f60a.png" alt="1f60a" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f44f'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f44f.png" alt="1f44f" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f37e'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f37e.png" alt="1f37e" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f48b'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f48b.png" alt="1f48b" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f61e'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f61e.png" alt="1f61e" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'2665'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/2665.png" alt="2665" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f622'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f622.png" alt="1f622" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f62e'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f62e.png" alt="1f62e" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f634'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f634.png" alt="1f634" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f61c'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f61c.png" alt="1f61c" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f607'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f607.png" alt="1f607" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f608'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f608.png" alt="1f608" /></a></li>
</ul>
</div>
{{/if}}
<div class="btn-group dropdown">
{{if $item.like}} {{if $item.like}}
<button type="button" title="{{$item.like.0}}" class="btn btn-default btn-sm" onclick="dolike({{$item.id}},'like'); return false;"> <button type="button" title="{{$item.like.0}}" class="btn btn-default btn-sm" onclick="dolike({{$item.id}},'like'); return false;">
<i class="fa fa-thumbs-o-up" ></i> <i class="fa fa-thumbs-o-up" ></i>
@ -112,38 +135,10 @@
<i class="fa fa-question" ></i> <i class="fa fa-question" ></i>
</button> </button>
{{/if}} {{/if}}
{{if $item.toplevel}}
{{if $item.like}}
<span class="dropdown">
<button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" id="wall-item-react-{{$item.id}}">
<img class="dropdown-menu-img-xs" style="margin-right: 0;" src="/images/emoji/1f60a.png" alt="1f60a" />
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="wall-item-react-{{$item.id}}">
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f60a'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f60a.png" alt="1f60a" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f44f'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f44f.png" alt="1f44f" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f37e'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f37e.png" alt="1f37e" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f48b'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f48b.png" alt="1f48b" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f61e'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f61e.png" alt="1f61e" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'2665'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/2665.png" alt="2665" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f622'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f622.png" alt="1f622" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f62e'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f62e.png" alt="1f62e" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f634'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f634.png" alt="1f634" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f61c'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f61c.png" alt="1f61c" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f607'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f607.png" alt="1f607" /></a></li>
<li role="presentation"><a role="menuitem" href="#" onclick="jotReact({{$item.id}},'1f608'); return false;"><img class="dropdown-menu-img-sm" src="/images/emoji/1f608.png" alt="1f608" /></a></li>
</ul>
</span>
{{/if}}
{{/if}}
<button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" id="wall-item-menu-{{$item.id}}"> <button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" id="wall-item-menu-{{$item.id}}">
<i class="fa fa-caret-down"></i> <i class="fa fa-caret-down"></i>
</button> </button>
<ul class="dropdown-menu" role="menu" aria-labelledby="wall-item-menu-{{$item.id}}"> <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="wall-item-menu-{{$item.id}}">
{{if $item.share}} {{if $item.share}}
<li role="presentation"><a role="menuitem" href="#" onclick="jotShare({{$item.id}}); return false"><i class="fa fa-retweet" title="{{$item.share.0}}"></i> {{$item.share.0}}</a></li> <li role="presentation"><a role="menuitem" href="#" onclick="jotShare({{$item.id}}); return false"><i class="fa fa-retweet" title="{{$item.share.0}}"></i> {{$item.share.0}}</a></li>
{{/if}} {{/if}}
@ -182,6 +177,7 @@
{{/if}} {{/if}}
</ul> </ul>
</div> </div>
</div>
<div id="like-rotator-{{$item.id}}" class="like-rotator"></div> <div id="like-rotator-{{$item.id}}" class="like-rotator"></div>
{{if $item.responses || $item.attachments}} {{if $item.responses || $item.attachments}}