Allow classes like a:b/c with @@

[xukai92]

Tailwind CSS (https://tailwindcss.com/) is a perfect match for @@ but it has a many class names like hover:basis-1/2 that the parser failed to reconize due to pre-matured end-of-token.
This PR fixes this issue.

[tlienart]

Nice one, thanks @xukai92, happy to add that, also this should still work fine with

Franklin.jl/src/converter/markdown/blocks.jl

Lines 39 to 40 in 43e23a1

	# parse @@c1,c2,c3 as class="c1 c2 c3"
	return html_div(replace(divname, ","=>" "), cont)

so should be good. I'll add a note in the docs and will do a patch release with it.

Ps: will be good to see what you do with tailwind, do you already have a repo?

[xukai92]

I'm currently re-building the Turing.jl website using Franklin.jl.
Temporary repo at https://github.com/xukai92/beta.turing.ml and can be viewed at https://xukai92.github.io/beta.turing.ml/.
The site is still at a very initial stage but you can see how I'm using Tailwind in the index.md file---I think it works really nice with the @@ syntax.

[tlienart]

Nice one, so you'll use the base tailwind.min.css and then use purgecss at a later stage? I'm experimenting with all this in another repo so we can share knowledge if you want. I'll keep an eye on your repo for sure :)

[tlienart]

Ah no I see https://github.com/xukai92/beta.turing.ml/commit/51cf53527454bc8110d97dc66fa9f79b65406172

I played a bit with tailwindcss but wasn't using their JS build, rather just using the full CSS for development, then using purgecss to trim it down to a few kb post build.

[xukai92]

I think what you do is the recommanded way from Tailwind's offical website---I simply did the easiest thing to get started.
Can you set it up to purgecss when deployment?

[tlienart]

So what I do (I personally prefer bootstrap but tried tailwind to check):

• have the full blown mega CSS file in _css (the tailwind one is something ridiculous like 3MB)
• do stuff locally until happy
• in the deploy script after the optimize, use NodeJS to install purgecss then call it

Note: with tailwind the purgecss default extractor doesn't work well, you have to change the regex a little bit to include :

This is the config file I used with the tailwind case: https://github.com/tlienart/GLEPlot.jl/blob/docs2/docs2/tailwind.config.js

The result is usually under 10kb

[xukai92]

That's super useful! Thanks for sharing this!