Posição dos botões de curtir

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Posição dos botões de curtir

Mensagem por paulim78 em 24/11/17, 07:13 pm

Detalhes da questão


Endereço do fórum: http://bithelp.forumeiros.com
Versão do fórum: ModernBB

Descrição


tava vendo que fico meio estanho a posição do Link do meu forum.

https://i.imgur.com/t8lipee.png

tira aonde ta vermelho e coloca +/- por ali aonde ta preto. Obrigado


Última edição por paulim78 em 12/12/17, 11:28 pm, editado 1 vez(es)
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 24/11/17, 07:34 pm

Olá novamente paulim78,

Não vejo nada de estranho na posição dos votos em seu tópico, aliais esta na posição correta referente a versão usada.

Mais como solicitado pelo senhor vamos ver o que podemos fazer.

Por gentileza poderia nos repassar seu viewtopic_body.

Até mais!


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 24/11/17, 07:36 pm

@Ketholy escreveu:Olá novamente paulim78,

Não vejo nada de estranho na posição dos votos em seu tópico, aliais esta na posição correta referente a versão usada.

Mais como solicitado pelo senhor vamos ver o que podemos fazer.

Por gentileza poderia nos repassar seu viewtopic_body.

Até mais!

Manim e que tipo como eu adicionei a azul na barra, ai os botão de Votos fico meio estranho com as cores.

Spoiler:

<script type="text/javascript">
//<![CDATA[
var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}", email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites: "{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" };

$(function(){
if(typeof(_atc) == "undefined") {
_atc = { };
}
});

var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}', hidden:'{JS_SHOW_HIDDEN_MESSAGE}' };
showHiddenMessage = function(id) {
try {
var regId = parseInt(id, 10);
if( isNaN(regId) ) { regId = 0; }

if( regId > 0) {
$('.post--' + id).toggle(0, function() {
if( $(this).is(":visible") ) {
$('#hidden-title--' + id).html(hiddenMsgLabel.visible);
} else {
$('#hidden-title--' + id).html(hiddenMsgLabel.hidden);
}
});
}
} catch(e) { }

return false;
};

//]]>
</script>

<div class="sub-header">
<div class="sub-header-info">
<h1 class="page-title">
<a href="{TOPIC_URL}">{TOPIC_TITLE}</a>
</h1>
<div class="sub-header-path">
<a class="nav" href="{U_INDEX}"><span>{L_INDEX}</span></a>
{NAV_CAT_DESC}
</div>
</div>

<div class="sub-header-buttons">
<!-- BEGIN switch_user_authpost -->
<a href="{U_POST_NEW_TOPIC}" rel="nofollow" class="ion-edit button1">{L_POST_NEW_TOPIC}</a>
<!-- END switch_user_authpost -->
<!-- BEGIN switch_user_authreply -->
<a href="{U_POST_REPLY_TOPIC}" class="ion-reply button1">{L_POST_REPLY_TOPIC}</a>
<!-- END switch_user_authreply -->
</div>
</div>

<div class="topic-actions">
<!-- BEGIN topicpagination -->
<div class="pagination">
{PAGINATION}
</div>
<!-- END topicpagination -->

<div class="topic-actions-buttons">
<!-- BEGIN switch_twitter_btn -->
<span>
<a href="https://twitter.com/share" class="twitter-share-button" data-via="{TWITTER}">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
</span>
<!-- END switch_twitter_btn -->

<!-- BEGIN switch_fb_likebtn -->
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/{LANGUAGE}/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<span class="fb-like" data-href="{FORUM_URL}{TOPIC_URL}" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></span>
<!-- END switch_fb_likebtn -->

<a class="addthis_button">{L_SHARE}</a>
<!-- BEGIN switch_plus_menu -->
<script type="text/javascript">//<![CDATA[
var url_favourite = '{U_FAVOURITE_JS_PLUS_MENU}';
var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
insert_plus_menu_new('f{FORUM_ID}&amp;t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
//]]>
</script>
<!-- END switch_plus_menu -->
</div>
</div>

<div class="quick-nav-topics">
<a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a>
<a href="#bottom">{L_GOTO_DOWN}</a>
<a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>
</div>

{POLL_DISPLAY}

<!-- BEGIN postrow -->
<!-- BEGIN hidden -->
<div class="post {postrow.hidden.ROW_COUNT}">
<p style="text-align:center">{postrow.hidden.MESSAGE}</p>
</div>
<!-- END hidden -->
<!-- BEGIN displayed -->
<div id="p{postrow.displayed.U_POST_ID}" class="post {postrow.displayed.ROW_COUNT}{postrow.displayed.ONLINE_IMG_NEW} post--{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR} style="{postrow.displayed.DISPLAYABLE_STATE}">
<div style="position: relative; top: -30px; width: 1px;" id="{postrow.displayed.U_POST_ID}"></div>
<div class="postprofile" id="profile{postrow.displayed.U_POST_ID}">
<!-- div class="online2"></div-->
<dl>
<dt>
<div class="postprofile-avatar">
{postrow.displayed.POSTER_AVATAR}
</div>
<div class="postprofile-name">
{postrow.displayed.POSTER_NAME}
</div>
<div class="postprofile-rank">
{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
</div>
</dt>
<dd class="postprofile-info">
<!-- BEGIN profile_field -->
{postrow.displayed.profile_field.LABEL}
{postrow.displayed.profile_field.CONTENT}
{postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->
{postrow.displayed.POSTER_RPG}
</dd>
<dd class="postprofile-contact">
{postrow.displayed.PROFILE_IMG}
{postrow.displayed.PM_IMG}
{postrow.displayed.EMAIL_IMG}
<!-- BEGIN contact_field -->
{postrow.displayed.contact_field.CONTENT}
<!-- END contact_field -->
</dd>
</dl>
</div>

<div class="post-head">
<ul class="profile-icons">
<li class="btn-thank">
<a href="{postrow.displayed.THANK_URL}">
<i class="ion-heart"></i>
</a>
</li>
<li class="btn-quote-multi">
<span onclick="{postrow.displayed.MULTIQUOTE_URL}" id="post_mq{TOPIC_ID}_{postrow.displayed.U_POST_ID}">
<i class="ion-quote"></i>
<i class="ion-ios-plus-empty"></i>
</span>
</li>
<li class="btn-quote">
<a href="{postrow.displayed.QUOTE_URL}">
<i class="ion-quote"></i>
</a>
</li>
<li class="btn-edit">
<a href="{postrow.displayed.EDIT_URL}">
<i class="ion-edit"></i>
</a>
</li>
<li class="btn-delete">
<a href="{postrow.displayed.DELETE_URL}">
<i class="ion-trash-a"></i>
</a>
</li>
<li class="btn-ip">
<a href="{postrow.displayed.IP_URL}">
<i class="ion-ios-information"></i>
</a>
</li>
<li class="btn-report">
{postrow.displayed.REPORT_IMG}
</li>
</ul>

<h2 class="topic-title">{postrow.displayed.ICON} <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a></h2>
<div class="topic-date">
{postrow.displayed.POST_DATE_NEW}

<!-- BEGIN switch_vote_active -->
<div class="vote">
<!-- BEGIN switch_vote -->
<a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}" class="ion-thumbsup"></a>
<!-- END switch_vote -->

<!-- BEGIN switch_vote -->
<a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="ion-thumbsdown"></a>
<!-- END switch_vote -->

<!-- BEGIN switch_bar -->
<div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
<div class="vote-bar-desc">
{postrow.displayed.switch_vote_active.L_VOTE_TITLE}
</div>

<div class="vote-bars">
<!-- BEGIN switch_vote_plus -->
<div class="vote-bar-plus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
<!-- END switch_vote_plus -->

<!-- BEGIN switch_vote_minus -->
<div class="vote-bar-minus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
<!-- END switch_vote_minus -->
</div>
</div>
<!-- END switch_bar -->

<!-- BEGIN switch_no_bar -->
<div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-bar-empty"></div>
<!-- END switch_no_bar -->
</div>
<!-- END switch_vote_active -->
</div>
</div>

<div class="postbody">
<div class="content">
<div>{postrow.displayed.MESSAGE}</div>
<!-- BEGIN switch_attachments -->
<dl class="attachbox">
<dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
<dd class="attachments">
<!-- BEGIN switch_post_attachments -->
<dl class="file">
<dt>
<img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" alt=""/>
</dt>
<dd>
<!-- BEGIN switch_dl_att -->
<span><a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}</span>
<!-- END switch_dl_att -->

<!-- BEGIN switch_no_dl_att -->
<span>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}</span>
<!-- END switch_no_dl_att -->

<!-- BEGIN switch_no_comment -->
<span>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</span>
<!-- END switch_no_comment -->

<!-- BEGIN switch_no_dl_att -->
<span><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></span>
<!-- END switch_no_dl_att -->

<span>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</span>
</dd>
</dl>
<!-- END switch_post_attachments -->
</dd>
</dl>
<!-- END switch_attachments -->
</div>
<div class="edited-message">
{postrow.displayed.EDITED_MESSAGE}
</div>
<!-- BEGIN switch_signature -->
<div class="signature_div" id="sig{postrow.displayed.U_POST_ID}">{postrow.displayed.SIGNATURE_NEW}</div>
<!-- END switch_signature -->
</div>
</div>
<!-- BEGIN first_post_br -->
<hr id="first-post-br" />
<!-- END first_post_br -->
<!-- END displayed -->
<!-- END postrow -->

<a name="bottomtitle"></a>

<div class="quick-nav-topics bottom">
<a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a>
<a href="#top">{L_BACK_TO_TOP}</a>
<a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>
</div>

<div class="topic-actions bottom">
<!-- BEGIN topicpagination -->
<div class="pagination">
{PAGINATION}
</div>
<!-- END topicpagination -->

<div class="topic-actions-buttons">
<!-- BEGIN switch_user_logged_in -->
<!-- BEGIN watchtopic -->
{S_WATCH_TOPIC}
<!-- END watchtopic -->
<!-- END switch_user_logged_in -->

<!-- BEGIN switch_user_authpost -->
<a href="{U_POST_NEW_TOPIC}" rel="nofollow" class="ion-edit button1">{L_POST_NEW_TOPIC}</a>
<!-- END switch_user_authpost -->
<!-- BEGIN switch_user_authreply -->
<a href="{U_POST_REPLY_TOPIC}" class="ion-reply button1">{L_POST_REPLY_TOPIC}</a>
<!-- END switch_user_authreply -->
</div>
</div>

<!-- BEGIN promot_trafic -->
<div class="block" id="ptrafic_close" style="display: none;">
<div class="h3"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><i class="ion-ios-plus-outline"></i></a>{PROMOT_TRAFIC_TITLE}</div>
</div>
<div class="block" id="ptrafic_open" style="display:'';">
<div class="h3"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><i class="ion-ios-minus-outline"></i></a>{PROMOT_TRAFIC_TITLE}</div>
<ul class="ptrafic">
<!-- BEGIN link -->
<li>
<a href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}" rel="nofollow">
<i class="ion-ios-chatbubble-outline"></i>{promot_trafic.link.TITLE}
</a>
</li>
<!-- END link -->
</ul>
</div>
<!-- END promot_trafic -->

<!-- BEGIN switch_forum_rules -->
<div class="post row1" id="forum_rules">
<div class="h3">{L_FORUM_RULES}</div>
<div class="clear"></div>
<table class="postbody">
<tr>
<!-- BEGIN switch_forum_rule_image -->
<td class="logo">
<img src="{RULE_IMG_URL}" alt="" />
</td>
<!-- END switch_forum_rule_image -->
<td class="rules content">
{RULE_MSG}
</td>
</tr>
</table>
</div>
<!-- END switch_forum_rules -->

<!-- BEGIN switch_user_logged_in -->
<a name="quickreply"></a>
{QUICK_REPLY_FORM}
<!-- END switch_user_logged_in -->

<form action="{S_JUMPBOX_ACTION}" method="get" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
<fieldset class="jumpbox">
<label>{L_JUMP_TO}:</label>
{S_JUMPBOX_SELECT}
<input class="button2" type="submit" value="{L_GO}" />
</fieldset>
</form>

<!-- BEGIN viewtopic_bottom -->
<form method="get" action="{S_FORM_MOD_ACTION}">
<fieldset class="quickmod">
<input type="hidden" name="t" value="{TOPIC_ID}" />

<!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
<input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />
<label>{L_MOD_TOOLS}:</label>
{S_SELECT_MOD}
<input class="button2" type="submit" value="{L_GO}" />
</fieldset>
</form>

<p class="right">{S_TOPIC_ADMIN}</p>
<!-- END viewtopic_bottom -->

<!-- BEGIN show_permissions -->
<div class="block">
<div class="h3">{L_TABS_PERMISSIONS}</div>
{S_AUTH_LIST}
</div>
<!-- END show_permissions -->

<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.postbody .content', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->

<script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=forumotion" type="text/javascript"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/github-gist.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
$(document).ready(function() {
$('pre, code').each(function(i, block) {
hljs.highlightBlock(block);
});

$('.post').each(function() {
if (!$(this).find('.postprofile-avatar').html().length) {
$(this).find('.postprofile-rank').css('border-bottom', 'none');
$(this).find('.postprofile > dl > dt').css('min-height', $(this).find('.post-head').innerHeight());
}
});
});
</script>
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 24/11/17, 07:56 pm

Vamos primeiramente tenta pela folha de estilo CSS.

Adicione em sua folha de estilo CSS seguinte código:

Spoiler:
.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}

.vote .vote-no-bar {
display: none;
}

.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}

.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}

.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
}

.vote .vote-button a[href*="plus"] {
background:url('URL_DA_IMAGEM');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.vote .vote-button a[href*="minus"] {
background-image:url('URL_DA_IMAGEM');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

Altere onde está escrito URL_DA_IMAGEM pelo link valido de uma imagem que gostaria que representasse os votos tanto negativo quanto positivo. Após isso informe a mudança para podemos proceder.

Até mais!


Última edição por Ketholy em 06/12/17, 06:24 pm, editado 1 vez(es)


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 24/11/17, 08:07 pm

Adicionar tudo isso no CSS?.
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 24/11/17, 08:13 pm

@paulim78 escreveu:Adicionar tudo isso no CSS?.

Exatamente, esse código ira personalizar os votos, como citei anteriormente basta escolher uma imagem que lhe agrade com a cor do titulo do fórum e adicione ao código onde tem URL da imagem. Caso lhe agrade não precisaremos modificar nada no template.


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 24/11/17, 08:59 pm

Manim adicionei o codigo inteiro mesmo no css não resultou

https://i.imgur.com/kZ6SyQp.png
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com
  • 0

Resolvido Re: Posição dos botões de curtir

Mensagem por while em 24/11/17, 09:49 pm

Olá autor, boa noite.

Remova tudo o que foi passado e adicione somente esse código na folha de estilo css:

Código:
.vote {margin-top:45px!important;}

Para deixar o ("+") e o ("-"), ou seja o "mais" e o "menos", basta adicionar esse código em sua folha de estilo css:

Código:
.ion-thumbsup:before {content: "+"!important;}
        .ion-thumbsdown:before {content: "-"!important;margin-left:10px;}

Simples, não?

Até.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3152
Pontos Ativos : 4600

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 24/11/17, 10:58 pm

o manim simples kkkk, em veis de + e - teria como coloca uma img do meu gosto?
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por while em 25/11/17, 05:55 pm

Sim, tem como sim bro.

Adicione esse código em sua folha de estilo css:

Código:
.vote .ion-thumbsup {background-image: url(https://i.imgur.com/BUJNUQU.png)!important;width:28px!important;height:28px!important;}
        .vote .ion-thumbsdown {background-image: url(https://i.imgur.com/loZ5OUG.png)!important;width:28px!important;height:28px!important;}

Isso é só um exemplo, caso queira outra imagem altere as url.

Até.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3152
Pontos Ativos : 4600

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 25/11/17, 09:53 pm

manim fico otimo, porem quando adiciona essa imagem no fundo da imagem ainda fica aquele + e -

https://i.imgur.com/DQa7GLF.png
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 27/11/17, 12:55 pm

UP?.
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Kyo Panda em 28/11/17, 09:11 am

Adicione ao CSS:

Código:
.vote .ion-thumbsup,
.vote .ion-thumbsdown {
  font-size: 0 !important;
}
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 29/11/17, 12:39 am

@Kyo Panda escreveu:Adicione ao CSS:

Código:
.vote .ion-thumbsup,
.vote .ion-thumbsdown {
  font-size: 0 !important;
}

Não, entenderam tudo errado tudo errado mesmo, fecharam meu topico completamente atoa, não leram direito entendeu de outro jeito Seco.

Na REP+ eu queria coloca essa imagem em vez do +
https://i.imgur.com/b7NFdlw.png

No rep - essa imagem em vez do -
https://i.imgur.com/0yIii1y.png

Ai quando da a reputação aparece uma barra de quantos votos eu queria troca ela pra coloca as carinhas entendeu.
https://i.imgur.com/SreOv8r.png

Tipo aonde ta em preto eu queria coloca o que ta em azul. tipo tira o preto e deixa so o azul. porem so com a imagem que foi acionada tipo se foi dado rep+ deixa a carinha verde. Entendeu agora?.......
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Gaaratsu em 29/11/17, 03:57 am



Bem-vindo(a) ao Fórum dos Fóruns Convidado!
Leia as Regras do Fórum dos Fóruns (FDF) e o Regulamento do setor de Suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Gaaratsu — Ajudeiro
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7504

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Posição dos botões de curtir

Mensagem por Kyo Panda em 29/11/17, 08:36 am

@paulim78 escreveu:Não, entenderam tudo errado tudo errado mesmo, fecharam meu topico completamente atoa, não leram direito entendeu de outro jeito.

https://m.popkey.co/39f7dd/bX9eV.gif

---

Poderia criar alguma postagem no seu fórum que seja visível a membros para que seja possível ver como está o CSS do botão curtir?
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 30/11/17, 11:54 pm

Manim fiz o 1 que e mais do meu gosto porem não deu. Não mudo a img e bugo kkkk.

https://i.imgur.com/eLVlzzU.png

bugo o tanto de reputação, e os icones não aparece do formato que eu adicionei kkkkkk
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Gaaratsu em 02/12/17, 07:08 pm

Peço que me passe o código utilizado, pois em relação ao posicionamento e as imagens podemos concertar.
Leve em consideração o que o nosso querido ex-moderadeiro Kyo Panda disse, para que possamos ver direto do seu fórum pelo console.
Em relação aos códigos do @while , pareciam estar exatamente da forma que o senhor queria, depois o senhor disse que estavam todos errados... não entendi bem! Louco Tonto

Att! Feliz


Bem-vindo(a) ao Fórum dos Fóruns Convidado!
Leia as Regras do Fórum dos Fóruns (FDF) e o Regulamento do setor de Suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Gaaratsu — Ajudeiro
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7504

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 06/12/17, 05:37 pm

O codigo que eu estou utilizando e esse.

Spoiler:

.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}

.vote .vote-no-bar {
display: none;
}

.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}

.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}

.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
}

.vote .vote-button a[href*="plus"] {
background:url('URL_DA_IMAGEM');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.vote .vote-button a[href*="minus"] {
background-image:url('URL_DA_IMAGEM');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 06/12/17, 06:27 pm

@paulim78 escreveu:O codigo que eu estou utilizando e esse.

Spoiler:

.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}

.vote .vote-no-bar {
display: none;
}

.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}

.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}

.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
}

