XF 2.3 Css class for buttons

[AndreaMarucci]

Hello Just upgraded to 2.3.3 and reverted back to the default theme since the themehouse one has crashed.

in the sidebar I've these link I would like to style as buttons. Now the code is

<div class="button_cont" align="center"><a class="btn_koglife bk-verde" href="https://gallery.kog.it/" target="_blank" rel="nofollow noopener">GALLERY KOG</a></div>
<div class="button_cont" align="center"><a class="btn_koglife bk-verde" href="https://www.kog.it/" target="_blank" rel="nofollow noopener" style="margin-top:7px;">SITO KOG</a></div>
<div class="button_cont" align="center"><a class="btn_koglife bk-verde" href="https://www.kog.it/eventi/" target="_blank" rel="nofollow noopener" style="margin-top:7px;" >PROSSIMI EVENTI</a></div>
<xf:if is="{{$xf.visitor.isMemberOf(3,4,12)}}">
<div class="button_cont" align="center"><a class="btn_koglife" href="https://forum.kog.it/pages/partecipazione_raduni_kog/" rel="nofollow noopener" style="margin-top:7px;">PARTECIPAZIONE RADUNI</a></div>
<div class="button_cont" align="center"><a class="btn_koglife" href="https://forum.kog.it/pages/raduno-kog/" rel="nofollow noopener" style="margin-top:7px;">ORGANIZZARE RADUNI</a></div>
<div class="button_cont" align="center"><a class="btn_koglife" href="https://forum.kog.it/pages/quotaforum/" rel="nofollow noopener" style="margin-top:7px;">RINNOVO QUOTA</a></div>
<div class="button_cont" align="center"><a class="btn_koglife" href="https://forum.kog.it/threads/gruppo-kog-su-whatsapp.15421" rel="nofollow noopener" style="margin-top:7px;">GRUPPO WHATSAPP KOG</a></div>
<div class="button_cont" align="center"><a class="btn_koglife" href="https://forum.kog.it/forums/2019.142/" rel="nofollow noopener" style="margin-top:7px;">ISCRIZIONE EVENTI</a></div>

</xf:if>

I've used the class "button_cont" in the previous theme but now I've lost the definition.

Can anyone tell me how to edit this code to show the links as xenforo buttons?

And possibly to change color in some of them.

thanks!

 

[Old Nick]

<xf:button class="btn_koglife bk-verde" href="https://gallery.kog.it/" target="_blank" rel="nofollow noopener">GALLERY KOG</xf:button>

 

[AndreaMarucci]

Thanks, unfortunately I've lost that class so I would need to find another class to show a link as button

 

[Old Nick]

You don't even need a class to get the button.

<xf:button href="https://gallery.kog.it/" target="_blank" rel="nofollow noopener">GALLERY KOG</xf:button>

But there are some premade class : button--cta, button--primary, button--link, you can test them, or create your own in the extra.less template:

.kogButton
{
    border: 1px solid red;
    background: white;
    color: red;
}

Then...

<xf:button class="kogButton" href="https://gallery.kog.it/" target="_blank" rel="nofollow noopener">GALLERY KOG</xf:button>

 

[AndreaMarucci]

Thanks again, very appreciated