Skip to content

[Feature Proposal] Content utility for generating pseudo elements #1306

Closed
@scottbedard

Description

@scottbedard

The problem

With Tailwind, it feels ugly when I have to "leave Tailwind", and fall back to writing traditional css. One situation where I frequently find myself doing this adding empty content attributes to generate pseudo elements.

.selector:before {
  content: '';
  @apply block h-8 w-8 ...;
}

While not being the biggest deal, the mixed approaches feels off to me. I think it would be handy and more ergonomic if we could do something like this...

.selector:before {
  @apply block content-empty h-8 w-8 ...;
}

Pros

  • Lets us keep things concise and on one line
  • Avoid mixed styling (traditional css vs tailwind utilities)

Cons

  • One more thing to learn
  • Would be somewhat useless outside the context of pseudo elements

Again, not the most important utility, but I've found myself needing it on multiple projects, and think if would be handy to have out of the box.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions