styled-components / webstorm-styled-components

styled-components highlighting support in IntelliJ editors
https://plugins.jetbrains.com/plugin/9997-styled-components
MIT License
375 stars 19 forks source link

Wrong hex-color format and No auto line-break with Emmet #104

Open xsjcTony opened 2 years ago

xsjcTony commented 2 years ago

Problem description:

1. Respect the code style setting Convert hex colors format to for style sheets when using Emmet

Emmet: c#f00 -> Press Tab

Expected behavior: (Working correctly In separate .css file or .vue's <style> block)

const StyledDiv = styled.div`
    color: #f00;
`

Actual behavior:

const StyledDiv = styled.div`
    color: #ff0000;
`

2. Insert line-break automatically when using Emmet

Base code:

const StyledDiv = styled.div`
    font-size: 20px;<caret at here>
`

Emmet: ovh -> Press Tab

Expected behavior: (Working correctly In separate .css file or .vue's <style> block)

const StyledDiv = styled.div`
    font-size: 20px;
    overflow: hidden;
`

Actual behavior:

const StyledDiv = styled.div`
    font-size: 20px;overflow: hidden;
`
xsjcTony commented 2 years ago

And also, Rearrange code (Ctrl + Alt + R by default) is not working for CSS code in template string literals. Seems lots of code style settings do not apply to it.