Dropdown hover effect

Hi,

send us your code, please.

Start your code here

    <navbar SideClass="navbar navbar-expand-lg navbar-dark bg-primary scrolling-navbar" [containerInside]="false">
        <logo><a class="logo navbar-brand" href="#">Brand</a></logo>

        <links>
            <ul class="navbar-nav mr-auto">
                <li class="nav-item" routerLinkActive="active">
                    <a class="nav-link" routerLink="home" ripple-radius>{{ 'MENU.HOME' | translate }}</a>
                </li>
                <li class="nav-item dropdown btn-group" dropdown>
                    <a dropdownToggle class="nav-link dropdown-toggle" ripple-radius>
                         {{ 'MENU.COMPANY_MANAGEMENT' | translate }}<span class="caret"></span>
                    </a>
                    <div *dropdownMenu class="dropdown-menu dropdown dropdown-primary" role="menu">
                        <a class="dropdown-item" routerLink="addCompany">{{ 'MENU.ADD_COMPANY' | translate }}</a>
                        <a class="dropdown-item" routerLink="companies">{{ 'MENU.LIST_COMPANIES' | translate }}</a>
                    </div>
                </li>
            </ul>
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" routerLink="home" ripple-radius (click)="signOut()">{{ 'MENU.SIGN_OUT' | translate}}</a>
                </li>
            </ul>
        </links>
    </navbar>