Is there a way in Angular ui-select to customize the group label? I want to make it larger than the selection items as shown in the image below.
https://i.stack.imgur.com/ofcak.png
The list is currently grouped by country, but how can I adjust the size of the group label compared to the selection items?
Check out this Plunker Example
<ui-select ng-model="person.selected" theme="bootstrap" ng-disabled="disabled" style="min-width: 300px;" title="Choose a person">
<ui-select-match placeholder="Select a person in the list or search his name/age...">{{$select.selected.name}}</ui-select-match>
<ui-select-choices group-by="'country'" repeat="person in people | propsFilter: {name: $select.search, age: $select.search}">
<div ng-bind-html="person.name | highlight: $select.search"></div>
<small>
email: {{person.email}}
age: <span ng-bind-html="''+person.age | highlight: $select.search"></span>
</small>
</ui-select-choices>
</ui-select>
This example is adapted from the official example found at this link.
Thank you for your assistance.