Problem with mobile comment view and MyCred

@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.

@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.