2.6.0beta.6

• Styles merging added. Now you can do it like in css without clearing previous styles might be breaking:

.cls {
  .red, .green: {
    padding: 5
    // margin: 7px 5px
    .one, .two {
      margin: 5
    }
    .one {
      padding: 15
    }
  }
}
.cls {
  color yellow
}

now compiles to:

cls: {
  color: 'yellow',
  '& .red': {
    padding: 5,
    '& .one': {
      margin: 5,
      padding: 15
    },
    '& .two': {
      margin: 5
    }
  },
  '& .green': {
    padding: 5,
    '& .one': {
      margin: 5,
      padding: 15
    },
    '& .two': {
      margin: 5
    }
  }
}

2.6.0beta.2

• Line comments supported. Only for a whole line.

2.6.0beta.1

• Lit-css rewritten. With small but breaking change. More: #7
• Tests greatly improved.

2.5.0: Default styles fallback.

Now, if you do f('button submit'), and, for example, button isn't in your style, then it would fallback to your defStyles automatically, if present in the constructor options: no more submit: { ...button, color: purple } !

2.4.0: CSS literals

Now, it's perfectly valid, 'cause css returns a style object.

// Somewhere above: import { css } from 'fela-vue'

computed: {
  style() {
    const value = 40
    return css`
        my-class: {
          margin: 10px 5px;
          padding 11 // spaces could be used instead of colons.
          margin-left: ${value}
          margin-right: 10px
          >*:first-of-type {
            margin: 0
          }
       }
    `
  }
}

// and another use case:
computed: {
  style() {
    const value = 40
    return {
        myClass: css`
          margin: 10px 5px;
          padding 11
          margin-left: ${value}
          margin-right: 10px
          >*:first-of-type {
            margin: 0
          }
        `
      }
  }
}

All fela renderer options support.

• All these options. Not only plugins and enhancers.
• Minor performance improvement.

2.2.1: Enchancers & types.

• Types for plugins and enhancers now are directly from fela.
• Enhancers field added
• README slightly improved.
• Minor cleanup.

More about enhancers.
I suggest to look at this one first.

2.1.0 kebab-case and combining

Now this is perfectly valid!

    <span :class="f('one two, bold')"> Combined classes by commas and spaces </span>
    <span :class="f('bold my-kebab')"> And kebab-case! </span>
    <span :class="f('bold myKebab')"> The same! </span>