Automattic / themes

Free WordPress themes made by Automattic for WordPress.org and WordPress.com.
https://themeshaper.com
GNU General Public License v2.0
873 stars 350 forks source link

Natural: Twitter tweet embeds are cut off #3855

Open happychait opened 3 years ago

happychait commented 3 years ago

Steps to reproduce the behavior

  1. Activate the Natural theme on a Simple or Atomic site.
  2. Go to post or page editor.
  3. Paste a Tweet link in a Paragraph block on any post or page.

What I expected to happen

Tweet embeds correctly and the full tweet is shown.

What actually happened

  1. Lot of white space at the top.
  2. Tweet is truncated.

Is this specific to the applied theme? Which one?

Natural theme.

Does this happen on simple or atomic sites or both?

Both

Screenshot / Video: If applicable, add screenshots to help explain your problem.

image

happychait commented 3 years ago

Similar to https://github.com/Automattic/themes/issues/3542

Worked around with this custom CSS:

.post .wp-block-embed__wrapper iframe { 
min-height: 580px;
}
.post .wp-block-embed__wrapper {
padding-top: 0;
}
CodeAllNightNDay commented 2 years ago

The same issue came up for the site referenced in the opening post. 30653171-hc Tweet was cut off again for one that had more height.

.post .wp-block-embed-twitter iframe { min-height: 800px; } .post .wp-block-embed-twitter .wp-block-embed__wrapper { padding-top: 0; }

It seems that the CSS that sets the iframe height with an !important should be removed/made not !important.