webpack-bootstrap-ui-kit/src/scss/_layout/_main/_main.scss

/*
 * some basic styles
 */

.meta-MetaWindow {
    z-index: 1031;

    .meta-nav {
        text-decoration: none;
    }
}

.pulse {
    animation: pulse 0.8s linear infinite;
}

// navs
.navbar-toggler {
    transition: transform ease 0.4s;
}

.navbar-toggler-icon {
    width: auto;
    height: auto;
}

.nav-item,
.nav-link {
    display: flex;
}

button.nav-link {
    border: 0;
    outline: 0;
    text-transform: inherit;
    letter-spacing: inherit;
}

.navbar-toggler {
    &[aria-expanded='true'] {
        transform: rotate(90deg);
    }
}

.dropdown-toggle {
    position: relative;
    padding-right: 1.5em;

    &:after {
        position: absolute;
        right: 0.5em;
        bottom: 1em;
    }
}

.navbar-nav .dropdown-toggle.nav-link {
    padding-right: 1.5em;
}

.dropdown.show .dropdown-toggle::after,
.dropdown-toggle.active-dropdown::after,
.dropdown-toggle.active::after {
    transform: rotate(-90deg);
}

.dropdown-menu {
    padding: 0;
    border-radius: 0;
    will-change: max-height, display;
    overflow: hidden;
    transition: none;

    &.show {
        animation: expand 2s;
        animation-fill-mode: both;
        overflow: visible;
    }

    .dropdown-list {
        @extend .list-unstyled;
    }

    .dropdown-menu {
        top: 0;
        left: 100%;
    }
}

.dropdown-item {
    white-space: normal;
}

.field {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin: $form-spacer-y 0;

    &:first-child {
        margin-top: 0;
    }

    &:last-child {
        margin-bottom: 0;
    }
}

.btn-toolbar {
    margin-top: $form-spacer-y;
}

// rewrite btn opacity on hover
.btn {

    &:hover,
    &.active,
    &:focus {
        opacity: 1;
    }
}

// SS-messages

.alert+.alert {
    border-top: 0;
}

/*.message {
    @extend .alert;

    @extend .alert-info;

    display: block;
    margin: 0.5rem 0;
}

.message.validation,
.message.required,
.message.error {
    @extend .alert;

    @extend .alert-danger;
}

.message.required,
.message.error {
    @extend .alert;

    @extend .alert-danger;
}*/

.list-group-item.active {

    a,
    .a {
        color: $list-group-active-color;
    }
}

[aria-expanded='true'] {
    .fa-bars {
        &:before {
            content: '\f00d';
        }
    }
}

.jsSidebarUI {
    position: relative;
    min-height: 100%;
}

.jsSidebarUI__inner {
    position: relative;
    will-change: position, top;
}