Skip to content
Snippets Groups Projects
files.sass 1.7 KiB
Newer Older
Olivia206's avatar
Olivia206 committed
.block-files
alexisben's avatar
alexisben committed
    .top
        h2, h3
            + .description
                margin-top: $spacing0
alexisben's avatar
alexisben committed
    .files
alexisben's avatar
alexisben committed
        @include list-reset
alexisben's avatar
alexisben committed
        li
            @include icon("download", before)
            align-items: start
Olivia206's avatar
Olivia206 committed
            display: flex
alexisben's avatar
alexisben committed
            position: relative
alexisben's avatar
alexisben committed
            &::before
alexisben's avatar
alexisben committed
                align-items: center
                border: 1px solid $color-border
                display: flex
                flex-shrink: 0
                font-size: px2rem(18)
                height: px2rem(60)
                justify-content: center
                margin-right: $spacing0
                transition: background 0.3s ease, border 0.3s ease
                width: px2rem(60)
            &:hover
                &::before
                    background-color: $color-border
                    border-color: transparent
        a
            @include stretched-link(before)
            @include small
            text-decoration: none
            &::after
                content: none !important // Remove default icon _blank
alexisben's avatar
alexisben committed

alexisben's avatar
alexisben committed
    figcaption
alexisben's avatar
alexisben committed
        @include meta
    @include media-breakpoint-down(desktop)
alexisben's avatar
alexisben committed
        .files
            li + li
                margin-top: $spacing1
    @include media-breakpoint-up(desktop)
alexisben's avatar
alexisben committed
        @include in-page-with-sidebar
alexisben's avatar
alexisben committed
            .files
alexisben's avatar
alexisben committed
                @include grid(2, desktop, half($grid-gutter))
alexisben's avatar
alexisben committed
        @include in-page-without-sidebar
            .top
                display: flex
                h2, h3
                    width: col(4)
                .description
                    margin-top: 0
                    width: col(8)
                    margin-left: $grid-gutter
alexisben's avatar
alexisben committed
            .files
alexisben's avatar
alexisben committed
                @include grid(3, desktop, half($grid-gutter))