Skip to content

Commit

Permalink
04/10
Browse files Browse the repository at this point in the history
  • Loading branch information
@sibellyvih
sibellyvih authored Oct 4, 2024
1 parent 2d80c2b commit c2bffa9
Show file tree
Hide file tree
Showing 4 changed files with 104 additions and 110 deletions.
171 changes: 86 additions & 85 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -185,21 +185,80 @@ <h2>Site</h2>
</div>
</section>

<section class="Resultados">
<h2>Conclusão</h2>
<li>Contribuímos significativamente para a formação desses alunos como cidadãos conscientes e comprometidos com a proteção do nosso planeta.</li>
<li> Este projeto é um passo inicial importante para valorizar o ensino da educação ambiental nas escolas, de maneira que os alunos permaneçam engajados e motivados a aprender mais sobre sustentabilidade e seus princípios.</li>
<li>Efeitos positivos que foram notados nos alunos após a aplicação do jogo:</li>
<div class="botoes">
<button class="botao">Melhor conhecimento ecológico</button>
<button class="botao">Pensamento crítico</button>
<button class="botao">Aprenderam mais práticas sustentáveis</button>
<button class="botao">Trabalharam em equipe</button>
<button class="botao">Adquiriram ética ambiental</button>
</div>
<section class="Resultados">
<div class="imagens-conclusao">
<h2>Imagens da aplicação do projeto com os alunos do fundamental I</h2>

<h2>Estatísticas</h2>

<div class="carousel-container">
<div class="carousel-controls left" onclick="changeDepoimento(-1)">&#10094;</div>

<blockquote class="active">
<div class="content">
<img src="Apresentando.jpeg" alt="Apresentando">
<figcaption>Apresentando o projeto. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Apresentando o jogo digital.jpeg" alt="Apresentação do jogo digital">
<figcaption>Apresentação do jogo digital. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Jogando o jogo.jpeg" alt="Jogando o jogo físico">
<figcaption>Jogando o jogo físico. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Foto com os estudantes.jpeg" alt="Foto com os alunos">
<figcaption>Foto com os alunos. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Mimos.jpeg" alt="Mimos">
<figcaption>Entrega de uma pequena lembrança para as crianças, envelopes com sementes de girassol e o QR Code do Jogo. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<div class="carousel-controls right" onclick="changeDepoimento(1)">&#10095;</div>
</div>

<script>
let currentIndex = 0;
const depoimentos = document.querySelectorAll('blockquote');

function showDepoimento(index) {
// Certifique-se de que o índice não ultrapasse os limites
if (index < 0) {
currentIndex = depoimentos.length - 1;
} else if (index >= depoimentos.length) {
currentIndex = 0;
}

// Oculta todos os depoimentos
depoimentos.forEach(dep => dep.classList.remove('active'));

// Exibe apenas o depoimento com o índice atual
depoimentos[currentIndex].classList.add('active');
}

function changeDepoimento(n) {
showDepoimento(currentIndex += n);
}

// Exibe o primeiro depoimento ao carregar a página
showDepoimento(currentIndex);
</script>
</div>

<h2 class="titulo-grafico">Estatísticas</h2>
<div class="estatisticas">
<canvas id="meuGrafico"></canvas>
<script>
Expand Down Expand Up @@ -241,79 +300,21 @@ <h2>Estatísticas</h2>
<li>A questão errada foi trabalhada novamente para que a equipe pudesse entender o porquê estava errado.</li>
</ul>
</div>


<div class="imagens-conclusão">
<h2>Imagens da aplicação do projeto com os alunos do fundamental I</h2>

<div class="carousel-container">
<div class="carousel-controls left" onclick="changeDepoimento(-1)">&#10094;</div>

<blockquote class="active">
<div class="content">
<img src="Apresentando.jpeg" alt="Apresentando">
<figcaption>Apresentando o projeto. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Apresentando o jogo digital.jpeg" alt="Apresentação do jogo digital">
<figcaption>Apresentação do jogo digital. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Jogando o jogo.jpeg" alt="Jogando o jogo físico">
<figcaption>Jogando o jogo físico. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Foto com os estudantes.jpeg" alt="Foto com os alunos">
<figcaption>Foto com os alunos. Fonte: Autoral.</figcaption>
</div>
</blockquote>

<blockquote>
<div class="content">
<img src="Mimos.jpeg" alt="Mimos">
<figcaption>Entrega de uma pequena lembrança para as crianças, envelopes com sementes de girassol e o QR Code do Jogo</figcaption>
</div>
</blockquote>

<div class="carousel-controls right" onclick="changeDepoimento(1)">&#10095;</div>
<div class="conclusao">
<h2>Conclusão</h2>
<li>Contribuímos significativamente para a formação desses alunos como cidadãos conscientes e comprometidos com a proteção do nosso planeta.</li>
<li> Este projeto é um passo inicial importante para valorizar o ensino da educação ambiental nas escolas, de maneira que os alunos permaneçam engajados e motivados a aprender mais sobre sustentabilidade e seus princípios.</li>
<li>Efeitos positivos que foram notados nos alunos após a aplicação do jogo:</li>
<div class="botoes">
<button class="botao">Melhor conhecimento ecológico</button>
<button class="botao">Pensamento crítico</button>
<button class="botao">Aprenderam mais práticas sustentáveis</button>
<button class="botao">Trabalharam em equipe</button>
<button class="botao">Adquiriram ética ambiental</button>
</div>

<script>
let currentIndex = 0;
const depoimentos = document.querySelectorAll('blockquote');

function showDepoimento(index) {
// Certifique-se de que o índice não ultrapasse os limites
if (index < 0) {
currentIndex = depoimentos.length - 1;
} else if (index >= depoimentos.length) {
currentIndex = 0;
}

// Oculta todos os depoimentos
depoimentos.forEach(dep => dep.classList.remove('active'));

// Exibe apenas o depoimento com o índice atual
depoimentos[currentIndex].classList.add('active');
}

function changeDepoimento(n) {
showDepoimento(currentIndex += n);
}

// Exibe o primeiro depoimento ao carregar a página
showDepoimento(currentIndex);
</script>
</section>
</div>
</section>

<div class="acessar-jogo">
<h2>Como acessar o Eco Board Game?</h2>
Expand Down
22 changes: 13 additions & 9 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ header {

.caixa h1 {
font-size: 25px;
color: rgb(0, 69, 0);
color: rgb(1, 101, 1);
padding-left: 85px;
}

Expand Down Expand Up @@ -329,6 +329,10 @@ font-size: 22px;
width: 100%; /* Garantir que o conteúdo use toda a largura disponível */
}

.conclusao {
padding: 50px;
}

.Resultados {
padding: 60px;
width: 100%; /* A largura da div se ajustará ao tamanho da tela */
Expand All @@ -344,17 +348,19 @@ font-size: 22px;
font-weight: bold;
font-size: 20px;
text-decoration: none;
padding: 15px;
}

.titulo-grafico {
padding: 15px;
}

.estatisticas {
font-size: 20px;
display: flex;
justify-content: center; /* Centraliza horizontalmente */
align-items: center; /* Centraliza verticalmente */
height: 80vh; /* Opcional, ajusta a altura da div */
padding: 10px;
}

.estatisticas h2 {
height: 40vh; /* Opcional, ajusta a altura da div */
padding: 0px;
}

Expand All @@ -372,9 +378,7 @@ font-size: 22px;

.imagens-conclusao {
font-size: 18px;
padding: 0px;
color: white;
background-image: linear-gradient(to right, #4CB8C4 0%, #3CD3AD 51%, #4CB8C4 100%);
padding: 50px;
}

.content {
Expand Down
11 changes: 1 addition & 10 deletions workshop.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ h2 {
}

p {
font-size: large;
font-size: 22px;
text-align: center;
}

Expand All @@ -107,15 +107,6 @@ p {
position: relative; /* Adicionado para posicionar as setas */
}

.workshop blockquote {
display: none;
}

.depoimentos blockquote.active {
display: block;
}


img {
max-width: 500px;
max-height: 450px;
Expand Down
10 changes: 4 additions & 6 deletions workshop.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,11 +27,10 @@ <h1>Workshop</h1>
<h1>Visita na Escola Municipal Luiz Deliberador</h1>
</div>

<h2>Relato da aplicação do projeto</h2>
<p>Os alunos demonstraram grande interesse e entusiasmo pelo jogo, esforçandose para responder a cada pergunta e competir para serem a equipe vencedora. Eles ficaram empolgados com a experiência, mostrando satisfação e alegria ao participarem das atividades. Recebemos um feedback extremamente positivo, com muitos alunos expressando como se divertiram e como acharam o jogo educativo e envolvente.</p>

<div class="woekshop">
<div class="carousel-controls left" onclick="changeDepoimento(-1)">&#10094;</div>
<h2>Depoimentos</h2>
<div class="workshop">
<blockquote class="active">
<div class="content">
<figure>
Expand Down Expand Up @@ -71,11 +70,10 @@ <h2>Depoimentos</h2>
<blockquote>
<div class="content">
<figure>
<img class="depoimentos_img" src="Mimos.jpeg" alt="Mimos">
<figcaption>Entrega de uma pequena lembrança para as crianças, envelopes com sementes de girassol e o QR Code do Jogo</figcaption>
<img src="Mimos.jpeg" alt="Mimos">
<figcaption>Entrega de uma pequena lembrança para as crianças, envelopes com sementes de girassol e o QR Code do Jogo. Fonte: Autoral.</figcaption>
</figure>
</blockquote>
<div class="carousel-controls right" onclick="changeDepoimento(1)">&#10095;</div>
</div>

<footer class="rodape">
Expand Down

0 comments on commit c2bffa9

Please sign in to comment.