Skip to content
Snippets Groups Projects
pages.sass 2.49 KiB
Newer Older
alexisben's avatar
alexisben committed
.block-pages
    .pages
        @include grid(2)
alexisben's avatar
alexisben committed

alexisben's avatar
alexisben committed
.block-pages
    .main-page
        @include media-breakpoint-up(lg)
            > div:first-child
                padding-right: $spacing1
        .title
            a::before
                content: none
    &--list
        .block-content
            @include media-breakpoint-up(lg)
                align-items: flex-start
                display: flex
                > *
                    flex: 1
alexisben's avatar
alexisben committed

alexisben's avatar
alexisben committed
        .pages
            --bs-gutter-y: 0
            @include media-breakpoint-up(lg)
                margin-top: 4.5rem
            > *
                margin-top: px2rem(10)
                width: 100%
alexisben's avatar
alexisben committed

alexisben's avatar
alexisben committed
            .page
                .title
                    @extend .h4
                    a
                        @include hover-translate-icon(before, 3)
                        font-size: px2rem(18)
                        text-decoration-color: transparent
                        &:hover
                            text-decoration-color: black
        .page
            > div
                padding: 0
alexisben's avatar
alexisben committed

alexisben's avatar
alexisben committed
    &--cards
        background-color: $block-pages-card-background
        padding-bottom: $grid-gutter
        padding-top: $grid-gutter
        .pages
            > *
                @include grid(4)
            .page
                aspect-ratio: 0.887
                background-color: $block-pages-card-page-background
                transition: background 0.3s, color 0.3s
                &,
                a
                    color: $block-pages-card-page-color
                a
                    transition: text-decoration-color .3s ease, color .3s
                .more
                    @include link
                    text-decoration-color: $block-pages-card-page-color
                > div:first-child
                    display: flex
                    flex-direction: column
                .title
                    a
                        text-decoration: none
                    + p:not(.more)
                        margin-bottom: 1rem
                &:hover
                    background-color: $block-pages-card-page-background-hover
                    &,
                    a
                        color: $block-pages-card-page-color-hover
                    .more
                        text-decoration-color: $block-pages-card-page-color-hover
                > div:first-of-type
                    padding: $spacing1
        .page
            .title
                a::before
                    content: none
alexisben's avatar
alexisben committed