search

staltz / rxmarbles

Interactive diagrams of Rx Observables
http://www.rxmarbles.com
BSD 3-Clause "New" or "Revised" License
4.21k stars 536 forks source link

Embedded diagram marble offset and font size #10

Open cvuorinen opened 9 years ago

cvuorinen commented 9 years ago

When using the embedded diagram in a reveal.js html slides the styles etc. somehow make the marbles appear offset to the right and also the font size off the text values inside the marbles is too big (or actually it's not set at all so the styles from outside "leak" in and make it too big).

Here is a screenshot: rxmarbles-bug

cvuorinen commented 9 years ago

In a blank html page without any styles or other markup the embedded diagram works fine, so I was able to get around this issue by using them through an iframe from the slides.

staltz commented 9 years ago

This is probably some global styles affecting the diagram. It looks like typical CSS namespacing problem. Could also be fixed by using the Shadow DOM with the <rx-marbles> element.

nadavwr commented 6 years ago 
rx-marbles {
    font-size: 16px;
    text-align: left;
}

should fix it