daaain / Handlebars

Fullest Handlebars.js templating support for Sublime Text 2 / 3. Also drives syntax colouring on Github and in Visual Studio Code. Install from: https://packagecontrol.io/packages/Handlebars.
MIT License
301 stars 48 forks source link

Add syntax definitions for properties #81

Closed sotojuan closed 7 years ago

sotojuan commented 8 years ago

Color schemes and themes can't make them easier to see because apparently there's no definitions for them.

Example.

/cc @saadq

daaain commented 8 years ago

Hey @sotojuan,

I'm really sorry for taking this long, I briefly looked into it a few times, but struggling to understand what exactly is the problem or how can I help. Please try to describe what you're experiencing a bit better!

The (hash) helpers are defined as meta.function.block.start.handlebars and support.constant.handlebars, while properties are meta.function.inline.other.handlebars and variable.parameter.handlebars.

If you look at the example file in this repo, you should definitely see a distinction between them:

screen shot 2016-05-28 at 21 27 06
sotojuan commented 8 years ago

Hi, thanks for the reply. I'll admit that I don't know anything about Sublime plugins or coloring, so maybe @saadq can help!

saadq commented 8 years ago

Hey @daaain, thanks for taking a look at this. I'm not too familiar with Handlebars, but I believe the issue was about this code snippet:


{{#x-card
  onsubmit=attrs.onsubmit
  title='Login to Peepchat'
  buttonText='Login'}}
  <div class="row">
    {{x-input
      value=model.email
      errors=validations.attrs.model.email.messages
      classNames='col s12'
      type='email'
      label='Username'}}
  </div>
  <div class="row">
    {{x-input
      value=model.password
      errors=validations.attrs.model.password.messages
      classNames='col s12'
      type='password'
      label='Password'}}
  </div>
{{/x-card}}

In Sublime, it currently looks like this:

screen shot 2016-05-31 at 2 18 48 pm

While in Atom, it looks like this:

hbs

An example would be this line: onsubmit=attrs.onsubmit. Is it possible for onsubmit= and attrs.onsubmit to be different colors?

daaain commented 8 years ago

Ah ok, thanks a lot for the explanation @saadq, I got it now!

I split attributes up, so now there is entity.other.attribute-name.handlebars and entity.other.attribute-value.handlebars which you should be able to target with themes.

But it's improved even without theme support as the equal sign should be a distinct colour:

image

saadq commented 8 years ago

Awesome, thanks a lot.

daaain commented 7 years ago

I'm closing this issue, but feel free to get back to me @saadq if there's anything else I should do!