Alterar aparência do widget de postadores

Detalhes da questão

Descrição

Código:

.module [summary="Top posters"] [title$="%"],
.module [summary="Top posters"] a[href^="/u"] + span,
.module [summary="Top posters"] [title$="%"] table {
    display: none;
}

.module [summary="Top posters"] a[href^="/u"] {
    font-size: 14px;
    font-weight: 700;
    color: #444;
}

.module [summary="Top posters"] [class^="row"] {
    display: block;
    width: 100%;
}

.module [summary="Top posters"] [title$="%"]::before {
    content: attr(title);
}

.module [summary="Top posters"] tr {
    margin-bottom: 1em !important;
    display: block !important;
}

está mostrando um resultado diferente abaixo. apenas verifique esta imagem

Código:

 
/****
 * Application: Avatar in: Top posters, Top posting users this week, Top posting users this month and Most active topic starters Widget!
 * Description: This application displays the members avatar in all widget of topic.
 * Version: 1.07022015-jq1.9.1 - Meni
 * Made and Optimizations by JScript - 2015/07/02
 * Copyright (c) 2015 JScript <jscriptbrasil at live dot com>
 * This work is free. You can redistribute it and/or modify it
 * under the terms of the WTFPL, Version 2
 **/
jQuery(function() {
  var oConfig = {
      sInfo: '<!--' +
        '* Application: Avatar in: Top posters, Top posting users this week, Top posting users this month and Most active topic starters Widget!' +
        '* Description: This application displays the members avatar in all widget of topic.' +
        '* Version: 1.07022015-jq1.9.1 - Meni' +
        '* Made and Optimizations by JScript - 2015/07/02' +
        '* Copyright (c) 2015 JScript <jscriptbrasil at live dot com>' +
        '* This work is free. You can redistribute it and/or modify it' +
        '* under the terms of the WTFPL, Version 2' +
        '-->',
      sDefaultAvatar: 'http://i78.servimg.com/u/f78/18/17/62/92/defaul10.png',
      sCSS: '<style>' +
        '.jsUserPhoto.topWidget {' +
        'float: left;' +
        'margin-top: 3px;' +
        'margin-right: 3px;' +
        'background: none repeat scroll 0 0 #FFFFFF;' +
        'border: 1px solid #D5D5D5 !important;' +
        'box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);' +
        'padding: 1px;' +
        '}' +
        '.topWidget .jsUserPhoto_mini {' +
        'height: 16px !important;' +
        'width: 16px !important;' +
        '}' +
        '</style>'
  };
 
  // Add CSS
  jQuery(oConfig.sCSS).insertBefore('body');
 
  // Show member avatar in Recent Topics Widget!
  var oTarget = $('#right, #left').find('td.genmed, div.module td, div.module.main .main-content td').find('a[href^="/u"]'),
      iLen = oTarget.length,
      index = 0,
      td = oTarget.parent();
 
  td.css('width', td.width() + 24);
 
  oTarget.prepend('<a class="jsUserPhoto topWidget" href="#" title="No avatar!"><img class="jsUserPhoto_mini" src="' + oConfig.sDefaultAvatar + '" alt="" /></a>');
 
  oTarget.each(function () {
      var oThis = $(this),
        container = oThis.find('.jsUserPhoto_mini'),
        storIMG = '',
        userUrl = '';
 
      if (oThis.length) {
        userUrl = oThis.attr('href');
        oThis.find('a.jsUserPhoto.topWidget').attr('href', userUrl).attr('title', oThis.text());
 
        storIMG = sessionStorage.getItem('_top_' + userUrl); // Read object from sessionStorage, more fast!
        if (storIMG) {
            container.attr('src', storIMG);
        } else {
            // if not, then only request per session!!!
            jQuery.get(userUrl, function(data) {
              storIMG = jQuery('#emptyidcc .row1.gensmall img:eq(0), #profile-advanced-right .module:first .inner img:eq(0), #profile-advanced-right .main-content img:first, #profile-advanced-right .box-content.profile.center img:first', data).attr('src');
              if (storIMG !== undefined) {
                  container.attr('src', storIMG);
                  // Saving object in sessionStorage
                  sessionStorage.setItem('_top_' + userUrl, storIMG);
              }
            });
        }
      }
  });
});

Código:

        .module [summary="Top posters"] [title$="%"],
        .module [summary="Top posters"] a[href^="/u"] + .gensmall,
        .module [summary="Top posters"] [title$="%"] table {
            display: none;
        }
        
        .module [summary="Top posters"] a[href^="/u"] {
            font-size: 14px;
            font-weight: 700;
            color: #444;
        }
        
        .module [summary="Top posters"] [class^="row"] {
            display: block;
            width: 100%;
        }
        
        .module [summary="Top posters"] [title$="%"]::before {
            content: attr(title);
        }
        
        .module [summary="Top posters"] tr {
            margin-bottom: 1em !important;
            display: block !important;
        }

Código:

.topWidget .jsUserPhoto_mini {
    border-radius: 50%;
}

Código:

.jsUserPhoto.topWidget {
    background: transparent;
    border-width: 0 !important;
    box-shadow: none;
}

Código:

        .jsUserPhoto.topWidget {
            background: transparent  !important;
            border-width: 0 !important;
            box-shadow: none  !important;
        }

Código:

       
        /****
        * Application: Avatar in: Top posters, Top posting users this week, Top posting users this month and Most active topic starters Widget!
        * Description: This application displays the members avatar in all widget of topic.
        * Version: 1.07022015-jq1.9.1 - Meni
        * Made and Optimizations by JScript - 2015/07/02
        * Copyright (c) 2015 JScript <jscriptbrasil at live dot com>
        * This work is free. You can redistribute it and/or modify it
        * under the terms of the WTFPL, Version 2
        **/
        jQuery(function() {
          var oConfig = {
              sInfo: '<!--' +
                '* Application: Avatar in: Top posters, Top posting users this week, Top posting users this month and Most active topic starters Widget!' +
                '* Description: This application displays the members avatar in all widget of topic.' +
                '* Version: 1.07022015-jq1.9.1 - Meni' +
                '* Made and Optimizations by JScript - 2015/07/02' +
                '* Copyright (c) 2015 JScript <jscriptbrasil at live dot com>' +
                '* This work is free. You can redistribute it and/or modify it' +
                '* under the terms of the WTFPL, Version 2' +
                '-->',
              sDefaultAvatar: 'http://i78.servimg.com/u/f78/18/17/62/92/defaul10.png',
              sCSS: '<style>' +
                '.jsUserPhoto.topWidget {' +
                'float: left;' +
                'margin-top: 3px;' +
                'margin-right: 3px;' +
                'background: none repeat scroll 0 0 #FFFFFF;' +
                'box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);' +
                'padding: 1px;' +
                '}' +
                '.topWidget .jsUserPhoto_mini {' +
                'height: 16px !important;' +
                'width: 16px !important;' +
                '}' +
                '</style>'
          };
       
          // Add CSS
          jQuery(oConfig.sCSS).insertBefore('body');
       
          // Show member avatar in Recent Topics Widget!
          var oTarget = $('#right, #left').find('td.genmed, div.module td, div.module.main .main-content td').find('a[href^="/u"]'),
              iLen = oTarget.length,
              index = 0,
              td = oTarget.parent();
       
          td.css('width', td.width() + 24);
       
          oTarget.prepend('<a class="jsUserPhoto topWidget" href="#" title="No avatar!"><img class="jsUserPhoto_mini" src="' + oConfig.sDefaultAvatar + '" alt="" /></a>');
       
          oTarget.each(function () {
              var oThis = $(this),
                container = oThis.find('.jsUserPhoto_mini'),
                storIMG = '',
                userUrl = '';
       
              if (oThis.length) {
                userUrl = oThis.attr('href');
                oThis.find('a.jsUserPhoto.topWidget').attr('href', userUrl).attr('title', oThis.text());
       
                storIMG = sessionStorage.getItem('_top_' + userUrl); // Read object from sessionStorage, more fast!
                if (storIMG) {
                    container.attr('src', storIMG);
                } else {
                    // if not, then only request per session!!!
                    jQuery.get(userUrl, function(data) {
                      storIMG = jQuery('#emptyidcc .row1.gensmall img:eq(0), #profile-advanced-right .module:first .inner img:eq(0), #profile-advanced-right .main-content img:first, #profile-advanced-right .box-content.profile.center img:first', data).attr('src');
                      if (storIMG !== undefined) {
                          container.attr('src', storIMG);
                          // Saving object in sessionStorage
                          sessionStorage.setItem('_top_' + userUrl, storIMG);
                      }
                    });
                }
              }
          });
        });

o avatar padrão arredondado também

Código:

.jsUserPhoto.topWidget {
    border-radius: 50% !important;
    background-color: white !important;
    border: 1px solid #fff !important;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.25), 0 -1px 1px rgba(0,0,0,0.1) !important;
    background-clip: padding-box !important;
    padding: 0;
    object-fit: cover;
    object-position: center;
}