Skip to content
This repository was archived by the owner on Aug 29, 2025. It is now read-only.

Select multiple classes and show combined outputΒ #48

@luckasRanarison

Description

@luckasRanarison

Discussed in #47

Originally posted by willdavidow August 30, 2024
I know there are some Neovim plugins out there that do this sort of thing, but it would be cool to have a feature (or maybe it's already possible somehow?) where you have string of tailwind classes, e.g.:

flex h-[84px] flex-row items-start justify-start gap-x-12

and instead of hovering over each individual class to see its value, if you could select n classes and see the combined output of those classes.

Current functionality (using above class string as an example)

hover over flex and see:

.flex {
  display: flex;
}

hover over h-[84px] and see:

.h-\[84px\] {
  height: 84px;
}

Proposed Functionality

It would be very useful to be able to visually select flex h-[84px] and see:

*combined* {
  display: flex;
  height: 84px;
}

Or select the entire class string and see:

*combined* {
  display: flex;
  height: 84px;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  column-gap: 3rem; /* 48px */
}
```</div>

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions