fix and simplify iframe styles

[Commandtechno]

trafficstars

Description

Removes random white background on iframes which is visible in dark mode

Fixes weird sizing/padding issues with iframes on https://react-notion-x-demo.transitivebullsh.it/5d4e290ca4604d8fb809af806a6c1749, especially on mobile. These changes apply a 100px padding on either side like how notion does it. For regular sized iframes, they just fill their container because of the min-width: 100%.

Re https://github.com/NotionX/react-notion-x/pull/285#discussion_r869735804: This removes the need for .notion-asset-wrapper-full because https://github.com/NotionX/react-notion-x/blob/master/packages/react-notion-x/src/components/asset.tsx#L62-L66 extends full width embeds like the figma one, and https://github.com/NotionX/react-notion-x/blob/master/packages/react-notion-x/src/components/asset.tsx#L90-L92 for embeds with a defined width like the spotify podcast one. The 100px padding still applies from the parent element (notion-asset-wrapper).

Notion Test Page ID

5d4e290ca4604d8fb809af806a6c1749

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
react-notion-x	✅ Ready (Inspect)	Visit Preview	May 11, 2022 at 11:02PM (UTC)
react-notion-x-minimal-demo	✅ Ready (Inspect)	Visit Preview	May 11, 2022 at 11:02PM (UTC)