.vote .vote-button a[href*="plus"] {
background:url('URL_DA_IMAGEM');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.vote .vote-button a[href*="minus"] {
background-image:url('URL_DA_IMAGEM');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

Poderia criar alguma postagem no seu fórum que seja visível a membros para que seja possível ver como está o CSS do botão curtir?

O senhor poderia fazer o que Kyo citou na mensagem anteriormente. Só assim saberemos o que esta ocorrendo de errado e daremos uma resolução para o problema.

Estarei aguardando.



Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 06/12/17, 11:18 pm

mais meu fórum tem vários tópicos que eu criei para testar. 

https://i.imgur.com/bAdfLTZ.png

olha ai o tanto de reputação do Usuário como que tah. e eu troquei as img dos botão porem nao resulto nada no fórum.
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 08/12/17, 07:44 pm

@paulim78 escreveu:mais meu fórum tem vários tópicos que eu criei para testar. 

https://i.imgur.com/bAdfLTZ.png

olha ai o tanto de reputação do Usuário como que tah. e eu troquei as img dos botão porem nao resulto nada no fórum.

Não consigo visualizar nenhum tópico, o senhor poderia liberar a visualização de alguma ária para membros.

Até mais!


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 08/12/17, 11:54 pm

@Ketholy escreveu:
@paulim78 escreveu:mais meu fórum tem vários tópicos que eu criei para testar. 

https://i.imgur.com/bAdfLTZ.png

olha ai o tanto de reputação do Usuário como que tah. e eu troquei as img dos botão porem nao resulto nada no fórum.

Não consigo visualizar nenhum tópico, o senhor poderia liberar a visualização de alguma ária para membros.

Até mais!
pronto, criei um tipico la de uma olhada...
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Pedxz em 09/12/17, 05:32 am

@paulim78 escreveu:mais meu fórum tem vários tópicos que eu criei para testar. 

https://i.imgur.com/bAdfLTZ.png

olha ai o tanto de reputação do Usuário como que tah. e eu troquei as img dos botão porem nao resulto nada no fórum.

Vá em Módulos > Pontos e reputação > Reputação

Veja se o sistema de reputação está ativo: "Ativar o sistema de reputação".
E pode gerir os pontos ganhos na "Gestão de pontos".
avatar

Pedxz
Nível 9

Masculino
Inscrito dia : 13/01/2017
Mensagens : 152
Pontos Ativos : 230

Ver perfil do usuário http://power-pixel.net https://www.facebook.com/pedxz

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 09/12/17, 10:31 am

Bom dia paulim78,

Por gentileza retire todos os códigos repassados nesse tópico, em seguida pode nos passar a link valido das imagens que deseja que represente tanto voto positivo quanto negativo.

Até mais!


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 11/12/17, 12:35 pm

Esse seria Voto positivo
https://i.imgur.com/ndTP7Ev.png

Esse seria voto negativo
https://i.imgur.com/kWA7hMw.png

Não sei se vai ter como fazer nesse mesmo script. Mais quando da o Voto positivo aparecer essa IMG
https://i.imgur.com/bqw96Uh.png

E quando der Voto Negativo aparecer essa IMG
https://i.imgur.com/fy0bLbB.png
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com
  • 0

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 11/12/17, 12:54 pm

@paulim78 escreveu:Esse seria Voto positivo
https://i.imgur.com/ndTP7Ev.png

Esse seria voto negativo
https://i.imgur.com/kWA7hMw.png

Não sei se vai ter como fazer nesse mesmo script. Mais quando da o Voto positivo aparecer essa IMG
https://i.imgur.com/bqw96Uh.png

E quando der Voto Negativo aparecer essa IMG
https://i.imgur.com/fy0bLbB.png

Certo! Vamos por passo, crie um novo JS com investimento em todas as páginas:

Código:
Código:
/**
 *! Botão curtir para fóruns ModernBB
 *
 *  @author Luiz
 *  @version {beta} 1.0
 *  @licence MIT
 *
 *  Copyright (c) Luiz Felipe | All rights reserved.
 */
(function ($, styles) {
  'use strict';

  /**
  * @name Recriar o painel de voto.
  * @desc Usado para recriar o painel dos votos no topo do post.
  * @param {string} href - Corresponde à URL que será usada na ação AJAX caso o botão de curtir seja usado.
  * @param {string} number - Corresponde ao número de votos daquela postagem.
  * @param {object} vote - Corresponde ao seletor do wrapper de todo o conteúdo dos votos.
  * @param {boolean} cond - Caso for "true", a ação AJAX será feita, caso contrário, somente irá aparecer.
  */
  var $createVote = function (href, number, vote, cond) {
    $('<div>', {
      'data-href': href,
      'html'    : [
        '<span class="fa-vote-counter">' + number + '</span>',
        $('<a>', { 'class': 'ion-thumbsup fa-new-vote-action-trigger' }).prop('outerHTML')
      ].join('\n'),
      'class'    : cond ? 'fa-new-vote-wrapper' : 'fa-new-vote-wrapper voted'
    })
      .insertAfter(vote)
        .find('.fa-new-vote-action-trigger')
          .on('click', function () {

            var $this = $(this);

            if (!cond || $(this).is('.voted')) {
              alert('Você já votou!');
              return;
            }

            var $button = $(this).prev('span');
            var $parent = $(this).parent('div');

            $this.addClass('voted');
            $parent.addClass('voted');
            $button.text(parseInt($button.text()) + 1);

            $.get(href)
              .done(function () {

                console.info('O voto foi registrado.');

              })
              .fail(function () {
                alert('Houve um erro, tente novamente!');
                location.reload();
              })
            ;
          })
    ;
  };

  $(function () {
    $('.post').each(function () {

      var $this  = $(this);
      var $vote  = $this.find('.vote');
      var $like  = $this.find('.vote .ion-thumbsup');
      var $bar    = $this.find('.vote-bar');
      var $barNum = $this.find('.vote-bar .vote-bar-desc');

      $vote.hide();

      /**
      * Parte 01:
      * Executar o código caso já existam votos, mas o usuário ainda não tiver votado.
      */
      if ($like.length && $bar.length) {

        var number1 = $barNum.text().replace(/^.+:.\d+%.\((\d+).+\)$/gi, '$1');
        var href1  = $like.attr('href');

        $createVote(href1, number1, $vote, true);

        return;

      }

      /**
      * Parte 02:
      * Executar o código caso já existam votos, contando com o do usuário.
      */
      if ($bar.length) {

        var number2 = $barNum.text().replace(/^.+:.\d+%.\((\d+).+\)$/gi, '$1');
        var href2  = $like.attr('href');

        $createVote(href2, number2, $vote, false);

        return;

      }

      /**
      * Parte 03:
      * Executar o código caso o usuário não tiver votado, e não existam votos.
      */
      if ($like.length) {

        var href3 = $like.attr('href');

        $createVote(href3, 0, $vote, true);

        return;

      }

    });

    $(['<style>', styles, '</style>'].join('\n')).appendTo('head');
  });
}(jQuery, [
  '.fa-new-vote-wrapper {',
  '  float: right;',
  '  display: inline-block;',
  '  position: relative;',
  '}',
  '',
  '.fa-new-vote-wrapper .fa-vote-counter {',
  '  position: absolute;',
  '  left: -22px;',
  '  background-color: #d4d4d4;',
  '  padding: 1px 15px 1px 7px;',
  '  border-radius: 5px 0 0 5px;',
  '  color: #555;',
  '  z-index: 1;',
  '}',
  '',
  '.fa-new-vote-wrapper .fa-new-vote-action-trigger {',
  '  background-color: #8b5;',
  '  color: #fff;',
  '  display: inline-block;',
  '  padding: 6px 7.5px;',
  '  border-radius: 100px;',
  '  font-size: 14px;',
  '  cursor: pointer;',
  '  text-decoration: none;',
  '  position: absolute;',
  '  left: -5px;',
  '  top: -2px;',
  '  z-index: 13;',
  '  -webkit-transition: all 200ms linear;',
  '    -moz-transition: all 200ms linear;',
  '      -ms-transition: all 200ms linear;',
  '      -o-transition: all 200ms linear;',
  '          transition: all 200ms linear;',
  '}',
  '',
  '.fa-new-vote-wrapper .fa-new-vote-action-trigger:hover {',
  '  background-color: #444;',
  '}',
  '',
  '.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger,',
  '.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger:hover {',
  '  background-color: #8e8e8e;',
  '}'
].join('\n')));

O resto iremos personalizar pelo CSS ou HTML. Mais primeiro tenho que ver e o código é funcional em seu fórum.


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 11/12/17, 10:08 pm

Amigo resultou pfto, so que quando cria um topico ou envia a msg ja vem com 1 voto la kkkk. creio eu que isso e modificado no CSS ne igual vc falo kkkkk... Mais funciono pfto esse script
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 11/12/17, 10:24 pm

@paulim78 escreveu:Amigo resultou pfto, so que quando cria um topico ou envia a msg ja vem com 1 voto la kkkk. creio eu que isso e modificado no CSS ne igual vc falo kkkkk... Mais funciono pfto esse script

O código que lhe repassei ele funciona da seguinte maneira: Ao ser criado um novo tópico automaticamente já é apresentado 1 voto, como se fosse seu voto ativo.

Nesse caso, teremos que editar o código, não será possível concertar pela CSS. Troque o código por esse:
Código:
/**
 *! Botão curtir para fóruns ModernBB
 *
 *  @author Luiz
 *  @version {beta} 1.0
 *  @licence MIT
 *
 *  Copyright (c) Luiz Felipe | All rights reserved.
 */
(function ($, styles) {
  'use strict';

  /**
  * @name Recriar o painel de voto.
  * @desc Usado para recriar o painel dos votos no topo do post.
  * @param {string} href - Corresponde à URL que será usada na ação AJAX caso o botão de curtir seja usado.
  * @param {string} number - Corresponde ao número de votos daquela postagem.
  * @param {object} vote - Corresponde ao seletor do wrapper de todo o conteúdo dos votos.
  * @param {boolean} cond - Caso for "true", a ação AJAX será feita, caso contrário, somente irá aparecer.
  */
  var $createVote = function (href, number, vote, cond) {
    $('<div>', {
      'data-href': href,
      'html'    : [
        '<span class="fa-vote-counter">' + number + '</span>',
        $('<a>', { 'class': 'ion-thumbsup fa-new-vote-action-trigger' }).prop('outerHTML')
      ].join('\n'),
      'class'    : cond ? 'fa-new-vote-wrapper' : 'fa-new-vote-wrapper voted'
    })
      .insertAfter(vote)
        .find('.fa-new-vote-action-trigger')
          .on('click', function () {

            var $this = $(this);

            if (!cond || $(this).is('.voted')) {
              alert('Você já votou!');
              return;
            }

            var $button = $(this).prev('span');
            var $parent = $(this).parent('div');

            $this.addClass('voted');
            $parent.addClass('voted');
            $button.text(parseInt($button.text()) + 1);

            $.get(href)
              .done(function () {

                console.info('O voto foi registrado.');

              })
              .fail(function () {
                alert('Houve um erro, tente novamente!');
                location.reload();
              })
            ;
          })
    ;
  };

  $(function () {
    $('.post').each(function () {

      var $this  = $(this);
      var $vote  = $this.find('.vote');
      var $like  = $this.find('.vote .ion-thumbsup');
      var $bar    = $this.find('.vote-bar');
      var $barNum = $this.find('.vote-bar .vote-bar-desc');

      $vote.hide();

      /**
      * Parte 01:
      * Executar o código caso já existam votos, mas o usuário ainda não tiver votado.
      */
      if ($like.length && $bar.length) {

        var number1 = $barNum.text().replace(/^.+:.\d+%.\((\d+).+\)$/gi, '$1');
        var href1  = $like.attr('href');

        $createVote(href1, number1, $vote, true);

        return;

      }

      /**
      * Parte 02:
      * Executar o código caso já existam votos, contando com o do usuário.
      */
      if ($bar.length) {

        var number2 = $barNum.text().replace(/^.+:.\d+%.\((\d+).+\)$/gi, '$1');
        var href2  = $like.attr('href');

        $createVote(href2, number2, $vote, false);

        return;

      }

      /**
      * Parte 03:
      * Executar o código caso o usuário não tiver votado, e não existam votos.
      */
      if ($like.length) {

        var number3 = $barNum.text().replace(/^.+:.\d+%.\((\d+).+\)$/gi, '$0');
        var href3 = $like.attr('href');

        $createVote(href3, 0, $vote, true);

        return;

      }

    });

    $(['<style>', styles, '</style>'].join('\n')).appendTo('head');
  });
}(jQuery, [
  '.fa-new-vote-wrapper {',
  '  float: right;',
  '  display: inline-block;',
  '  position: relative;',
  '}',
  '',
  '.fa-new-vote-wrapper .fa-vote-counter {',
  '  position: absolute;',
  '  left: -22px;',
  '  background-color: #d4d4d4;',
  '  padding: 1px 15px 1px 7px;',
  '  border-radius: 5px 0 0 5px;',
  '  color: #555;',
  '  z-index: 1;',
  '}',
  '',
  '.fa-new-vote-wrapper .fa-new-vote-action-trigger {',
  '  background-color: #8b5;',
  '  color: #fff;',
  '  display: inline-block;',
  '  padding: 6px 7.5px;',
  '  border-radius: 100px;',
  '  font-size: 14px;',
  '  cursor: pointer;',
  '  text-decoration: none;',
  '  position: absolute;',
  '  left: -5px;',
  '  top: -2px;',
  '  z-index: 13;',
  '  -webkit-transition: all 200ms linear;',
  '    -moz-transition: all 200ms linear;',
  '      -ms-transition: all 200ms linear;',
  '      -o-transition: all 200ms linear;',
  '          transition: all 200ms linear;',
  '}',
  '',
  '.fa-new-vote-wrapper .fa-new-vote-action-trigger:hover {',
  '  background-color: #444;',
  '}',
  '',
  '.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger,',
  '.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger:hover {',
  '  background-color: #8e8e8e;',
  '}'
].join('\n')));

Vamos ver se resulta.


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 12/12/17, 09:50 am

Opa agora fico ótimo em...
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 12/12/17, 01:46 pm

Creio que o sistema que lhe repassei não vai querer alterações, pois ele se trata de um sistema único. Na minha percepção não muda mais nada. O senhor ainda tem mais alguma duvida referente a essa questão, ou posso dá como resolvido?


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 12/12/17, 03:11 pm

Bom Teria como só, na hora que der o voto o Like fica verde?. pois dps do link ele fica cinza...
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 12/12/17, 03:19 pm

@paulim78 escreveu:Bom Teria como só, na hora que der o voto o Like fica verde?. pois dps do link ele fica cinza...

Simples de resolver isso, adicionar em sua folha de estilo CSS o seguinte código:
Código:
.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger, .fa-new-vote-wrapper.voted .fa-new-vote-action-trigger:hover {
    background-color: #FFEB3B;
}

Basta trocar #FFEB3B pela cor que deseja que o mesmo fique após a voto.

Até mais!


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 12/12/17, 03:23 pm

adicionei, porem não resultou kkk
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 12/12/17, 03:25 pm

@paulim78 escreveu:adicionei, porem não resultou kkk

Ué eu testei em seu fórum e funcionou normalmente, lembre-se que você só verá o efeito caso você já tenha efetuado algum voto.


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 12/12/17, 03:27 pm

Ai manim, uma prova que dei o voto.

https://i.imgur.com/HpBXspy.png
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 12/12/17, 03:33 pm

@paulim78 escreveu:Ai manim, uma prova que dei o voto.

https://i.imgur.com/HpBXspy.png

Poderia nos repassar sua folha de estilo!


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 12/12/17, 03:35 pm

Opaaa. 

Aqui esta.
Spoiler:

.topic-actions-buttons{
display: none;
}

.fa_login_row {
margin: 0px 0;
}

.fa_login_button {
color: #69C;
background: none;
border: 0px solid #69C;
border-radius: 3px;
font-size: 16px;
font-weight: bold;
font-family: Arial, sans-serif;
display: block;
height: 30px;
line-height: 3px;
width: 240px;
margin: 3px auto;
transition: 250ms;
outline: none;
cursor: pointer;
}

element.style {
height: 360px;
}

.button, .button1, .button2, input[type="submit"] {
background-color: #3793ff;
border-radius: 3px;
box-shadow: 0 1px 2px rgba(0,0,0,0.3);
color: #fff;
display: inline-block;
font-family: Roboto, sans-serif;
font-size: 1.2rem;
font-weight: 500;
overflow: hidden;
padding: 1px 20px;
position: relative;
text-decoration: none;
vertical-align: middle;
width: auto!important;
}
a.mainmenu[href="/faq"]{
display: none !important;
}
a.mainmenu[href="/calendar"]{
display: none !important;
}
a.mainmenu[href="/groups"]{
display: none !important;
}
.postprofile-rank{
  padding: 3px;
  border: 1px solid #aaa;
}
.postprofile-info{
padding-right: 11px !important;
}
.postprofile-rank{
  padding: 3px;
  border: 1px solid #aaa;
}
.postprofile .field{
    margin-right: 0px !important;
}
.post-head{
  background: #3793FF;
}
.post-head .topic-title {
    color: #444;
    display: inline-block;
    font-family: Arial Black;
    font-size: 2.2rem;
    font-weight: 650;
    margin: -3px 0 3px;
    padding: 0;
    text-transform: none;
}
.vote {margin-top:45px!important;}
.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}

.vote .vote-no-bar {
display: none;
}

.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}

