menu

emotion

Emotion is a css-in-js library focused on performance and developer experience

Channels
# All channels
view-forward
# General
view-forward
# Development
view-forward
# Help
view-forward
# Off Topic
view-forward
Team
Posts
Members
Info

v11: @emotion/css vs @emotion/react, in Gatsby

I've been playing around with v11, planning a utility/atomic style framework implementation, and finding I prefer the ergonomics of @emotion/css and className (Vanilla), to @emotion/react and the css prop. Are there disadvantages or hurdles I have to overcome re SSR etc if I…

thumbsup
0
message-simple
6

Emotion 10

Was playing around with the new version (10) of emotionjs last night. I've gotta say it's quite disappointing, css can no longer be used as is, plus with the jsx pragma and css prop you must use. It all just feels bad 😑. From what I can tell this is an effort to make the CSS…

thumbsup
7
message-simple
10

Next.js example and CacheProvider (v11)

In the nextjs example, why does the custom _app use the CacheProvider? https://github.com/zeit/next.js/blob/canary/examples/with-emotion-11/pages/_app.js#L10

thumbsup
0
message-simple
4

Emotion with Typescript Theme Declaration File

I am converting to TS and in the past have used Styled Components and created a theme declaration which allows for Declaration Merging. The Emotion TS docs appear to be outdated because there is a merged PR which apparently gives support for this functionality:…

thumbsup
0
message-simple
2

Is it possible to make the Global feature respect component scoping?

I'm using emotion in a react app. I like the Global feature because I don't have to manually insert emotion styling into each element via the css prop anymore. The one Global element takes care of styling everything. But the problem is that global applies to every single…

thumbsup
0
message-simple
1

Emotion rendering modals from an iframe into the parent doesn't include styles.

I found someone's example on using Emotion with iframes. I simply created a Portal element and rendered Header in there to show the issue I'm having right now: https://codesandbox.io/s/scopeprovider-and-frameprovider-jfg02 The document.body refers to the parent's document. This…

thumbsup
2
message-simple
2

CSS vs Object Styles

This might seem like an obvious question to some but is there a nice comparison of the pros and cons of using CSS or object styles? Both make sense to me to use for different reasons. Interested to see a side-by-side comparison on multiple levels (usage patterns, performance,…

thumbsup
1
message-simple
1

React Native - @emotion/primitives or @emotion/native

I'm starting a new project in React Native, to develop an iOS + Android app. Nothing fancy like Sketch or react-native-web. I'm struggling to see the difference between the two packages emotion/primitives and emotion/native, can anybody tell me what they are? Even their…

thumbsup
1
message-simple
5

Slack link not working on website

402 Payment declined. Any other way to get in there? :)

thumbsup
0
message-simple
0

Approach to Testing Themed Components in Enzyme with Emotion 10

With the update to version 10, channel and createBroadcast have been removed from the emotion-theming API, likely due to the change in using context. I think this is a good change, but I have relied on those API functions in the past to provide theme to Enzyme shallow and mount…

thumbsup
2
message-simple
5