Fabulous introduces a CSS properties sidebar into Visual Studio Code.
Fabulous supports the followings
- 馃拝 CSS-in-JS libs which supports template literal (styled-components, emotion, linaria)
- 馃帹 CSS rules from
.css
files - 馃寛 CSS rules from
.scss
files - 馃審 CSS rules from
.html
files - these must be in a<style>
tag and the style tag must be within the<head>
tag - 馃寷 CSS rules from
component.ts
Angular component files that have inline styles within the@Component({ styles:[``] })
decorator - 馃専 CSS rules from
.vue
files that have a<style>
tag in the root of the file - 馃拲 CSS rules from
.svelte
files that have a<style>
tag in the root of the file
Fabulous is still in Preview. Give it a try and let us know when things don't go well.
- Install the Fabulous extension in VS Code
- After opening a
css
,scss
,js
,jsx
,tsx
,component.ts
,vue
orsvelte
file, click on the icon to toggle the side-bar - Place your cursor in a CSS rule or in a Styled component template literal
- You should see the sidebar controls become active
Have a look at our contribution guide.
Thanks goes to these wonderful people (emoji key):
Sunil Pai 馃 |
Raathi Kugarajan 馃 馃捇 馃帹 |
0xflotus 馃摉 |
Austin Turner |
Ivan 馃捇 |
Mukesh Mandiwal 馃捇 |
This project follows the all-contributors specification. Contributions of any kind welcome!