Skip to main content
New: Stack Overflow For Agents. The next generation of knowledge exchange. Learn more

Return to Question

Post Timeline

added 134 characters in body; edited tags
Source Link
rozsazoltan
rozsazoltan

Tailwind Displaying color decorators on Javascript strings?boxes next to the TailwindCSS class names indicating the color, anywhere such as in class or className attributes

Is it possible to getdisplay color decorators for tailwind classes on Javascript stringsboxes before any TailwindCSS class name related to colors, regardless of where I write the TailwindCSS class name?

I've noticed that this works perfectly in CSS files or within the HTML border-error-400class has a preview when used inor <div className>className, but not in the attributes (e.g. constborder-error-400 stringin second photo).

I'd like that same previewI would assume this should work across the entire code, but I was disappointed to come up on stringsfind that have one, as shown in the attached screenshot, the color indicator box doesn't appear when a TailwindCSS color class is written as the value of a JS codeobject.

It doesn't work anywhere Working in className="..." attribute
not working here working here

Tailwind color decorators on Javascript strings?

Is it possible to get color decorators for tailwind classes on Javascript strings?

border-error-400 has a preview when used in <div className>, but not in the const string.

I'd like that same preview to come up on strings that have one in JS code.

It doesn't work anywhere Working in className="..." attribute
not working here working here

Displaying color boxes next to the TailwindCSS class names indicating the color, anywhere such as in class or className attributes

Is it possible to display color boxes before any TailwindCSS class name related to colors, regardless of where I write the TailwindCSS class name?

I've noticed that this works perfectly in CSS files or within the HTML class or className attributes (e.g. border-error-400 in second photo).

I would assume this should work across the entire code, but I was disappointed to find that, as shown in the attached screenshot, the color indicator box doesn't appear when a TailwindCSS color class is written as the value of a JS object.

It doesn't work anywhere Working in className="..." attribute
not working here working here
added 134 characters in body; edited tags
Source Link
rozsazoltan
rozsazoltan

Is it possible to get color decorators for tailwind classes on Javascript strings?

border-error-400 has a preview when used in <div className>, but not in the const string.

I'd like that same preview to come up on strings that have one in JS code.

enter image description here

It doesn't work anywhereWorking in className="..." attribute
not working hereworking here

Is it possible to get color decorators for tailwind classes on Javascript strings?

border-error-400 has a preview when used in <div className>, but not in the const string.

I'd like that same preview to come up on strings that have one in JS code.

enter image description here

Is it possible to get color decorators for tailwind classes on Javascript strings?

border-error-400 has a preview when used in <div className>, but not in the const string.

I'd like that same preview to come up on strings that have one in JS code.

It doesn't work anywhereWorking in className="..." attribute
not working hereworking here
Source Link
Harry Northover
Harry Northover

Tailwind color decorators on Javascript strings?

Is it possible to get color decorators for tailwind classes on Javascript strings?

border-error-400 has a preview when used in <div className>, but not in the const string.

I'd like that same preview to come up on strings that have one in JS code.

enter image description here