Támogatás keresése

Kerülje el a támogatási csalásokat. Sosem kérjük arra, hogy hívjon fel egy telefonszámot vagy osszon meg személyes információkat. Jelentse a gyanús tevékenységeket a „Visszaélés bejelentése” lehetőséggel.

További tudnivalók

A témacsoportot lezárták és archiválták. Tegyen fel új kérdést, ha segítségre van szüksége.

Can Firefox developer tools autocomplete tailwind/bootstrap classes?

  • 2 válasz
  • 1 embernek van ilyen problémája
  • 34 megtekintés
  • Utolsó üzenet ettől: Simon Walker

more options

When I develop web apps, I want to see adding and removing CSS classes in real time, like Chrome devtools do.

I use tailwind CSS heavily (https://tailwindcss.com/) which relies on adding CSS classes to change appearance. The same applies to bootstrap 4 styles.

Chrome devtools autoloads the CSS classes from tailwind, and shows updates to the page as I type. To try this out:

1. go to https://tailwindcss.com/ in chrome/chromium 2. open devtools (f12) 3. switch to the "Elements" tab 4. use the element picker to select the "Get Started" button 5. in the right hand panel, select the ".cls" icon 6. in the box that says "Add new class", type "text-" 7. notice the dropdown and if you change the value (e.g. to text-blue-500) the page updates

In firefox devtools with the equivalent ".cls" feature:

  • the classes do not auto-populate
  • changes are not shown until the enter key is pressed.

For me personally this is the only feature I use chrome for. Firefox completely satisfies me for all other usage.

Is this something that can be implemented? I have reasonable software development skills so would be willing to assist with this change.

When I develop web apps, I want to see adding and removing CSS classes in real time, like Chrome devtools do. I use tailwind CSS heavily (https://tailwindcss.com/) which relies on adding CSS classes to change appearance. The same applies to bootstrap 4 styles. Chrome devtools autoloads the CSS classes from tailwind, and shows updates to the page as I type. To try this out: 1. go to https://tailwindcss.com/ in chrome/chromium 2. open devtools (f12) 3. switch to the "Elements" tab 4. use the element picker to select the "Get Started" button 5. in the right hand panel, select the ".cls" icon 6. in the box that says "Add new class", type "text-" 7. notice the dropdown and if you change the value (e.g. to text-blue-500) the page updates In firefox devtools with the equivalent ".cls" feature: * the classes do not auto-populate * changes are not shown until the enter key is pressed. For me personally this is the only feature I use chrome for. Firefox completely satisfies me for all other usage. Is this something that can be implemented? I have reasonable software development skills so would be willing to assist with this change.

Kiválasztott megoldás

Simon Walker said

Is this something that can be implemented? I have reasonable software development skills so would be willing to assist with this change.

You have to file a bug about this feature request here.

Válasz olvasása eredeti szövegkörnyezetben 👍 1

Összes válasz (2)

more options

Kiválasztott megoldás

Simon Walker said

Is this something that can be implemented? I have reasonable software development skills so would be willing to assist with this change.

You have to file a bug about this feature request here.

more options

Thanks TyDraniu, I'll do so