Mirror of forum.nim-lang.org

5989 :: Styling Karax app

• jjude (orginal) [2020-02-26T11:12:27+01:00] view original

  I'm starting with Karax apps. Gone through some of the introductory examples. How do you style these especially with things like Bootstrap or other CSS frameworks?

---

• Araq (orginal) [2020-02-26T11:55:22+01:00] view original

  Well, you can simply do it like everywhere else, Karax produces a .js file, you include it into your .html file, the .html file can reference a style sheet.

---

• jjude (orginal) [2020-02-26T14:07:59+01:00] view original

  Thanks @Araq.

  1. I see that this forum uses Spectre.css. But there is no mention of this css in the codebase itself. How did you (or whoever is the author) did it? I see a mock folder. Is it that you mocked the htmls, generated css and linked it back to the generated html?
  2. If the process is more like #1 then how are the layouts and styling happen during development? Wouldn't it be a blind process without really knowing how the end result will look like? In js frameworks like vue and react, you can style within the components itself so during the development the developer can see the styles. Is that possible with Karax?

---

• juancarlospaco (orginal) [2020-02-26T14:49:55+01:00] view original

  https://jenil.github.io/bulmaswatch

  Spectre is awesome but no themes.

---

• jjude (orginal) [2020-02-26T14:58:54+01:00] view original

  @juancarlospaco: I am not looking for css themes. I use tachyons and am happy with it. I want to know how to use these within Karax during development.

---

• enthus1ast (orginal) [2020-02-26T15:16:22+01:00] view original

  Write karax code that generates a dom, add classes and id's etc. to your elements , then you use css to style the dom elements.

  you load the css in the html (not from karax), you could if you really like create a link element from karax, but i would just write it in the html , then when the dom gets rendered by karax the style is applied.

---

• mikebelanger (orginal) [2020-02-26T17:02:10+01:00] view original

  Like enthus1ast, I assumed it was just a matter of adding the tachyons class names to whatever file you'd compile to js. Provided you include the tachyons CSS, it should work.

  That said, I haven't actually tried this myself. So I'm interested in seeing the results. I'm a fan of both tachyons and nim.

---

• kidandcat (orginal) [2020-02-26T18:22:21+01:00] view original

  See my personal website for an example: https://github.com/kidandcat/kidandcat.me

---