🧩 Plasmo Developers•14mo ago

Mantine Example is Deprecated

plasmo-with-mantine example is deprecated. Mantine v7.0 no longer uses emotion or emotionCache. I tried fixing by based on the Tailwind approach. It works well for the default Mantine, but not for custom themes and fonts:

import cssText from "data-text:@mantine/core/styles.css";
import "@mantine/core/styles.css";

export const getStyle = () => {
  const style = document.createElement("style")
  style.textContent = cssText
  return style
}

import cssText from "data-text:@mantine/core/styles.css";
import "@mantine/core/styles.css";

export const getStyle = () => {
  const style = document.createElement("style")
  style.textContent = cssText
  return style
}

Can someone help me update the plasmo-with-mantine example? Thanks! ✌️ Resources: - https://github.com/PlasmoHQ/examples/tree/main/with-mantine - https://mantine.dev/changelog/7-0-0/

GitHub

examples/with-mantine at main · PlasmoHQ/examples

🔰 Example projects that demonstrate how to use the Plasmo Framework and integrate with popular tools - PlasmoHQ/examples

Version v7.0.0 | Mantine

React components and hooks library with native dark theme support and focus on usability, accessibility and developer experience

3 Replies

phemartinOP•14mo ago

GitHub

[BUG] Import CSS to CSUI doesn't work as expected with Mantine · I...

What happened? I am using mantine to create a CSUI. I need to import @mantine/core/styles.css. Following the Import Stylesheet guide, it doesn't work well. The code: import { Button, Input, Man...

lab•14mo ago

Yup, they updated and removed emotion so we would have ot use a diff approach :d...

lab•14mo ago

ref: https://github.com/PlasmoHQ/plasmo/issues/773

GitHub

EXP | Update Mantine example · Issue #773 · PlasmoHQ/plasmo

What is the example you wish to see? ref: mantinedev/mantine#3268 Is there any context that might help us understand? Mantine updated their framework to remove emotion - we might want to add a MUI ...

Gaming

Programming

Mantine Example is Deprecated