[refactor] Remove direct usage of Theme from "SpaceProfile.tsx"

[thisislawatts]

Remove the following

// TODO: Remove direct usage of Theme
import { preciousPlasticTheme } from 'oa-themes'
const theme = preciousPlasticTheme.styles

At the moment we are importing the theme object directly and accessing its style properties. We should avoid doing this and instead make use of sx property available on all ThemeUI components to load these values out of the theme definition.

Read more about it here:

The sx prop lets you add any valid CSS to an element, while using values from your theme to keep styles consistent. You can think of the style object that the sx prop accepts as a superset of CSS. https://theme-ui.com/sx-prop

The aim should be for there to be no visual differences. However there may be circumstances where this would introduce better visual consistency across the UI. Feel free to reach out on Discord if you think you have found one of those scenarios.

Here's an example where the same change has been made, although I would call out that this specific file required more work than most 🤗 https://github.com/ONEARMY/community-platform/pull/2282

[benfurber]

I'll give this a go please.

I'm a little rusty so I hope I won't have too many questions for you - I'll study #2282. :)

[AlfonsoGhislieri]

Thanks @benfurber, assigning you to this!

[benfurber]

For the scope of this. Is your preference to remove all use of @emotion/styled and use sx fully or just make the minimal changes to remove the call to the theme object?

[AlfonsoGhislieri]

For the scope of this. Is your preference to remove all use of @emotion/styled and use sx fully or just make the minimal changes to remove the call to the theme object?

Yes the preference here would be to go away from using Emotion in favour of Theme UI, in order to streamline things. The fact that we are using both is a little confusing and unecessary! If you could work on that it would be much appreciated thanks! :-)

[onearmy-bot]

:tada: This issue has been resolved in version 1.70.0 :tada:

The release is available on GitHub release

Your semantic-release bot :package::rocket: