lostplaces-frontend/components/01_Atoms/pagination/_pagination.scss

.LP-Pagination{
    font-family: $-primary-sans-serif-font;
    font-weight: bold;
    display: flex;
    flex-direction: row;
    justify-content: center;

    .LP-Pagination__List{
        list-style-type: none;
        display: flex;
        flex-direction: row;
    }

    .LP-Pagination__Item{
        margin: 0 4px;

        &--disabled{
            color: rgb(182, 182, 182);
        }
        
        &--current{

            .LP-Link{
                background-color: $-beige;
                border-radius: 2px;

                &:hover{
                    background-color: $-beige;
                    color: $-grey;
                }
            }
        }
    }

    .LP-Link{
        padding: 15px 25px;
        vertical-align: sub;

        &:active, &:hover{
            background-color: $-beige;
            border-radius: 2px;
            color: $-grey;
        }
    }

    .LP-Pagination__First{
        &:before{
            content: "⟪";
            padding-right: 1em;
            font-size: larger;
        }
    }

    .LP-Pagination__Previous{
        &:before{
            content: "⟨";
            padding-right: 1em;
            font-size: larger;
        }
    }

    .LP-Pagination__Next{
        &:after{
            content: "⟩";
            padding-left: 1em;
            font-size: larger;
        }
    }

    .LP-Pagination__Last{
        &:after{
            content: "⟫";
            padding-left: 1em;
            font-size: larger;
        }
    }
}