cssangularsassangular-ngselect

How to change the style of an ng-select control when an option is selected


I need to use the component ng-select , but when I select an option in the control I got this blue outline in the select component :

enter image description here

I need to customize this to match the style in my other components. I tried changing the outline property in the two classes that they mention in the Custom Styles section, but nothing happens

Is there any way I can change the color and size of that blue outline? What class should I use?

EDIT:

STACKBLITZ - DEMO

Thanks


Solution

  • Add css to style.css

    .ng-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container {
        border-color: red;
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 0 3px rgba(0,126,255,0.1);
    }
    

    https://stackblitz.com/edit/angular-3ll5zo-ko2nzx?file=src/styles.scss

    enter image description here