dimsey
dimsey
Explore posts from servers
DIAdiscord.js - Imagine an appPD🧩 Plasmo Developers
PostsComments
PD🧩 Plasmo Developers
Created by dimsey on 9/27/2023 in #👾extension
Next js 13.2 template
Is it possible to run a server with this?
2 replies
PD🧩 Plasmo Developers
Created by dimsey on 9/27/2023 in #🔰newbie
Custom plasmo css
Does plasmo have custom classes prebuilt in? Like plasmo-fixed or how does that work? Referrring to this (https://github.com/PlasmoHQ/examples/tree/main/with-tailwindcss)
3 replies
PD🧩 Plasmo Developers
Created by dimsey on 9/27/2023 in #👾extension
Tailwinds with content.tsx
// content.tsx
import cssText from "data-text:~style.css"
import type { PlasmoCSConfig } from "plasmo"

export const config: PlasmoCSConfig = {
  matches: ["https://www.google.com/*"]
}

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

const PlasmoOverlay = () => {
  return (
    <div className="w-96 h-96 text-red-500 bg-red-500">
      <button className="w-48 h-48 bg-red-300">hello</button>
    </div>
  )
}

export default PlasmoOverlay
// content.tsx
import cssText from "data-text:~style.css"
import type { PlasmoCSConfig } from "plasmo"

export const config: PlasmoCSConfig = {
  matches: ["https://www.google.com/*"]
}

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

const PlasmoOverlay = () => {
  return (
    <div className="w-96 h-96 text-red-500 bg-red-500">
      <button className="w-48 h-48 bg-red-300">hello</button>
    </div>
  )
}

export default PlasmoOverlay
This doesn't change the CSS at all. What can I do to debug this? This is a fresh project with a content.tsx and tailwinds in style.css. Tailwinds works on the normal popup page but not here. Any help would be greatly appreciated! Thank you!
7 replies