search

patstockwell / vim-monokai-tasty

VIM Colour scheme
390 stars 51 forks source link

Better colors for HTML attributes #37

Closed dubst3pp4 closed 2 years ago

dubst3pp4 commented 3 years ago

At first many thanks for your great color scheme :+1:

Compared to other colorschemes I recognized, that HTML attributes are hard to read:

Here is a screenshot of vim-monokai-tasty: Bildschirmfoto von 2021-09-20 10-28-59

and a screenshot compared to night-owl colorscheme: Bildschirmfoto von 2021-09-20 10-26-36

Not only the attributes are in another color, but also the quotes, which makes the code much more readable.

Although the screenshot is from a Vue template (so not pure HTML), the same issue occurs within pure HTML files. Is there a way to make attributes more readable?

patstockwell commented 3 years ago

Hi @dubst3pp4, thanks for opening a git issue. I'll take a look and get back to you!

patstockwell commented 3 years ago

Hi @dubst3pp4, Thanks again for taking the time to request changes. I've added a few colour highlights to improve the html. Let me know what you think. :PlugUpdate should get you the latest (assuming you're using plug). See this commit -> 1e96ca23aefac8614658716f99bafbfad7726a1a

Specifically about the quotes, unfortunately, the html syntax file doesn't differentiate between the quotes and the content in between the quotes. They are both considered htmlString. In the screenshot you shared you will notice that line 476 in both images has the quotes and the string values as the same colour. The remaining attributes are actually an accident due to the fact that the html syntax file can't parse Vue syntax.

I hope these changes improve the readability. Generally, I try to stick to the way Sublime text does monokai as that was what inspired this project initially. See screenshots for comparisons.

vim-monokai-tasty before

Screen Shot 2021-09-22 at 9 03 04 pm

vim-monokai-tasty after

Screen Shot 2021-09-22 at 9 03 16 pm

Sublime text

Screen Shot 2021-09-22 at 9 06 04 pm

night-owl

*Notice here the strings and the quotes are the same colour

Screen Shot 2021-09-22 at 9 05 34 pm
dubst3pp4 commented 3 years ago

Thanks @patstockwell, sorry for the late response. For standard HTML attributes it looks fine, but for "non-standard" attributes used with Vue (eg. something like :value="foo") it still looks the same. Maybe it has something todo with the vim-vue-plugin I'm using. But I don't now how it differs to the standard html syntax file and how syntax is defined there (sorry I'm not that deep into Vim plugins).