Changeset 10434

Timestamp:

11/10/2020 12:44:13 AM (4 years ago)

Author:

dd32

Message:

WordPress.org Theme: Fix the styling of ​https://wordpress.org/about/testimonials/ which had overlapping twitter embeds, not-centered embeds, and different WP vs Twitter card margins.

Props melchoyce for the report.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-main/page-about-testimonials.php (modified) (4 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-main/page-about-testimonials.php

@@ -65 +65 @@
 
     embed_holder_masonry = embed_holder_jq.masonry({
-        itemSelector: 'iframe, twitter-widget',
+        itemSelector: '',
         columnWidth: 372,
         gutter: 10,
@@ -79 +79 @@
                 conversation: 'none',
                 cards: 'hidden',
+
                 margin: 0,
                 width: 372
@@ -88 +89 @@
 
     embeds.wpembeds.forEach( function( wpembed ) {
-        var iframe = jQuery( '<iframe security="restricted" src="' + wpembed + '" width="372" height="500" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" class="wp-embedded-content"></iframe>' );
+        var >' );
 
-        iframe.on( 'load', function() {
+        // Extra margin top/bottom to match Twitter embeds (that have set a 0 margin)
+        embed.css( 'margin', '10px 0' );
+
+        embed.on( 'load', function() {
             embed_holder_masonry.masonry('reloadItems').masonry();
         });
 
-        embed_holder_jq.append( iframe );
+        embed_holder_jq.append(  );
     });
 
@@ -144 +148 @@
                     </div>
                     <div class="row">
-                        <div class="col-10">    
+                        <div class="col-10">   
                             <div  id="embeds"></div>
                         </div>