Skip to content

Commit

Permalink
mudei a pagina principal
Browse files Browse the repository at this point in the history
  • Loading branch information
Amanda committed Nov 13, 2023
1 parent 2e2f2ce commit 79dab82
Show file tree
Hide file tree
Showing 3 changed files with 225 additions and 10 deletions.
188 changes: 184 additions & 4 deletions assets/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,18 @@
font-family: 'Kanit', sans-serif;
color: rgb(75, 75, 75);
}

header{
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
overflow-x: hidden;
margin: 0;
max-width: 100%;
padding: 0;
}

/* BACKGROUND DAS PAGINAS VERDES */
.background_green {
background-color: #5db12f;
Expand All @@ -20,6 +28,7 @@ body {
.background_orange {
background-color: #e06a0c;
}

/* BARRA DE SCROLL DO SITE */
body::-webkit-scrollbar {
width: 12px;
Expand All @@ -36,6 +45,168 @@ body::-webkit-scrollbar-thumb {

/* FIM DA BARRA DE SCROLL */

.header1 {
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
width: 100%;
/* padding: 10px; */
height: 85px;
/* position: fixed; */
}

.nome {
float: left;
padding: 5px;
padding: 10px;
margin-top: 5px;
}

.nome h4 {
font-weight: 300;
font-size: 18px;
}

.nome h2 {
font-weight: bold;
color: #26a737;
font-size: 25px;
margin-top: -12px;
}


@media screen {
@media (min-width:900px) {
main {
display: grid;
grid-template-columns: 70% 30%;
margin: 2rem 3rem;
}
}

@media (min-width:700px) {
.menu {
background-color: #26a737;
border-radius: 25px;
float: right;
margin-top: 20px;
padding: 8px 20px;
margin-right: 2rem;
}

.menu a {
color: #ffff;
text-decoration: none;
font-size: 17px;
position: relative;
margin-right: 10px;
}

.menu a::before {
content: "";
position: absolute;
width: 100%;
height: 3px;
bottom: 0;
left: 0;
background-color: #ffff;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}

.menu a:hover:before {
visibility: visible;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}

.icone_white {
color: #ffff;
}
.cartilha {
filter: drop-shadow(10px 10px 4px grey);
height: 300px;
width: auto;
float: left;
margin-right: 20px;
/* background-color: red; */
}
}

@media (max-width:700px) {
.menu {
background-color: #26a737;
width: 100%;
margin:0 ;
border-radius: 0;
display: flex;
justify-content: center;
padding: 8px 20px;
}
.menu a {
color: #ffff;
text-decoration: none;
font-size: 17px;
position: relative;
margin-right: 10px;
}
.menu a::before {
content: "";
position: absolute;
width: 100%;
height: 3px;
bottom: 0;
left: 0;
background-color: #ffff;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}

.menu a:hover:before {
visibility: visible;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
.cartilha {
filter: drop-shadow(10px 10px 4px grey);
margin-right: 20px;
/* background-color: red; */
}
}
}

.img_index {
display: flex;
justify-content: center;
}

.section {
margin: 2rem 3rem;
}



.texto {
font-size: 19px;
max-width: 920px;
/* text-align: justify; */
}

.titulo {
margin-top: 20px;
}

.side_box {
background-color: rgb(245, 245, 245);
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
margin: 2rem 1rem;
padding: 30px 20px;
}

/* CONTEUDO PRINCIPAL */
.main {
margin: 2rem 4rem;
Expand Down Expand Up @@ -182,6 +353,7 @@ a {
border-top-right-radius: 8px;
border-bottom-right-radius: 8px;
}

/* CAIXA DE TEXTO DE PRINCIPIOS LADO DIREITO */
.square2 {
padding: 2rem 0.5rem;
Expand All @@ -190,6 +362,7 @@ a {
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
}

/* TITULO DA CAIXA DA PAGINA DE PRINCIPIOS ESQUERDO */
.square .title {
color: rgb(29, 29, 29);
Expand Down Expand Up @@ -404,6 +577,7 @@ strong a {
color: #ffff;
padding-bottom: 30px;
}

.acessar {
padding-bottom: 30px;
margin-top: -40px;
Expand Down Expand Up @@ -436,13 +610,17 @@ strong a {
/* RESPONSIVIDADE PARA CELULAR */

@media screen {
@media (max-width:800px) {
@media (max-width:900px) {
.main {
box-shadow: none;
margin: 10px 30px;
padding: 0;
}

.cartilha {
height: 350px;
}

.img_index {
width: 90%;
height: auto;
Expand Down Expand Up @@ -485,9 +663,11 @@ strong a {
.background_img {
display: none;
}
.img_none{

.img_none {
display: none;
}

.margin_title {
margin: 0;
}
Expand Down Expand Up @@ -527,7 +707,7 @@ strong a {
}

p {
font-size: 15px !important;
font-size: 20px !important;
}

.square .title {
Expand Down
Binary file added imgs/cartilha_img.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
47 changes: 41 additions & 6 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,16 +25,51 @@

<body>


<header>

<div class="header1">
<div class="nome">
<h4>Cartilha EGPCE</h4>
<h2>Questão de Ética</h2>
</div>
<div class="menu">
<a href=""><i class="bi bi-house icone_white"></i>Início</a>
<a href=""><i class="bi bi-book icone_white"></i>Cartilha</a>
<a href=""><i class="bi bi-filetype-pdf icone_white"></i>Outros formatos</a>
</div>
</div>
</header>

<section>
<!-- <script src="https://unpkg.com/@dotlottie/player-component@latest/dist/dotlottie-player.mjs" type="module"></script>
<main>
<section class="section">
<img class="cartilha" src="imgs/cartilha_img.png" alt="">

<dotlottie-player src="https://lottie.host/a5e85061-54d9-4d28-a431-6139b84cf2c7/KhuJ4hd9fm.json" background="transparent" speed="1" style="width: 300px; height: 300px;" loop autoplay></dotlottie-player> -->
</section>
<p class="texto">Como ação de fortalecimento do comportamento ético institucional a <strong>Escola de
Gestão
Pública
do
Estado do Ceará </strong> publicou a sua cartilha do código de ética. Desenvolvida em linguagem
simples, com
projeto
gráfico colorido e ilustrado, a cartilha nos convida a conhecer os princípios e valores éticos
fundamentais
da Escola, ressaltando ações positivas de comportamento, respeito ao próximo e sustentabilidade,
além de
alertar sobre práticas que devem ser evitadas em nosso ambiente de trabalho.</p>
<!-- <script src="https://unpkg.com/@dotlottie/player-component@latest/dist/dotlottie-player.mjs"
type="module"></script>
<dotlottie-player src="https://lottie.host/a5e85061-54d9-4d28-a431-6139b84cf2c7/KhuJ4hd9fm.json"
background="transparent" speed="1" style="width: 300px; height: 300px;" loop
autoplay></dotlottie-player> -->
</section>
<aside>
<div class="side_box">
<img class="img_index" src="imgs/Group 1.png" height="150px" width="auto" alt="">
<h2 class="titulo"> Cartilha de Ética <br>
para Servidores EGPCE: </strong><br>
Construindo Relações Positivas!</h2>
</div>
</aside>
</main>

<footer>

Expand Down

0 comments on commit 79dab82

Please sign in to comment.