1

I have this side bar menu using nebular :

sidebarMenuItems: [
 {
            icon: "home-outline",
            title: "Home",
            link: "/app/home",
        },
{
            icon: "attach-2-outline",
            title: "Documents",
            children: [
                {
                    title: "Requests",
                    link:
                        "/app/documents-management/" +
                        DocumentsOperationEnum.REQUESTS.toLowerCase(),
                },
                {
                    title: "History",
                    link:
                        "/app/documents-management/" +
                        DocumentsOperationEnum.HISTORY.toLowerCase(),
                }
]
}
]

when I click the home item the background color changes thanks to this code :

 a.active {
                                height: 40px;
                                padding: 12px 26px !important;
                                background: linear-gradient(90deg, #038C81 35%, var(--text-primary-color)100%);
                                .menu-icon {
                                    margin: 0px !important;
                                    width: 24px;
                                    height: 24px;
                                    font-size: 24px;
                                    vertical-align: middle;
                                    color: aliceblue;
                                }
                                .menu-title {
                                    margin-left: 20px;
                                    color: aliceblue;
                                    background: linear-gradient(90deg, #038C81 35%, var(--text-primary-color)100%);
                                }
                            }

However this change only happens to the home, request and history items. The document item's color doesn't change since it's a toggle one. I want the document item's color to change too when clicked. any way to help me do that ??

Ran
  • 27
  • 2

0 Answers0