Fork me on GitHub
#reagent
<
2019-12-13
>
lilactown20:12:37

(moving from #shadow-cljs) @hlolli you say “this isn’t working” but you didn’t try what I wrote

hlolli20:12:54

so I tried (r/create-element "input" #js {:type "submit" :className my-emotion-css})

(def my-emotion-css ^js
  (css "
background-color: red;
"))

lilactown20:12:11

why would you use create-element?

lilactown20:12:19

and you’re passing it into :css, which will do nothing

hlolli20:12:32

but I get

You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).

hlolli20:12:41

ah yes, sorry, with className too

lilactown20:12:31

you’re probably using the @emotion/core package

hlolli20:12:35

same error (just a string that it returns because of .toString)

lilactown20:12:37

use the emotion npm package instead

lilactown20:12:43

@emotion/core and the other @emotion packages are aimed at React JS development using babel. don’t use them with CLJS, it will be more difficult

hlolli20:12:46

that's true, im installing it. I copied what I was doing in js.

lilactown20:12:02

the emotion package is framework and build tool agnostic

hlolli20:12:27

I guess you use emotion @lilactown?

lilactown20:12:45

yeah we use it at work

hlolli20:12:49

bingo! works

hlolli20:12:53

easy as this

hlolli20:12:58

css prop, meh, doesn't matter 🙂

hlolli20:12:43

thanks a lot, you saved a potential time waste disaster, beer += 1

lilactown20:12:25

you’re welcome. happy hacking!

🍻 1