Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Projeto] Dúvida projeto currículo - separação dos elementos

Boa noite, pessoal! Tudo bem?

Finalizei meu projeto e estava com dificuldades em adicionar espaçamento entre os itens do currículo, mas acredito que consegui resolver!

    <main class="curriculo">
        <section class="curriculo__formatacao">
            <h1 class="curriculo__meunome">Matheus Fernandes Oliveira</h1>
            <p class="curriculo__texto">Brasileiro, Solteiro, 23 anos</p>
            <p class="curriculo__texto">Vila Bancária, São Paulo - SP</p>
            <p class="curriculo__texto">Telefone: 1191234-5678</p>
            <p class="curriculo__texto">E-mail: matheusteste@gmail.com</p>
        <h2 class="curriculo__subtitulo">Resumo</h2>
        <p class="curriculo__texto">Graduando em Sistemas de Informação, atualmente cursando o quinto semestre.</p>
        <h2 class="curriculo__subtitulo">Objetivo</h2>
        <p class="curriculo__texto">Interesse em ingressas em uma vaga de estágio, com o intuito de aprimorar meus conhecimentos e iniciar minha carreira em TI.</p>
        <h2 class="curriculo__subtitulo">Formação academica</h2>
        <ul  class="curriculo__lista">
            <li>FAM Faculdade das Américas - Bacharelado, Sistemas de Informação · (2021 - 2024)</li>
        </ul>
        <h2 class="curriculo__subtitulo">Habilidades</h2>
        <ul class="curriculo__lista">
            <li>HTML5</li>
            <li>CSS</li>
            <li>Linguagem C</li>
            <li>OracleSQL</li>
            <li>Pacote Office</li>
            <li>Inglês (Avançado)</li>
        </ul>
        <h2 class="curriculo__subtitulo">Experiência Profissional</h2>
        <ul>
            <li class="curriculo__lista__titulo"> Atento Brasil</li>
            <li class="curriculo__lista"><strong>Especialista de Relacionamento Digital III - Março de 2021 - março de 2023 (2 anos 1 mês)</strong>
                <ul class="curriculo__lista">
                    <li>Monitoramento das redes sociais do C6 Bank, pelo Facebook, LinkedIn, Instagram, Twitter, YouTube, Google Play e App Store;</li>
                    <li>Classificação de sentimento e tagueamento das interações realizadas com os usuários pela plataforma da Keepcon;</li>
                    <li>Escalonamento e análise de casos críticos via Salesforce;</li>
                    <li>Teceirizado para o banco C6 Bank.</li>
                </ul>
            </li>
        </ul>
    </section>
    </main>

CSS

@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:wght@400;600&display=swap');

* {
    margin: 0;
    padding: 0;
}

body {
    /* height: 100vh; */
    box-sizing: border-box;
    background-color:black;
    color: #f6f6f6;
}

.cabecalho {
    padding: 2% 0% 0% 15%;
}

.cabecalho__menu {
    display: flex;
    gap: 80px
}

.cabecalho__menu__link {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #22D4FD;
    text-decoration: none;
}

.curriculo {
    padding: 2% 0% 2% 15%;
    display: flex;
    align-items: center;
    justify-content: space-between;    
}

.curriculo__formatacao{
    width: 800px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.curriculo__meunome {
    font-family: 'Krona One', sans-serif;
    font-size: 24px;
    color: #f6f6f6;
}

.curriculo__texto {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #f6f6f6;
}

.curriculo__subtitulo {
    font-family: 'Krona One', sans-serif;
    font-size: 20px;
    color: #f6f6f6;
}

.curriculo__lista__titulo {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    color: #f6f6f6;
    font-weight: bold;
    list-style: square;
}

.curriculo__lista {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #f6f6f6;
    list-style: none;
    font-weight: none;
}

.rodape {
    padding: 24px;
    color: black;
    background-color: #22D4FD;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
}
1 resposta
solução!

Olá Matheus, tudo bem?

Fico feliz em saber que conseguiu resolver sua dúvida! Realmente, o espaçamento entre os itens do currículo pode ser um pouco complicado de ajustar, mas com um pouco de paciência e conhecimento em CSS, é possível deixar tudo alinhado e organizado.

Muito obrigada por compartilhar com a gente o seu código e continue praticando muito.

Um abraço e bons estudos.