Bullet in <li> incorrectly rendered in Chrome/mac

[sje30]

Hi,

I'm not quite sure where the error here is, but I thought I'd ask first here. My colleague @lgatto has made some nice slides at http://lgatto.github.io/Quantitative-Proteomics-and-Data-Analysis/slides.html

On my mac laptop, on page 6, the bullets are rendered incorrectly on Chrome, yet appear fine in Safari. See screenshot here for the problem bullets in Chrome. I find the same problem with my own .Rmd file so I think there is an encoding issue somewhere, yet chrome Encoding reports it as UTF-8.

[edit: I see the same problem on Chrome/Android, so I don't think it is mac-specific.]

Any help?

Stephen

[gaborcsardi]

Yes, I can reproduce this. Very strange, though. Will experiment later today or tomorrow!

[lgatto]

I see the same behaviour on ubuntu, and this also happened on the Windows computer that was plugged in on the projector (but I forgot to open an issue - sorry).

[gaborcsardi]

I think this is a platform issue. Try re-creating the HTML on Ubuntu or OSX, that should work. I am not sure how to fix it on Windows, though.

[sje30]

I'm not sure it is a platform issue -- I see the error on mac, and @lgatto works on linux if I recall.

[lgatto]

I observe this on chromium (first screenshot), while it renders well on firefox (second screenshot), both on Ubuntu:

The same rendering issue happened on a Windows using Chrome. I haven't been able to test it with another browser on Windows. Could do next week though.

[sje30]

Thanks Laurent; setting self-contained: false is a workaround for now (see above refererence to issue in Shower.)

[sje30]

Ok, I think I got it now. @lgatto in case you are interested:

In my header i have:

output:
  rmdshower::shower_presentation:
    self_contained: true
    katex: false
    theme: ribbon
    css: my2-screen-4x3.css
---

and then my2-screen-4x3.css contains:

/* simply move the title up the page by decreasing padding */
.slide{position:relative;z-index:1;overflow:hidden;padding:46px 80px 0;width:1024px;height:768px;background:#fff;font-size:25px}

/* ensure ASCII encoding of bullet points */
.slide ul>li::before{padding-right:.5em;content:"\2022";}

you can see an example at http://sje30.github.io/talks/2016/uknode.html

[gaborcsardi]

@lgatto I just fixed this in the development branch. Can you please try it? Unfortunately the new version is not compatible with the old one, but I'll submit a pull request for you in a minute.

[lgatto]

@gaborcsardi - thanks for the PR. Updated rmdshower and all looks good!

[gaborcsardi]

@lgatto Great, thanks! I'll submit it to CRAN then.