fronend/scss/themes/theme-teal.scss

@import '_theme-color-variables';

.theme-teal {

    .navbar {
        background-color: $theme-teal;
    }

    .navbar-brand {
        color: $theme-teal-navbar-brand;

        &:hover {
            color: $theme-teal-navbar-brand_hover;
        }

        &:active {
            color: $theme-teal-navbar-brand_active;
        }

        &:focus {
            color: $theme-teal-navbar-brand_focus;
        }
    }

    .nav {
        > li {
            > a {
                color: $theme-teal-nav-anchor;

                &:hover {
                    background-color: $theme-teal-nav-anchor_hover;
                }

                &:focus {
                    background-color: $theme-teal-nav-anchor_focus;
                }
            }
        }

        .open {
            > a {
                background-color: $theme-teal-nav-anchor-opened;

                &:hover {
                    background-color: $theme-teal-nav-anchor-opened_hover;
                }

                &:focus {
                    background-color: $theme-teal-nav-anchor-opened_focus;
                }
            }
        }
    }

    .bars {
        color: $theme-teal-bar;
    }

    .sidebar {
        .menu {
            .list {
                li.active {
                    background-color: $theme-teal-menu-list-active;

                    > :first-child {
                        i, span {
                            color: $theme-teal;
                        }
                    }
                }

                .toggled {
                    background-color: $theme-teal-menu-list-toggled;
                }

                .ml-menu {
                    background-color: $theme-teal-menu-list-submenu;
                }
            }
        }

        .legal {
            background-color: $theme-teal-legal-bg;

            .copyright {
                a {
                    color: $theme-teal !important;
                }
            }
        }
    }
}