Less custom function for :first-letter uppercase

Question

150 views Asked by Alexandre Daubricourt At 28 November 2019 at 11:09

I'm looking for a way to create a custom mixin less function that would act as follows:

.my-class {
  ... .FirstLetterUppercase();
}

And that would transpile to:

.my-class {
  ...
}

.my-class:first-letter {
  text-transform: uppercase;
}

Is that possible with less ?

There are 1 answers

**Pete** · Accepted Answer · 2019-11-28T13:06:01+00:00

Pete On 28 November 2019 at 13:06 BEST ANSWER

You can do the following:

.FirstLetterUppercase() {
  &:first-letter {
    text-transform: uppercase;
  }
}

.my-class {
  .FirstLetterUppercase();
}