Skip to content
Snippets Groups Projects
organization_chart.sass 1.55 KiB
Newer Older
alexisben's avatar
alexisben committed
.block-organization_chart
alexisben's avatar
alexisben committed
    @include media-breakpoint-up(desktop)
        @include in-page-without-sidebar
            .top .description
                max-width: col(8)
alexisben's avatar
alexisben committed
    @include in-page-with-sidebar
        .persons
            @include grid(1, sm)
            &:not(.is-column)
                @include grid(2, desktop)
            &.is-column
                @include grid(2, xl)
                @include media-breakpoint-between(desktop, xl)
                    .person
                        justify-content: space-between
                        gap: $spacing1
                    .avatar
                        margin-right: 0
                        order: 1
                        width: col(3)
                    .description
                        margin-top: 0
Olivia206's avatar
Olivia206 committed
        article
            flex-direction: row
            .avatar
                margin-right: $spacing1
                @include media-breakpoint-up(md)
                    width: calc(#{col(1, 4)} + #{$grid-gutter})
            .description
                margin-top: $spacing1
body
    &:not(.full-width)
        @include media-breakpoint-between(md, desktop)
            .person
                flex-direction: row-reverse
                gap: $spacing1
                .avatar
                    width: calc(#{col(1, 4)} + #{$grid-gutter})
    &.full-width
        @include media-breakpoint-up(md)
            .persons .avatar 
                width: 100%
        @include media-breakpoint-up(sm)
alexisben's avatar
alexisben committed
            .persons
                @include grid(4, md)
alexisben's avatar
alexisben committed
                @include grid(6, xl)