Notifications
Clear all

Paid Addons Support Forum Only

Please note, that here we only support Paid Addons issues and questions.

gVectors Support staff works from 6am to 6pm (GMT+0)

All questions related to wpForo and wpDiscuz free plugins should be asked in the corresponding plugin support forum:

 

wpDiscuz Support Forum   wpForo Support Forum

Problem with mobile comment view and MyCred  


Johannes
Posts: 34
(@johannes)
Eminent Member
Joined: 1 year ago

Hey,

in mobile view (max width 800px) the comment view is broken when using MyCred badges. How would I fix that?

Best

Johannes

broken comment view

 

5 Replies
Astghik
Posts: 4191
Admin
(@astghik)
Support Team
Joined: 3 years ago

Hi @johannes,

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

Reply
Johannes
Posts: 34
(@johannes)
Eminent Member
Joined: 1 year ago

You can check it here: https://www.meeplemansion.de/spiele/strategiespiele/top-10-die-besten-strategiespiele/

I sent you the login data via pm

Johannes

Reply
1 Reply
Astghik
Admin
(@astghik)
Joined: 3 years ago

Support Team
Posts: 4191

@johannes,

The issue is solved by our developers. We've added the CSS code in the "Custom CSS code" textarea. 

You'll need to remove those codes after the plugin update. 

The CSS code added by us is provided below:

@media screen and (max-width: 800px){
#wpcomm .wc-comment{
display: flex;
flex-wrap: wrap;
}
#wpcomm .wc-comment > *{
flex: 1 1 100%;
}
#wpcomm .wc-comment .wc-comment-left{
flex: 0 0 20%;
}
#wpcomm .wc-thread-wrapper .wc-comment .wc-comment-right{
flex: 0 0 80%;
}
#wpcomm .wc-reply .wc-comment-header, #wpcomm .wc-comment-header{
margin-left: 0;
}
#wpcomm .wc-comment-header{
padding-left: 8px;
}
#wpcomm .wc-comment .wc-comment-left .avatar, #wpcomm .wc-reply.wc-comment .wc-comment-left .avatar{
margin: auto !important;
float: none !important;
}
#wpcomm .wpdiscuz-mycred-rank-wrap, #wpcomm .wpdiscuz-mycred-badges-wrap, #wpcomm .wpdiscuz-mycred-points-wrap{
text-align: center;
}
}

Please try on incognito mode. Because mobile browsers have a hard cache, you'll not be able to see the change immediately.

 

Reply
Johannes
Posts: 34
(@johannes)
Eminent Member
Joined: 1 year ago

Hey,

It looks a bit better but it still has a problem. Now the avatar is far too small.

Johannes

css bug

 

Reply
1 Reply
Elvina
Moderator
(@elvina)
Joined: 10 months ago

Noble Member
Posts: 1177

@johannes,

Now the avatar is far too small

Please note that in the mobile view the avatars are small.

We've seen the small issues with the alignment, to solve the issue please use the following code: 

@media screen and (max-width: 420px){
#wpcomm .wpdiscuz-mycred-badges-wrap, #wpcomm .wpdiscuz-mycred-points-wrap, #wpcomm .wpdiscuz-mycred-rank-wrap{
text-align: center !important;
}
#wpcomm .wc-comment-header {
margin-left: 0 !important;
}
#wpcomm .wpdiscuz-mycred-wrap{
padding-top: 45px;
}
}

However, this will be fixed in the next version update. You'll just need to wait a bit.

 

Reply
Share: