Fix avatar and social icons with bulletproof rendering
Release / Build & publish plugin zip (push) Successful in 7s
Release / Build & publish plugin zip (push) Successful in 7s
Root cause of social icons rendering as alt text: wp_kses() stripped the 'data:' prefix from data: URIs in img.src, leaving a relative URL that 404s. Switched to real .svg files under assets/icons/ referenced via plugins_url() — kses passes img tags with relative URLs cleanly, and the icons load as standard images. Root cause of avatar still being cropped: layout-side issues with inline-styled <img> in a flex layout. Switched to a <span> with inline background-image, background-size: cover, background-position: center — no <img> element, no object-fit reliance, no way to crop wrong. Also removed the outer <a> wrapper around the .project-owner div (block-level element inside inline <a> is invalid HTML and was likely contributing to layout weirdness). The owner name is now an explicit <a> inside its own span. Reverted kses to the default wp_kses_post() since we're back to standard HTML elements only — no SVG, no data URIs, no inline styles that need a custom allowed list.
This commit is contained in:
@@ -141,15 +141,10 @@ if ( $last_updated ) {
|
||||
</div>
|
||||
|
||||
<?php if ( $settings['templates']['github_owner'] && $owner_avatar && $owner_name ) : ?>
|
||||
<a href="<?php echo esc_url( $browse_url ); ?>">
|
||||
<div class="project-owner">
|
||||
<span class="project-owner-avatar">
|
||||
<img src="<?php echo esc_url( $owner_avatar ); ?>" alt="<?php esc_attr_e( $owner_name ); ?>" class="owner-avatar" style="display:block;width:50px;height:50px;border-radius:50%;object-fit:cover;flex-shrink:0;margin:0;" />
|
||||
</span>
|
||||
<span class="project-owner-avatar" style="display:block;width:50px;height:50px;border-radius:50%;background-image:url('<?php echo esc_url( $owner_avatar ); ?>');background-size:cover;background-position:center center;flex-shrink:0;" aria-label="<?php echo esc_attr( $owner_name ); ?>" role="img"></span>
|
||||
<span class="project-owner-name">
|
||||
<strong>
|
||||
<a href="<?php echo esc_url( $owner_url ); ?>" target="_blank" rel="noopener noreferrer"><?php esc_html_e( $owner_name ); ?></a>
|
||||
</strong>
|
||||
<a href="<?php echo esc_url( $owner_url ); ?>" target="_blank" rel="noopener noreferrer"><?php echo esc_html( $owner_name ); ?></a>
|
||||
</span>
|
||||
<span class="project-owner-follow">
|
||||
<a class="button project-follow-button" href="<?php echo esc_url( $owner_url ); ?>" target="_blank" rel="noopener noreferrer"><?php esc_html_e( 'Follow', 'projects-wp' ); ?></a>
|
||||
|
||||
Reference in New Issue
Block a user