Rank and Badge  


KWISOO
Posts: 21
(@kwisoo)
Eminent Member
Joined: 7 months ago

Hi I'm using an myCred extension.
As you can see from the picture below. The rank image is so big. The badge image is so small. Is it like this? Can not you change size better?

wpdiscuz 11

Topic Tags
9 Replies
Astghik
Posts: 3454
Admin
(@astghik)
Support Team
Joined: 2 years ago

Hi @kwisoo,

Do the ranks and badges have the same size on other pages? 

Reply
8 Replies
KWISOO
(@kwisoo)
Joined: 7 months ago

Eminent Member
Posts: 21

yes.

Also. It's more serious on the mobile.

 

wpdiscuz 12

Reply
Astghik
Admin
(@astghik)
Joined: 2 years ago

Support Team
Posts: 3454

Please leave some example URL to allow us to check it. 

Reply
KWISOO
(@kwisoo)
Joined: 7 months ago

Eminent Member
Posts: 21

Here it is.

https://nlpericksonian.com/2019/03/22/hello-world/

Reply
Astghik
Admin
(@astghik)
Joined: 2 years ago

Support Team
Posts: 3454

@kwisoo,

Please let us know have you removed the myCRED integration code form active theme's functions.php file? 

Reply
KWISOO
(@kwisoo)
Joined: 7 months ago

Eminent Member
Posts: 21

Yes. Because the code had an error that did not display an image.

You can see my inquiry below.

https://gvectors.com/forum/mycred-integration/problems-with-badges/paged/2/#post-15049

Reply
Astghik
Admin
(@astghik)
Joined: 2 years ago

Support Team
Posts: 3454

ok,

Please add the following CSS code in Custom CSS code textarea, located in Dashboard > Comments > Settings > Styling admin page. Delete all caches and check again: 

#wpcomm .wpdiscuz-mycred-rank-wrap img {
width: 32px !important;
}

@media screen and (max-width: 420px){
#wpcomm .wpdiscuz-mycred-wrap{
margin-left: 17px !important;
}
}
Reply
KWISOO
(@kwisoo)
Joined: 7 months ago

Eminent Member
Posts: 21

Thank you.
It looks right on PC.
But it doesn't look right on the mobile.

Please look to the attached file.

wpdiscuz mobile

url : https://nlpericksonian.com/2019/03/22/hello-world/

Reply
Astghik
Admin
(@astghik)
Joined: 2 years ago

Support Team
Posts: 3454

Hi @kwisoo,

yes, I see. Please remove the code I've provided in the previous post and add this one:

#wpcomm .wpdiscuz-mycred-rank-wrap img {
width: 32px !important;
}
@media screen and (max-width: 420px){
#wpcomm .wpdiscuz-mycred-wrap {
margin-left: 13px !important;
margin-top: 52px !important;
}
}
div.wc-comment {
display: flex;
}

@media screen and (max-width: 800px){
#wpcomm .wc-comment-header {
margin-left: 0;
}
}
Reply
Share:
Green
Default
Pear
Black Emo
{green}:grinning:
{green}:wink:
{green}:face:
{green}:inlove:
{green}:sweaty:
{green}:surprised:
{green}:lovekiss:
{green}:laugh:
{green}:formalsmile:
{green}:displeased:
{green}:cool:
{green}:resent:
{green}:nerd:
{green}:screaming:
{green}:amazed:
{green}:sad:
{green}:deceitful:
{green}:starryeyes:
{green}:evil:
{green}:shocked:
{green}:tears:
{green}:sulky:
{green}:smile:
{green}:vomited:
{green}:hi:
{green}:afraid:
{green}:crazy:
{green}:rabid:
{green}:fighting:
{green}:nonoise:
{green}:blushed:
{green}:idontknow:
{green}:scared:
{green}:razz:
{green}:kiss:
{green}:eat:
{green}:shutmouth:
{green}:gape:
{green}:suspicious:
{green}:laughingoutloud:
{green}:bruise:
{green}:crying:
{green}:pray:
{green}:serious:
{green}:excitement:
:)
:d
:wink:
:mrgreen:
:neutral:
:twisted:
:arrow:
:shock:
:???:
:cool:
:evil:
:oops:
:razz:
:roll:
:cry:
:eek:
:lol:
:mad:
:sad:
:!:
:?:
:idea:
:hmm:
:beg:
:whew:
:chuckle:
:silly:
:envy:
:shutmouth:
{pear}:happy:
{pear}:smile:
{pear}:laugh:
{pear}:laughingoutloud:
{pear}:crying:
{pear}:exhausted:
{pear}:nerd:
{pear}:surprised:
{pear}:veryhungry:
{pear}:wink:
{blackemo}:laughtertotears:
{blackemo}:gift:
{blackemo}:love:
{blackemo}:inlove:
{blackemo}:shamefaced:
{blackemo}:heart:
{blackemo}:crazy:
{blackemo}:anguished:
{blackemo}:bruise:
{blackemo}:easymoney:
{blackemo}:exhausted:
{blackemo}:vampire:
{blackemo}:shutmouth:
{blackemo}:wink:
{blackemo}:carnival:
{blackemo}:flowers:
{blackemo}:hotdrink:
{blackemo}:party: