CODEWITHSUNDEEP
angularkendo-uitelerikkendo-grid
MaryAnn
MaryAnn

Reputation: 393

Change the default background color of kendo dropdownlist angular 6

I would like to change the default color(grey) in the Kendo dropdown list, could anyone help me how to do that?

app.html

<kendo-dropdownlist
    #list
    [data]="data"
    [filterable]="true"
    textField="text"
    valueField="value"
    (filterChange)="handleFilter($event)" 
    (selectionChange)="Change($event)"
    [valuePrimitive]="true"
    formControlName = selectSize
>
</kendo-dropdownlist>

app.component.ts

export class AppComponent {
@ViewChild("list") list;

public source: Array<{ text: string, value: number }> = [
    { text: "Small", value: 1 },
    { text: "Medium", value: 2 },
    { text: "Large", value: 3 }
];

Trying to change the grey color of dropdown list[1]

Upvotes: 4

Views: 9728

Answers (2)

Momin Affan
Momin Affan

Reputation: 1

.k-picker-solid {
 background-color: white;
 background-image: none;
}

Upvotes: 0

TheParam
TheParam

Reputation: 10541

To change the color of dropdownlist you need to override kendo dropdownlist classes like below

style.css

.k-dropdown-wrap>.k-input, .k-dropdown .k-dropdown-wrap .k-select, .k-list, .k-reset {
    background-color: lightblue;
}

Here is solution on stackblitz

Upvotes: 6

Related Questions