Simple Machines Community Forum

Customizing SMF => Graphics and Templates => Topic started by: goldenstudios on April 04, 2020, 03:03:07 PM

Title: fix karma images
Post by: goldenstudios on April 04, 2020, 03:03:07 PM
hi guys I would like to understand how to fix the karma images (inches) with the number next to that the value of karma because as you will see in the second image you risk that increasing the number of karma goes attached to the thanks of the posts
how can i fix it?

what others see
(https://i.postimg.cc/CLp63nFJ/test.png)

what I see from my profile
(https://i.postimg.cc/jj6jh7d9/test2.png)


this and the code about it
// Is this user allowed to modify this member's karma?
if ($modSettings['karmaMode'] == '1' || ($modSettings['karmaMode'] == '2')) {
echo '
<li class="karma_allow"><span class="kmtitle">', $modSettings['karmaLabel'], '</span><img class="kmimages" src="', $settings['images_url'], '/id/star.png" alt="" /><hr class="kmdivisor2" />';



// Is karma display enabled?  Total or +/-?
if ($modSettings['karmaMode'] == '1')
echo '
<center><span class="karma_n">', $message['member']['karma']['good'] - $message['member']['karma']['bad'], '</span></center>';
elseif ($modSettings['karmaMode'] == '2')
echo '
<center><span class="karma_n">+', $message['member']['karma']['good'], '/-', $message['member']['karma']['bad'], '</span></center>';

if ($message['member']['karma']['allow'])
echo '
<a href="', $scripturl, '?action=modifykarma;sa=applaud;uid=', $message['member']['id'], ';topic=', $context['current_topic'], '.' . $context['start'], ';m=', $message['id'], ';', $context['session_var'], '=', $context['session_id'], '"><img src="', $settings['images_url'], '/id/up.png" alt="', $modSettings['karmaApplaudLabel'], '" /></a>
<a href="', $scripturl, '?action=modifykarma;sa=smite;uid=', $message['member']['id'], ';topic=', $context['current_topic'], '.', $context['start'], ';m=', $message['id'], ';', $context['session_var'], '=', $context['session_id'], '"><img src="', $settings['images_url'], '/id/down.png" alt="', $modSettings['karmaSmiteLabel'], '" /></a>';

echo '
</li>';



I attached my display file anyway
tips? on how could I improve that interface?
Title: Re: fix karma images
Post by: Deaks on June 24, 2020, 10:21:39 AM
goldenstudios did you get this sorted?  I am curious on what you are wishing to do exactly, are you wishing to remove the karma buttons?
Title: Re: fix karma images
Post by: goldenstudios on June 24, 2020, 01:17:15 PM
I didn't just want to order the structure, as you see number 24 and on the same line as the karma symbol (positive / negative) I wanted to put it under the center
Title: Re: fix karma images
Post by: Antechinus on June 24, 2020, 05:19:44 PM
Ok, just to check, because most of us don't read Italiano:

grazie ricevuti = thanks received
ringraziato = thanked
testo personale = personal text
questione di tempo = matter of time (I assume Google has this wrong :) )

Is karma "grazie ricevuti", or is karma "ringraziato"? Google confuses this when trying to translate it to English.

Do you want it to look like this?
Title: Re: fix karma images
Post by: goldenstudios on June 24, 2020, 05:21:40 PM
Yes like it
Title: Re: fix karma images
Post by: Antechinus on June 24, 2020, 05:27:17 PM
Try adding this to index.css:

a[href*="action=modifykarma;sa=applaud"]::before {display: block; clear: both; content:'';}

That should put the thumbs images to a new line. To centre the "24" I would need to see the code for the Thanks mod.

Edit: I just noticed your template is attached. I'll look at that. :)
Title: Re: fix karma images
Post by: Antechinus on June 24, 2020, 05:41:16 PM
Ok, forget the CSS. Try this template. :)
Title: Re: fix karma images
Post by: goldenstudios on June 24, 2020, 06:44:46 PM
not work :(
Title: Re: fix karma images
Post by: Antechinus on June 24, 2020, 07:10:54 PM
The template you just posted is your original one, not the one I edited. Did you try the one I edited?

If you did try the one I edited, I will need to see your CSS.
Title: Re: fix karma images
Post by: goldenstudios on June 24, 2020, 07:14:03 PM

I attached my last display to you in the previous post
Title: Re: fix karma images
Post by: Antechinus on June 24, 2020, 07:30:52 PM
Yes, I know. That is not the one I edited. It is the same template you started with. Did you test the one I edited?
Title: Re: fix karma images
Post by: goldenstudios on June 24, 2020, 07:36:55 PM
yes not work
Title: Re: fix karma images
Post by: Antechinus on June 24, 2020, 07:51:18 PM
Ok. I will need to see your CSS, or I will need a live link to the problem.
Title: Re: fix karma images
Post by: goldenstudios on June 24, 2020, 07:52:18 PM
send via pm
Title: Re: fix karma images
Post by: goldenstudios on June 24, 2020, 07:59:59 PM
css
Title: Re: fix karma images
Post by: Antechinus on June 24, 2020, 08:11:15 PM
Your karma_n class is floated to the right. Change this:

.karma_n
{
color: #575757;
font-size: 14pt;
font-weight: bold;
text-shadow: 0 1px 0 white;
float: right;
}


To this:

.karma_n
{
display: block;
text-align: center;
color: #575757;
font-size: 14pt;
font-weight: bold;
text-shadow: 0 1px 0 white;
}
Title: Re: fix karma images
Post by: goldenstudios on June 25, 2020, 03:21:02 AM
yes work thanks a lot :)