.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}

.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
}

.vote .vote-button a[href*="plus"] {
background:url('https://i.imgur.com/ciztWMl.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.vote .vote-button a[href*="minus"] {
background-image:url('https://i.imgur.com/bAto3Nn.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}
.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger, .fa-new-vote-wrapper.voted .fa-new-vote-action-trigger:hover {
    background-color: #FFEB3B;
}
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 12/12/17, 03:44 pm

Troque por essa:

Código:
.topic-actions-buttons{
display: none;
}

.fa_login_row {
margin: 0px 0;
}

.fa_login_button {
color: #69C;
background: none;
border: 0px solid #69C;
border-radius: 3px;
font-size: 16px;
font-weight: bold;
font-family: Arial, sans-serif;
display: block;
height: 30px;
line-height: 3px;
width: 240px;
margin: 3px auto;
transition: 250ms;
outline: none;
cursor: pointer;
}

element.style {
height: 360px;
}

.button, .button1, .button2, input[type="submit"] {
background-color: #3793ff;
border-radius: 3px;
box-shadow: 0 1px 2px rgba(0,0,0,0.3);
color: #fff;
display: inline-block;
font-family: Roboto, sans-serif;
font-size: 1.2rem;
font-weight: 500;
overflow: hidden;
padding: 1px 20px;
position: relative;
text-decoration: none;
vertical-align: middle;
width: auto!important;
}
a.mainmenu[href="/faq"]{
display: none !important;
}
a.mainmenu[href="/calendar"]{
display: none !important;
}
a.mainmenu[href="/groups"]{
display: none !important;
}
.postprofile-rank{
  padding: 3px;
  border: 1px solid #aaa;
}
.postprofile-info{
padding-right: 11px !important;
}
.postprofile-rank{
  padding: 3px;
  border: 1px solid #aaa;
}
.postprofile .field{
    margin-right: 0px !important;
}
.post-head{
  background: #3793FF;
}
.post-head .topic-title {
    color: #444;
    display: inline-block;
    font-family: Arial Black;
    font-size: 2.2rem;
    font-weight: 650;
    margin: -3px 0 3px;
    padding: 0;
    text-transform: none;
}
.vote {margin-top:45px!important;}
.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}

.vote .vote-no-bar {
display: none;
}

.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}

.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}

