border-radius does not apply on components using dropdown lists

[IvayloG]

Description

$border-radius should be applied when set through the theming engine, like:

Snippet:

@import '~igniteui-angular/lib/core/styles/themes/index';

$custom-drop-down-theme: igx-drop-down-theme(
    $border-radius: 8px,
);

:host {
    ::ng-deep {
        @include igx-drop-down($custom-drop-down-theme);
        @include igx-button($custom-button-theme);
    }
}

• igniteui-angular version: NA
• browser: NA

Steps to reproduce

1. Navigate and inspect sample

https://stackblitz.com/edit/angular-ddl-border-radius?file=src%2Fapp%2Fdata-entries%2Fdropdown%2Fdropdown-styling%2Fdropdown-styling.component.scss

Result

There is no border-radius applied.

Expected result

$border-radius being applied through the theming engine.

Attachments

API:
https://www.infragistics.com/products/ignite-ui-angular/docs/sass/latest/index.html#mixin-igx-drop-down