[Projeto] Alguns códigos para deixar mais parecido com o Figma. Meu projeto final.

Fiz algumas coisas a mais no projeto tentando deixa-lo mais parecido com o design final do Figma. Não consegui deixar idêntico, porem tentei deixar o mais próximo possível. Além de algumas Margins e Paddings que eu mudei, mudei também algumas medidas de “px” para “rem” para aumentar ainda mais a responsividade e adicionei algumas tags HTML a mais e algumas classes CSS também. Segue algumas delas:

<script>
        const swiper = new Swiper('.swiper', {
            breakpoints: {
                1024: {
                    spaceBetween: 50
                },
            },
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
        });
    </script>

.swiper-pagination {
    --swiper-pagination-color: var(--cor-degrade);
            --swiper-pagination-bullet-size: 12px;
            --swiper-pagination-bullet-horizontal-gap: 6px;
}

.swiper-button-prev,
    .swiper-button-next {
        --swiper-navigation-size: 15px;
        --swiper-navigation-top-offset: 60%;
        --swiper-navigation-sides-offset:5px;
        --swiper-navigation-color: var(--cor-destaque);
        background: var(--cor-degrade);
        padding: .8em;
        border-radius: 24px;
    }

.topicos__item__oo {
        order: -5;
    }

https://github.com/Kco-macacco/aluraBooks.git - Aqui tem o meu Github com o código. https://kco-macacco.github.io/aluraBooks/ - Aqui a página web funcional do meu projeto.