Changing color of form field focus

[CraftyDlx]

I changed the colored animation to orange with <div class="form-group has-danger"> for input form fields focus but for dropdown selection focus animation it does not work, the focus animation color stays purple. My code where has-danger has no effect:

<div class="row">
   <label class="col-sm-2 col-form-label has-danger">{{ __('Art') }}</label>
   <div class="col-sm-7 has-danger">
      <div class="form-group has-danger">
         <select class="selectpicker col-sm-12 pl-0 pr-0 has danger" name="tooltype_id" data-style="select-with-transition" title="" data-size="100">
            @foreach($tooltypes as $tooltype)
            <option value={{ __($tooltype->id) }} @if ($tooltype->id == old('selectpicker', $tool->tooltype_id)) selected="selected" @endif>{{ __($tooltype->name) }}</option>
            @endforeach
         </select>
         @include('alerts.feedback', ['field' => 'tooltype_id'])
      </div>
   </div>
</div>

[groovemen]

Hello,

The fact that you have set "has-danger" doesn't also change the <selectpicker>'s animation color on focus, so we'll ask you have to change it manually. You can see that in public/material/scss/material-dashboard/plugins/_plugin-bootstrap-select.scss at line 582 is set this animation color:

background-image: linear-gradient(to top, #9c27b0 2px, rgba(156, 39, 176, 0) 2px), 
                  linear-gradient(to top, #d2d2d2 1px, rgba(210, 210, 210, 0) 1px);

A quick solution would be to change the color of background-image prorperty from above for this <form> in $danger. Another way would be to adapt this mixin to change the color for the selectpicker also: @mixin bmd-form-color($label-color, $label-color-focus, $border-color, $line-color) {...}

Hope that information helps you. Please let us know if we can help you with anything else.

All the best, Stefan

[CraftyDlx]

Thanks, I changed background-image to

background-image: linear-gradient(to top, #F05050 2px, rgb(240, 80, 80) 2px),
                  linear-gradient(to top, #d2d2d2 1px, rgba(210, 210, 210, 0) 1px);

The problem is now that I dont see any changes. I cleared the view/config/cache with php artisan, also cleared browser cache and changed to different browser. No effect. As I understand, material-dashboard.scss automatically imports /plugins/_plugin-bootstrap-select.scss and I dont need to use Laraval Mix to make this work, right?