ATProto Browser

{
  "text": "Here's a neat Tailwind v4 trick for easily applying overridable utilities without resorting to tailwind-merge or !important.\n\nSimply create a custom variant that targets a base CSS layer 💯",
  "$type": "app.bsky.feed.post",
  "embed": {
    "$type": "app.bsky.embed.images",
    "images": [
      {
        "alt": "CSS code:\n\n@custom-variant base {\n  @layer base {\n    @slot;\n  }\n}\n\nJSX code:\n\n<div className={`base:bg-red-500 ${props.className}`}>",
        "image": {
          "$type": "blob",
          "ref": {
            "$link": "bafkreiehqtjbeyveu2pqru6smvzelda2i4szbgwwyvb2wcqwvqwikxqrge"
          },
          "mimeType": "image/jpeg",
          "size": 69604
        },
        "aspectRatio": {
          "width": 869,
          "height": 358
        }
      }
    ]
  },
  "langs": [
    "en"
  ],
  "createdAt": "2025-03-06T22:27:04.671Z"
}