.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
}

.vote .vote-button a[href*="plus"] {
background:url('https://i.imgur.com/ciztWMl.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.vote .vote-button a[href*="minus"] {
background-image:url('https://i.imgur.com/bAto3Nn.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}

.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger, .fa-new-vote-wrapper.voted .fa-new-vote-action-trigger:hover {
    background-color: #FFEB3B;
}


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 12/12/17, 03:47 pm

Fico mesmo jeito kkkk

https://i.imgur.com/B92gT55.png
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Gaaratsu em 12/12/17, 07:37 pm

Olá!

Substitua o código fornecido anteriormente, por este outro:
Código:
.fa-new-vote-wrapper .fa-vote-counter, .fa-vote-counter:hover {
background-color: #00ff00 !important;
}
.fa-new-vote-wrapper.voted .fa-new-vote-action-trigger, .fa-new-vote-wrapper.voted .fa-new-vote-action-trigger:hover {
background-color: #00ff00 !important;
}

Att! Feliz


Bem-vindo(a) ao Fórum dos Fóruns Convidado!
Leia as Regras do Fórum dos Fóruns (FDF) e o Regulamento do setor de Suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Gaaratsu — Ajudeiro
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7504

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Posição dos botões de curtir

Mensagem por paulim78 em 12/12/17, 11:24 pm

Opa resolvido. Dps de muitas lutas e glorias kkk. obg a todos e desculpa algo...
avatar

paulim78
Nível 9

Masculino
Inscrito dia : 02/06/2012
Mensagens : 227
Pontos Ativos : 329

Ver perfil do usuário http://tudoexp.forum-livre.com

Resolvido Re: Posição dos botões de curtir

Mensagem por Ketholy em 12/12/17, 11:36 pm

Disponha! Piscada

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Ketholy — Ajudeira
avatar

Ketholy
Ajudeira
Ajudeira

Feminino
Inscrito dia : 20/01/2017
Mensagens : 858
Pontos Ativos : 1036

Ver perfil do usuário http://jogosrpg-com-br.forumais.com/forum http://assuntosgeral-com-br.forumais.com https://twitter.com/Ketholy Suan

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum