// TABS
// frend.co/components/accordion/
// --------------------------------------------------------------------
@mixin accordion {
    [aria-hidden='true'] {
        height: 0;
        visibility: hidden;
    }

    [aria-hidden='false'] {
        visibility: visible;
    }
}

@mixin accordion-header {
    .js & {
        cursor: pointer;
    }
}

@mixin accordion-panel {
    .js & {
        overflow: hidden;
    }
}

// TABS
// frend.co/components/accordion/
// --------------------------------------------------------------------
@mixin accordion {
    [aria-hidden='true'] {
        height: 0;
        visibility: hidden;
    }

    [aria-hidden='false'] {
        visibility: visible;
    }
}

@mixin accordion-header {
    .js & {
        cursor: pointer;
    }
}

@mixin accordion-panel($panel-fade: true, $panel-fade-time: 200ms, $panel-fade-effect: linear) {
    .js & {
        overflow: hidden;

        @if $panel-fade {
            transition: height $panel-fade-time $panel-fade-effect,
                visibility $panel-fade-time;
        }
    }
}

Add configurable transition to accordion panel
Add configurable transition to accordion panel
