Does Less have a feature to shorten input type selectors?

Question

I have written this css:

.form-group > input[type="text"],
.form-group > input[type="text"]:hover,
.form-group > input[type="text"]:active,
.form-group > input[type="password"],
.form-group > input[type="password"]:hover,
.form-group > input[type="password"]:active,
.form-group > input[type="email"],
.form-group > input[type="email"]:hover,
.form-group > input[type="email"]:active {
    max-width: 400px;
}

and i know that i can shorten this by writing

.form-group > input[type="text"],
.form-group > input[type="password"],
.form-group > input[type="email"] {
    max-width: 400px;
    &:hover,
    &:active {
    }
}

Well, the second code part is what i really did write, the first one is just for the dramaturgy of the question, i guess ;)

Now i wonder if there is a feature that allows to group the input type selectors as well, something like this:

.form-group > input {
        $:text,password,email
    max-width: 400px;
    &:hover,
    &:active {
    }
}

Answer 1

No, Less doesn't provide a function like this.

SCSS has a more "programmatic" approach, so there you can do what you wanted using the @each direcive.

Answer 2

You can use less like regular CSS applies:

.form-group > input {
  &[type="text"], &[type="password"], &[type="email"] {
     &:hover, &:active {
       max-width: 400px;
     }
  }
}

The ampersand (&) references the input element, and you just add a rule for the type attribute