[elm-discuss] Add css classes to existing html nodes

[e***@gmail.com]

Hallo Elm users,

I'm creating my first app with Elm, and I'm really enjoying it. I'm using
the markdown package to generate html from user input. I'd like to add css
classes to certain (i.e. to tables) elements generated by this library. I
didn't find a way to do this. Is this possible?

Thank you and regards
Eike

[Peter Damoc]

Hi Eike and welcome to Elm.

You could add some kind of a class to the div that's holding the markdown
generated html and use that as a selector.

If you need something more complex than that, you might need to use html
inside the markdown

Here is how to do both:
https://ellie-app.com/3r5tc7YsmmCa1/1

Post by e***@gmail.com
Hallo Elm users,
I'm creating my first app with Elm, and I'm really enjoying it. I'm using
the markdown package to generate html from user input. I'd like to add css
classes to certain (i.e. to tables) elements generated by this library. I
didn't find a way to do this. Is this possible?
Thank you and regards
Eike
--
You received this message because you are subscribed to the Google Groups
"Elm Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an
For more options, visit https://groups.google.com/d/optout.

[e***@gmail.com]

Hello Peter,

thank you very much for your reply and example! I think option 2 doesn't
work for me, because I render user input and using “real” html in markdown
would defeat the purpose of creating tables with markdown. I also think,
the first option is sadly not working for me either. I'm sorry for not
being clear enough in my fist mail. I actually would like to add existing
classes (i.e. the semantic-ui classes "ui table") to all tables that were
generated by markdown. I don't want to mess with CSS myself (I'm not a
frontend dev and really bad at it I'm afraid).

I guess I could run via Elm's command external javascript that finds all
tables within the markdown generated markup and then add these classes? I
hoped I could stay within Elm, though.

Kind regards
Eike

Post by Peter Damoc
Hi Eike and welcome to Elm.
You could add some kind of a class to the div that's holding the markdown
generated html and use that as a selector.
If you need something more complex than that, you might need to use html
inside the markdown
https://ellie-app.com/3r5tc7YsmmCa1/1

Post by e***@gmail.com
Hallo Elm users,
I'm creating my first app with Elm, and I'm really enjoying it. I'm using
the markdown package to generate html from user input. I'd like to add css
classes to certain (i.e. to tables) elements generated by this library. I
didn't find a way to do this. Is this possible?
Thank you and regards
Eike
--
You received this message because you are subscribed to the Google Groups
"Elm Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an
For more options, visit https://groups.google.com/d/optout.

--
There is NO FATE, we are the creators.
blog: http://damoc.ro/

[Pi]

Hi Eike!
Have you had a look at the package pablohirafuji/elm-markdown? It's a pure
Elm implementation of a Markdown parser where you can customize how HTML
gets rendered.
See https://github.com/pablohirafuji/elm-markdown#customization.
I'm not sure whether the lib supports tables at all since they aren't
mentioned anywhere in the docs.

Anyway, give it a try!

Post by e***@gmail.com
Hello Peter,
thank you very much for your reply and example! I think option 2 doesn't
work for me, because I render user input and using “real” html in markdown
would defeat the purpose of creating tables with markdown. I also think,
the first option is sadly not working for me either. I'm sorry for not
being clear enough in my fist mail. I actually would like to add existing
classes (i.e. the semantic-ui classes "ui table") to all tables that were
generated by markdown. I don't want to mess with CSS myself (I'm not a
frontend dev and really bad at it I'm afraid).
I guess I could run via Elm's command external javascript that finds all
tables within the markdown generated markup and then add these classes? I
hoped I could stay within Elm, though.
Kind regards
Eike

Post by Peter Damoc
Hi Eike and welcome to Elm.
You could add some kind of a class to the div that's holding the markdown
generated html and use that as a selector.
If you need something more complex than that, you might need to use html
inside the markdown
https://ellie-app.com/3r5tc7YsmmCa1/1

Post by e***@gmail.com
Hallo Elm users,
I'm creating my first app with Elm, and I'm really enjoying it. I'm
using the markdown package to generate html from user input. I'd like to
add css classes to certain (i.e. to tables) elements generated by this
library. I didn't find a way to do this. Is this possible?
Thank you and regards
Eike
--
You received this message because you are subscribed to the Google
Groups "Elm Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send
For more options, visit https://groups.google.com/d/optout.

--
There is NO FATE, we are the creators.
blog: http://damoc.ro/

[e***@gmail.com]

Hi Pi,
thank you! I didn't know about this library, this is very interesting. I'll
have a look at it.

Regards
Eike

Post by Pi
Hi Eike!
Have you had a look at the package pablohirafuji/elm-markdown? It's a pure
Elm implementation of a Markdown parser where you can customize how HTML
gets rendered.
See https://github.com/pablohirafuji/elm-markdown#customization.
I'm not sure whether the lib supports tables at all since they aren't
mentioned anywhere in the docs.
Anyway, give it a try!

Post by e***@gmail.com
Hello Peter,
thank you very much for your reply and example! I think option 2 doesn't
work for me, because I render user input and using “real” html in markdown
would defeat the purpose of creating tables with markdown. I also think,
the first option is sadly not working for me either. I'm sorry for not
being clear enough in my fist mail. I actually would like to add existing
classes (i.e. the semantic-ui classes "ui table") to all tables that were
generated by markdown. I don't want to mess with CSS myself (I'm not a
frontend dev and really bad at it I'm afraid).
I guess I could run via Elm's command external javascript that finds all
tables within the markdown generated markup and then add these classes? I
hoped I could stay within Elm, though.
Kind regards
Eike

Post by Peter Damoc
Hi Eike and welcome to Elm.
You could add some kind of a class to the div that's holding the
markdown generated html and use that as a selector.
If you need something more complex than that, you might need to use html
inside the markdown
https://ellie-app.com/3r5tc7YsmmCa1/1

Post by e***@gmail.com
Hallo Elm users,
I'm creating my first app with Elm, and I'm really enjoying it. I'm
using the markdown package to generate html from user input. I'd like to
add css classes to certain (i.e. to tables) elements generated by this
library. I didn't find a way to do this. Is this possible?
Thank you and regards
Eike
--
You received this message because you are subscribed to the Google
Groups "Elm Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send
For more options, visit https://groups.google.com/d/optout.

--
There is NO FATE, we are the creators.
blog: http://damoc.ro/

['Rupert Smith' via Elm Discuss]

Post by Pi
Hi Eike!
Have you had a look at the package pablohirafuji/elm-markdown? It's a pure
Elm implementation of a Markdown parser where you can customize how HTML
gets rendered.
See https://github.com/pablohirafuji/elm-markdown#customization.
I'm not sure whether the lib supports tables at all since they aren't
mentioned anywhere in the docs.

I'll have to try that. I notice that the evanc/elm-markdown package
produces runtime errors sometimes if the markdown is malformed - it wraps
some js library and I get the impression it was just a quick hack to get
something working. The pure elm one, especially with greater customization
is a lot more appealing.