Atualização 14 | Implementação do modulo de construção construir as telas que serão apresentadas no ambiente do usuário, desenvolvendo as novas estilizações implementadas no wireframe, e aplicação das funções dentro da tela home.
This commit is contained in:
parent
a25034a0e3
commit
18fcbeba41
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 7.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
|
|
@ -8,14 +8,16 @@
|
|||
<meta http-equiv="Feature-Policy"
|
||||
content="geolocation 'none'; microphone 'none'; camera 'none'; fullscreen 'none'; payment 'none'; vr 'none'; autoplay 'none'; accelerometer 'none'; ambient-light-sensor 'none'; gyroscope 'none'; magnetometer 'none';picture-in-picture 'none';sync-xhr 'none'; usb 'none';clipboard-write 'none'; clipboard-read 'none'; payments 'none'; ">
|
||||
|
||||
<link id="conexao" rel="stylesheet" href="./Css/page/Telas_acao/erro_404.css">
|
||||
<link id="conexao" rel="stylesheet" href="">
|
||||
<link id="conexao_tela" rel="stylesheet" href="">
|
||||
|
||||
<link rel="stylesheet" href="./Css/page/Telas_acao/load.css">
|
||||
<link rel="icon" type="image/x-icon" href="./Acessts/Imagens/iT_Guys/logo1.png">
|
||||
|
||||
<script src="./js/global/Modulo_de_Comunicacao/Funcao/Comunicacao.js"></script>
|
||||
<script src="./js/page/Modulo_Construcao/Funcao/Estrutura/Autencacao.js"></script>
|
||||
|
||||
<script src="./js/page/Modulo_Construcao/Funcao/Estrutura/Controlador_telas.js"></script>
|
||||
<script id="Construtor" src="./js/page/Modulo_Construcao/Funcao/Estrutura/Controlador_telas.js"></script>
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,34 +1,14 @@
|
|||
/* Estilo customizado para o scroll (somente no Webkit) */
|
||||
.capitulo_2 .painel_Cap::-webkit-scrollbar,
|
||||
.capitulo_3 .painel_Cap::-webkit-scrollbar,
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2::-webkit-scrollbar
|
||||
|
||||
/*Scroll do pop up da edição de um Ambiente*/
|
||||
,
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel::-webkit-scrollbar,
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2::-webkit-scrollbar,
|
||||
.PopPainel.CriacaoAmbientes #formulario::-webkit-scrollbar,
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie::-webkit-scrollbar {
|
||||
.Capitulo_1 .linha_1 .Corpo::-webkit-scrollbar {
|
||||
width: 0.2vw;
|
||||
/* Largura da barra de rolagem */
|
||||
height: 0.2vw;
|
||||
/* Para scroll horizontal, se necessário */
|
||||
}
|
||||
|
||||
/* Estilo para o polegar da barra de rolagem */
|
||||
.capitulo_2 .painel_Cap::-webkit-scrollbar-thumb,
|
||||
.capitulo_3 .painel_Cap::-webkit-scrollbar-thumb,
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2::-webkit-scrollbar-thumb
|
||||
/*Scroll do pop up da edição de um Ambiente*/
|
||||
,
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel::-webkit-scrollbar-thumb
|
||||
|
||||
/*Scroll do painel de itens, dentro do pop up de edição para ambientes*/
|
||||
,
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2::-webkit-scrollbar-thumb,
|
||||
.PopPainel.CriacaoAmbientes #formulario::-webkit-scrollbar-thumb,
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie::-webkit-scrollbar-thumb {
|
||||
background-color: var(--Matriz);
|
||||
.Capitulo_1 .linha_1 .Corpo::-webkit-scrollbar-thumb {
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
/* Cor da parte da barra que você arrasta */
|
||||
border-radius: 1vw;
|
||||
/* Borda arredondada */
|
||||
|
|
@ -36,13 +16,7 @@
|
|||
}
|
||||
|
||||
/* Aumentando o tamanho do track (fundo da barra de rolagem) */
|
||||
.capitulo_2 .painel_Cap::-webkit-scrollbar-track,
|
||||
.capitulo_3 .painel_Cap::-webkit-scrollbar-track,
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2::-webkit-scrollbar-track,
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel::-webkit-scrollbar-track,
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2::-webkit-scrollbar-track,
|
||||
.PopPainel.CriacaoAmbientes #formulario::-webkit-scrollbar-track,
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie::-webkit-scrollbar-track {
|
||||
.Capitulo_1 .linha_1 .Corpo::-webkit-scrollbar-track {
|
||||
background-color: var(--Cor_Segundaria_5_2);
|
||||
/* Cor do fundo do scroll */
|
||||
border-radius: 10px;
|
||||
|
|
|
|||
|
|
@ -42,14 +42,14 @@ body {
|
|||
--Cor_Segundaria_2_1: #22c0a3;
|
||||
--Cor_Segundaria_3_1: #26b1c7;
|
||||
--Cor_Segundaria_4_1: #26c03a;
|
||||
--Cor_Segundaria_5_1: #1478cf;
|
||||
--Cor_Segundaria_5_1: #003153;
|
||||
|
||||
/*Paleta de cores padrão escuro*/
|
||||
--Cor_Segundaria_1_2: #115834;
|
||||
--Cor_Segundaria_2_2: #125f51;
|
||||
--Cor_Segundaria_3_2: #1B7C8C;
|
||||
--Cor_Segundaria_4_2: #105018;
|
||||
--Cor_Segundaria_5_2: #123655;
|
||||
--Cor_Segundaria_5_2: #0d253a;
|
||||
|
||||
/*Paleta de cores padrão ausencia*/
|
||||
--Vazio_Corpo: #c6c6c6;
|
||||
|
|
|
|||
|
|
@ -1,24 +0,0 @@
|
|||
/*Elementos essencias para alinhamento da página*/
|
||||
@import url(../../../../global/import.css);
|
||||
@import url(../../../../global/Scroll.css);
|
||||
@import url(../Ambientes/estrutura/AmbienteEstruture.css);
|
||||
@import url(../Ambientes/Componentes/Aplicacoes.css);
|
||||
|
||||
/*Estrutura principal de componentes entre os paineis da tela de configuração*/
|
||||
@import url(../Ambientes/Componentes/Ambientes.css);
|
||||
@import url(../Ambientes/Componentes/AmbientesAlertas.css);
|
||||
@import url(../Ambientes/Componentes/AmbientesRelatorios.css);
|
||||
|
||||
/*Estrutura principal da tela de configuração*/
|
||||
@import url(../Ambientes/estrutura/Sec_Cap_1.css);
|
||||
@import url(../Ambientes/estrutura/Sec_Cap_2.css);
|
||||
@import url(../Ambientes/estrutura/Sec_Cap_3.css);
|
||||
|
||||
/*Estrutura de paineis que são apresentados*/
|
||||
@import url(../Ambientes/Painel/Respostapopup.css);
|
||||
@import url(../Ambientes/Painel/Painelpopup.css);
|
||||
@import url(../Ambientes/Painel/EdicaoAmbientespop.css);
|
||||
@import url(../Ambientes/Painel/CriacaoAmbientepop.css);
|
||||
@import url(../Ambientes/Painel/RelatoriosAmbientespop.css);
|
||||
|
||||
@import url(../Ambientes/Painel/tags.css);
|
||||
|
|
@ -1,140 +0,0 @@
|
|||
/*Esse caminho de classe, aponta para a classe coluna_2, que por usa vez possui a responsabilidade de alinhar todos os elementos dentro dela.*/
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: start;
|
||||
gap: 2vh;
|
||||
|
||||
}
|
||||
|
||||
/* ========================= Imagem inicial do componente ============================== */
|
||||
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem {
|
||||
|
||||
width: 95%;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .img {
|
||||
|
||||
width: 3.5vw;
|
||||
height: 7vh;
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .img img {
|
||||
|
||||
width: 2.5vw;
|
||||
|
||||
}
|
||||
|
||||
/* ================================= Fechamento ======================================== */
|
||||
|
||||
|
||||
|
||||
/* ============================ corpo do componente ==================================== */
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .corpo {
|
||||
width: 70%;
|
||||
height: 7vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .titulo h2 {
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 0.8vw;
|
||||
color: var(--Matriz);
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .corpo .alinhamentos {
|
||||
width: 50%;
|
||||
height: 6vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .corpo .alinhamentos button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
|
||||
padding: 5%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 0.7vw;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
/* ================================= Fechamento ======================================== */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* ============================ botão final do componente ============================== */
|
||||
|
||||
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .edicao button {
|
||||
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
width: 3vw;
|
||||
height: 7vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 2vw;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
/* ================================= Fechamento ======================================== */
|
||||
|
|
@ -1,83 +0,0 @@
|
|||
.subpainel_Status {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_1 {
|
||||
width: 25%;
|
||||
height: 6vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_2 {
|
||||
width: 70%;
|
||||
height: 6vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 1vw;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_1 .titulo {
|
||||
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 0.5vw;
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_2 .Mensagem_ambiente {
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
margin-left: 1vw;
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_2 .button_rel button {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
.subpainel_Status .bloco_2 .button_rel img {
|
||||
width: 1.6vw;
|
||||
filter: drop-shadow(3px 3px 0px var(--Cor_Segundaria_2_2));
|
||||
}
|
||||
|
||||
|
||||
.subpainel_Status .bloco_2 .status_ambiente {
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
font-size: 0.7vw;
|
||||
|
||||
margin-right: 1vw;
|
||||
background-color: var(--Matriz);
|
||||
padding: 0.2vw;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 2vw;
|
||||
width: 4vw;
|
||||
height: 3vh;
|
||||
}
|
||||
|
|
@ -1,67 +0,0 @@
|
|||
.bloco_ambiente .coluna_2 .opicaoAmbie {
|
||||
|
||||
width: 100%;
|
||||
height: 25vh;
|
||||
padding-bottom: 2vh;
|
||||
padding-top: 2vh;
|
||||
|
||||
overflow-y: auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: start;
|
||||
gap: 2vh;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie button {
|
||||
outline: none;
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
width: 20vw;
|
||||
height: 3vh;
|
||||
padding: 1.8vw;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
|
||||
color: var(--Matriz);
|
||||
font-size: 1.2vw;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie.dinamico button {
|
||||
|
||||
background-color: var(--Cor_Segundaria_1_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_1_2);
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie.RelatoriosON button {
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
}
|
||||
|
||||
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie.RelatoriosERRO button {
|
||||
|
||||
background-color: red;
|
||||
box-shadow: 5px 5px 0px rgb(109, 0, 0);
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .coluna_2 .opicaoAmbie.RelatoriosOFF button {
|
||||
|
||||
background-color: var(--Vazio_Corpo);
|
||||
box-shadow: 5px 5px 0px var(--Vazio_Fundo);
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
/*========================================= Aplicações de tipo de estilos, para os botões OFF, ERRO e ON. ===============================================*/
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap .coluna_1 .desativado {
|
||||
|
||||
color: var(--Matriz);
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap .coluna_1 .Ativo {
|
||||
|
||||
color: var(--Cor_Segundaria_3_1);
|
||||
background-color: var(--Matriz);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_3_1);
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*========================================= Fechamento das aaplicações de ERRO, OFF e ON ===============================================*/
|
||||
|
|
@ -1,417 +0,0 @@
|
|||
/*Aplicação de classe modificada, atrelando todas as modififcações, nos estilos dentro dessa div, somente quando a classe dela é alinhada com essa outra classe, utilizando ela como gatilho para montar todos os estilos desse pop up, definindo a autura e o posicionamneto do pop up*/
|
||||
.PopPainel.CriacaoAmbientes {
|
||||
height: 80vh;
|
||||
|
||||
top: 5vh;
|
||||
left: 40vw;
|
||||
|
||||
}
|
||||
|
||||
/*====================== Painel de encerramento =======================================*/
|
||||
|
||||
/*Aplica*/
|
||||
.PopPainel.CriacaoAmbientes .fecharPainel {
|
||||
width: 100%;
|
||||
height: 12vh;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .fecharPainel button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
width: 8vw;
|
||||
height: 5vh;
|
||||
background-color: #c6c6c6;
|
||||
box-shadow: 5px 5px 0px #9a9a9a;
|
||||
|
||||
font-size: 1vw;
|
||||
color: var(--Matriz);
|
||||
transition: 1s ease;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .fecharPainel button:hover {
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: -5px 5px 0px var(--Cor_Segundaria_5_2);
|
||||
}
|
||||
|
||||
|
||||
/*====================== Fechamento ====================================================*/
|
||||
|
||||
|
||||
/*====================== Inicio do formulario =======================================*/
|
||||
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario {
|
||||
|
||||
width: 100%;
|
||||
height: 70vh;
|
||||
padding-top: 2vh;
|
||||
overflow-y: auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
gap: 2vh;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 {
|
||||
|
||||
width: 90%;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
gap: 2vh;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .TituloCampo,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .TituloCampo,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .TituloCampo {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1.2vw;
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .TituloCampo h2,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .TituloCampo h2,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .TituloCampo h2 {
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
padding: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campo,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .Campo,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .Campo {
|
||||
width: 100%;
|
||||
height: 6vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campo label,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .Campo label,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .Campo label {
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1.2vw;
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campo input,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .Campo input,
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .Campo input {
|
||||
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
height: 1vh;
|
||||
width: 70%;
|
||||
padding: 0.8vw;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*====================== Fechamento ====================================================*/
|
||||
|
||||
|
||||
|
||||
/*====================== Configuração ES B1 ++++=======================================*/
|
||||
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campolong {
|
||||
|
||||
width: 100%;
|
||||
padding-top: 2vh;
|
||||
padding-bottom: 2vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: start;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campolong label {
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1.2vw;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campolong textarea {
|
||||
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
height: 14vh;
|
||||
width: 70%;
|
||||
padding: 0.8vw;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*====================== Fechamento ====================================================*/
|
||||
|
||||
|
||||
|
||||
/*====================== Configuração ES B2 ++++=======================================*/
|
||||
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .CampoInsercao {
|
||||
|
||||
width: 100%;
|
||||
padding-top: 2vh;
|
||||
padding-bottom: 2vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .CampoInsercao label {
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1.2vw;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .CampoInsercao button {
|
||||
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
height: 8vh;
|
||||
width: 70%;
|
||||
padding: 0.8vw;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
font-size: 1.6vw;
|
||||
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*====================== Fechamento ====================================================*/
|
||||
|
||||
|
||||
|
||||
/*====================== Configuração ES B3 =========================================*/
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs {
|
||||
|
||||
width: 90%;
|
||||
padding: 2vw;
|
||||
margin-top: 0.8vh solid var(--Matriz);
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
|
||||
margin-bottom: 2vh;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 {
|
||||
width: 100%;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .TitutloPopup {
|
||||
|
||||
width: 40%;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup {
|
||||
|
||||
width: 70%;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup input {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
width: 15vw;
|
||||
height: 4vh;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
border: 0.4vw solid var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
padding-left: 1vw;
|
||||
padding-right: 1vw;
|
||||
|
||||
font-size: 0.8vw;
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_2_1);
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup button {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
width: 4vw;
|
||||
height: 6vh;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup img {
|
||||
width: 2vw;
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 {
|
||||
|
||||
width: 100%;
|
||||
height: 30vh;
|
||||
margin-top: 2vh;
|
||||
padding-top: 2vh;
|
||||
overflow-y: auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
|
||||
|
||||
|
||||
background-color: var(--Matriz);
|
||||
|
||||
gap: 1vw;
|
||||
}
|
||||
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 .DashbordItem {
|
||||
|
||||
width: 18vw;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
align-content: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 0.6vw;
|
||||
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
}
|
||||
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 .DashbordItem button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
width: 6vw;
|
||||
height: 3vh;
|
||||
background-color: #c6c6c6;
|
||||
box-shadow: 5px 5px 0px #9a9a9a;
|
||||
font-size: 1vw;
|
||||
color: var(--Matriz);
|
||||
transition: 1s ease;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 .DashbordItem button:hover {
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: -5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
/*=============================== fechamento ===========================================*/
|
||||
|
|
@ -1,210 +0,0 @@
|
|||
.PopPainel.EdicaoAmbientes {
|
||||
height: 60vh;
|
||||
|
||||
top: 10vh;
|
||||
left: 40vw;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .fecharPainel {
|
||||
width: 100%;
|
||||
height: 12vh;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .fecharPainel button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
width: 8vw;
|
||||
height: 5vh;
|
||||
background-color: #c6c6c6;
|
||||
box-shadow: 5px 5px 0px #9a9a9a;
|
||||
font-size: 1vw;
|
||||
color: var(--Matriz);
|
||||
transition: 1s ease;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .fecharPainel button:hover {
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: -5px 5px 0px var(--Cor_Segundaria_5_2);
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel {
|
||||
|
||||
width: 90%;
|
||||
padding: 2vw;
|
||||
height: 70vh;
|
||||
overflow-y: auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
gap: 2vh;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs {
|
||||
|
||||
width: 100%;
|
||||
padding-top: 2vh;
|
||||
margin-top: 0.8vh solid var(--Matriz);
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
margin-bottom: 2vh;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 {
|
||||
width: 100%;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .TitutloPopup {
|
||||
|
||||
width: 40%;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup {
|
||||
|
||||
width: 70%;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup input {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
width: 15vw;
|
||||
height: 4vh;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
border: 0.4vw solid var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
|
||||
padding-left: 1vw;
|
||||
padding-right: 1vw;
|
||||
|
||||
font-size: 0.8vw;
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup button {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
width: 4vw;
|
||||
height: 6vh;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup img {
|
||||
width: 2vw;
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 {
|
||||
|
||||
width: 100%;
|
||||
height: 30vh;
|
||||
margin-top: 2vh;
|
||||
padding-top: 2vh;
|
||||
overflow-y: auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
|
||||
|
||||
|
||||
background-color: var(--Matriz);
|
||||
|
||||
gap: 1vw;
|
||||
}
|
||||
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 .DashbordItem {
|
||||
|
||||
width: 18vw;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
align-content: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 0.6vw;
|
||||
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
|
||||
}
|
||||
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 .DashbordItem button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
width: 6vw;
|
||||
height: 3vh;
|
||||
background-color: #c6c6c6;
|
||||
box-shadow: 5px 5px 0px #9a9a9a;
|
||||
font-size: 1vw;
|
||||
color: var(--Matriz);
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 .DashbordItem button:hover {
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: -5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
.PopPainel {
|
||||
|
||||
background-color: var(--Cor_Segundaria_3_1);
|
||||
box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_3_2);
|
||||
width: 40vw;
|
||||
|
||||
padding: 2vw;
|
||||
position: absolute;
|
||||
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: start;
|
||||
|
||||
}
|
||||
|
|
@ -1,81 +0,0 @@
|
|||
.PopPainel.VisualizacaoRelaotirio {
|
||||
height: 45vh;
|
||||
|
||||
top: 15vh;
|
||||
left: 40vw;
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.VisualizacaoRelaotirio .fecharPainel {
|
||||
width: 100%;
|
||||
height: 12vh;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.PopPainel.VisualizacaoRelaotirio .fecharPainel button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
width: 8vw;
|
||||
height: 5vh;
|
||||
background-color: #c6c6c6;
|
||||
box-shadow: 5px 5px 0px #9a9a9a;
|
||||
font-size: 1vw;
|
||||
color: var(--Matriz);
|
||||
transition: 1s ease;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.PopPainel.VisualizacaoRelaotirio .fecharPainel button:hover {
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: -5px 5px 0px var(--Cor_Segundaria_5_2);
|
||||
}
|
||||
|
||||
|
||||
.PopPainel.VisualizacaoRelaotirio .Titulo_Relatorio {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.PopPainel.VisualizacaoRelaotirio .Titulo_Relatorio h2 {
|
||||
width: 70%;
|
||||
height: 8vh;
|
||||
padding: 1.2vw;
|
||||
background-color: var(--Matriz);
|
||||
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 1.6vw;
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
|
||||
}
|
||||
|
||||
.PopPainel.VisualizacaoRelaotirio .Evento {
|
||||
width: 80%;
|
||||
height: 30vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
align-items: start;
|
||||
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 1.4vw;
|
||||
text-align: center;
|
||||
color: var(--Matriz);
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -1,60 +0,0 @@
|
|||
.bloco_ambiente {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1,
|
||||
.bloco_ambiente .seguimento_2 {
|
||||
padding-top: 2vh;
|
||||
width: 50%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .titulo_Cap,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2 .titulo_Cap,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .titulo_Cap {
|
||||
width: 15vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
text-align: center;
|
||||
font-size: 0.9vw;
|
||||
|
||||
|
||||
background: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 7px 7px 0px var(--Cor_Segundaria_2_2);
|
||||
color: var(--Matriz);
|
||||
margin-top: 2vh;
|
||||
margin-bottom: 2vh;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2 .painel_Cap,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap {
|
||||
overflow-y: scroll;
|
||||
height: 30vh;
|
||||
margin-bottom: 2vh;
|
||||
|
||||
}
|
||||
|
|
@ -1,93 +0,0 @@
|
|||
/* Detalhe - Não é mencionado que todas as declarações CSS devem seguir esse mesmo padrão, onde a linha de classes declaradas segue a ordem das tags, indo da mais externa ("Quem inicia a linha") para a mais interna ("Quem dá o fim para a linha"). Seguindo esse modelo de declaração de classes, todos os elementos se tornam extremamente únicos, minimizando as chances de existir conflitos de classes. */
|
||||
|
||||
/* ========================================= Painel dedicado para estilizar os componentes de busca do capítulo 1 =============================================== */
|
||||
|
||||
/* Esta linha de classe aponta para a classe painel_Cap e define os alinhamentos principais de toda a estrutura. */
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap {
|
||||
width: 80%;
|
||||
height: 74vh;
|
||||
padding: 2vw;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para a classe coluna_1 e define as extensões máximas que devem ser obedecidas, enquanto ajusta os alinhamentos dinâmicos para que o painel se adapte, utilizando o modelo flex. */
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para estilizar um botão que está dentro de insercao_ambiente. */
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .insercao_ambiente button {
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
width: 7vw;
|
||||
height: 6vh;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
color: var(--Matriz);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para a classe pesquisa e define os limites de extensão, além de alinhar todos os elementos dentro dessas extensões. */
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa {
|
||||
width: 70%;
|
||||
height: 8vh;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para estilizar um input que está dentro de pesquisa. */
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa input {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
width: 13vw;
|
||||
height: 4vh;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
border: 0.4vw solid var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
padding-left: 1vw;
|
||||
padding-right: 1vw;
|
||||
|
||||
font-size: 0.8vw;
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_2_1);
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para estilizar um botão que está dentro de pesquisa. */
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa button {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
width: 4vw;
|
||||
height: 6vh;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para estilizar uma imagem que está sendo usada como um pequeno detalhe no botão de pesquisa. */
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa img {
|
||||
width: 2vw;
|
||||
filter: drop-shadow(2px 2px 0px var(--Cor_Segundaria_2_2));
|
||||
}
|
||||
|
||||
/* ========================================= Fechamento do bloco de busca =============================================== */
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
/* Este caminho de classes aponta para a classe .painel_Cap, onde é determinada a estilização principal do painel. Além disso, ele alinha todos os elementos dentro dele e define um scroll vertical (overflow-y: auto), permitindo que, caso os elementos ultrapassem a altura do painel, um deslocamento seja criado para que o usuário consiga visualizar os itens além da altura do painel, sem sair da área do painel. */
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2 .painel_Cap {
|
||||
width: 90%;
|
||||
height: 20vh;
|
||||
padding: 2vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
|
||||
gap: 1vw;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
|
@ -1,56 +0,0 @@
|
|||
/* Detalhe - Não é mencionado que todas as declarações CSS seguem esse padrão, onde a linha de classes declaradas segue a ordem das tags, indo da mais externa ("Quem inicia a linha") para a mais interna ("Quem dá o fim para a linha"). Seguindo esse modelo de declaração de classes, todos os elementos se tornam extremamente únicos, minimizando as chances de existirem conflitos de classes. */
|
||||
|
||||
/* ========================================= Estrutura de decisão, para qual grupo de relatórios apresentar OFF, ON, ERRO =============================================== */
|
||||
|
||||
/* Este caminho de classes aponta para a classe .painel_Cap, onde é determinada a estilização principal do painel. Além disso, ele alinha todos os elementos dentro dele e define um scroll vertical (overflow-y: auto), permitindo que, caso os elementos ultrapassem a altura do painel, um deslocamento seja criado para que o usuário consiga visualizar os itens além da altura do painel, sem sair da área do painel. */
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap {
|
||||
width: 90%;
|
||||
height: 40vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
|
||||
gap: 1vw;
|
||||
overflow-y: auto;
|
||||
|
||||
padding: 2vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para a classe .coluna_1, onde ela é usada somente para alinhar os elementos dentro dela. */
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap .coluna_1 {
|
||||
width: 100%;
|
||||
margin-bottom: 2vh;
|
||||
}
|
||||
|
||||
/* Esta linha de classe aponta para a tag button, com estilizações detalhadas para ela. */
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap .coluna_1 button {
|
||||
outline: none;
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
width: 32.33%;
|
||||
height: 6vh;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 1vw;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* ========================================= Fechamento da estrutura de decisão =============================================== */
|
||||
|
||||
/* Esta linha de classe aponta para a classe .coluna_2, onde ela é utilizada apenas para definir o alinhamento dos itens dentro dela, sendo os painéis de relatórios de cada um dos casos de escolha. */
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap .coluna_2 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
@import url(../../../../Css/global/import.css);
|
||||
|
||||
@import url(./pop.css);
|
||||
@import url(./sec_cap_1.css);
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
@import url(../../../../global/import.css);
|
||||
|
||||
@import url(./menu.css);
|
||||
@import url(./tela.css);
|
||||
@import url(./menu_houver.css);
|
||||
|
|
@ -1,167 +0,0 @@
|
|||
body {
|
||||
display: flex;
|
||||
|
||||
}
|
||||
|
||||
.voltar {
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin-top: 2vh;
|
||||
margin-left: 1vw;
|
||||
margin-bottom: 2vh;
|
||||
gap: 0.5vw;
|
||||
text-decoration: none;
|
||||
|
||||
}
|
||||
|
||||
.voltar .escrita_A {
|
||||
width: 10vw;
|
||||
height: 4vh;
|
||||
background-color: var(--Vazio_Corpo);
|
||||
box-shadow: 5px 5px 0px var(--Vazio_Fundo);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.3vw;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 0.8vw;
|
||||
color: var(--Matriz);
|
||||
transition: 1s ease;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.voltar .retrato_A {
|
||||
width: 2vw;
|
||||
height: 4vh;
|
||||
padding: 0.3vw;
|
||||
background-color: var(--Vazio_Corpo);
|
||||
box-shadow: 5px 5px 0px var(--Vazio_Fundo);
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
.menu {
|
||||
width: 25vw;
|
||||
height: 100vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* Estilo customizado para o scroll (somente no Webkit) */
|
||||
.menu::-webkit-scrollbar {
|
||||
width: 0.2vw;
|
||||
/* Largura da barra de rolagem */
|
||||
height: 0.2vw;
|
||||
/* Para scroll horizontal, se necessário */
|
||||
}
|
||||
|
||||
/* Estilo para o polegar da barra de rolagem */
|
||||
.menu::-webkit-scrollbar-thumb {
|
||||
background-color: var(--Cor_Segundaria_3_1);
|
||||
/* Cor da parte da barra que você arrasta */
|
||||
border-radius: 10px;
|
||||
/* Borda arredondada */
|
||||
/* Borda ao redor do polegar */
|
||||
}
|
||||
|
||||
/* Aumentando o tamanho do track (fundo da barra de rolagem) */
|
||||
.menu::-webkit-scrollbar-track {
|
||||
background-color: var(--Cor_Segundaria_3_2);
|
||||
/* Cor do fundo do scroll */
|
||||
border-radius: 10px;
|
||||
/* Borda arredondada */
|
||||
/* Usar diretamente a largura ou altura aqui para aumentar o track */
|
||||
width: 1vw;
|
||||
/* Aumentando a largura do track para o scroll vertical */
|
||||
height: 1vw;
|
||||
/* Aumentando a altura do track para o scroll horizontal */
|
||||
}
|
||||
|
||||
.contener_1,
|
||||
.contener_2,
|
||||
.contener_3 {
|
||||
width: 100%;
|
||||
padding-bottom: 1vh;
|
||||
list-style: none;
|
||||
text-decoration: none;
|
||||
padding-top: 1vh;
|
||||
border-top: 0.1vh solid var(--Matriz);
|
||||
|
||||
}
|
||||
|
||||
.contener_1 li,
|
||||
.contener_2 li,
|
||||
.contener_3 li {
|
||||
list-style: none;
|
||||
text-decoration: none;
|
||||
|
||||
}
|
||||
|
||||
.contener_1 .titulos,
|
||||
.contener_2 .titulos,
|
||||
.contener_3 .titulos {
|
||||
width: 15vw;
|
||||
height: 5vh;
|
||||
padding: 0.5vw;
|
||||
margin-left: 1vw;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
gap: 1vw;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 1vw;
|
||||
color: var(--Matriz);
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.contener_1 .titulos img,
|
||||
.contener_2 .titulos img,
|
||||
.contener_3 .titulos img {
|
||||
width: 3vw;
|
||||
}
|
||||
|
||||
.contener_1 .opicao button,
|
||||
.contener_2 .opicao button,
|
||||
.contener_3 .opicao button {
|
||||
display: flex;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
gap: 0.5vw;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
.contener_1 .opicao .retrato,
|
||||
.contener_2 .opicao .retrato,
|
||||
.contener_3 .opicao .retrato {
|
||||
width: 2vw;
|
||||
filter: drop-shadow(5px 5px 0px var(--Vazio_Fundo));
|
||||
transition: 1s ease;
|
||||
}
|
||||
|
||||
.contener_1 .opicao .escrita,
|
||||
.contener_2 .opicao .escrita,
|
||||
.contener_3 .opicao .escrita {
|
||||
width: 12vw;
|
||||
margin-right: 2vw;
|
||||
padding: 0.6vw;
|
||||
background-color: var(--Vazio_Corpo);
|
||||
box-shadow: 5px 5px 0px var(--Vazio_Fundo);
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
transition: 1s ease;
|
||||
}
|
||||
|
|
@ -1,54 +0,0 @@
|
|||
.contener_1 .opicao button:hover,
|
||||
.contener_2 .opicao button:hover,
|
||||
.contener_3 .opicao button:hover {
|
||||
|
||||
|
||||
.retrato {
|
||||
width: 2vw;
|
||||
filter: drop-shadow(5px 5px 0px var(--Cor_Segundaria_2_2));
|
||||
}
|
||||
|
||||
.escrita {
|
||||
width: 10vw;
|
||||
padding: 0.6vw;
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.voltar:hover {
|
||||
|
||||
|
||||
.escrita_A {
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.retrato_A {
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.menu {
|
||||
animation: aberturaConfig 1s ease;
|
||||
}
|
||||
|
||||
@keyframes aberturaConfig {
|
||||
|
||||
from {
|
||||
width: 0;
|
||||
|
||||
}
|
||||
|
||||
to {
|
||||
width: 25vw;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
.telaConfig {
|
||||
width: 75vw;
|
||||
}
|
||||
|
|
@ -0,0 +1,82 @@
|
|||
.Capa {
|
||||
width: 100%;
|
||||
height: 7vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.Capa img {
|
||||
width: 10vw;
|
||||
}
|
||||
|
||||
|
||||
.Capitulo_1,
|
||||
.Capitulo_2 {
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.Capitulo_1 {
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
}
|
||||
|
||||
.Capitulo_1 .element_1 {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
font-size: 1vw;
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .element_1 img {
|
||||
width: 2vw;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_2 {
|
||||
|
||||
margin-top: 2vh;
|
||||
height: 60vh;
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
align-items: start;
|
||||
|
||||
|
||||
column-gap: 10vw;
|
||||
/* Mantém a separação horizontal */
|
||||
row-gap: 6vw;
|
||||
/* Reduz a separação vertical */
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_2 .element_1 {
|
||||
width: 25vw;
|
||||
height: 7vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 1.5vw;
|
||||
|
||||
font-size: 1.7vw;
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
}
|
||||
|
||||
.Capitulo_2 .element_1 img {
|
||||
width: 3vw;
|
||||
}
|
||||
|
|
@ -5,6 +5,7 @@
|
|||
@import url(./tela_hover.css);
|
||||
|
||||
@import url(../../../../Css/global/import.css);
|
||||
@import url(../../../../Css/global/Scroll.css);
|
||||
|
||||
.estrutura {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -203,7 +203,8 @@
|
|||
|
||||
}
|
||||
|
||||
.filheira_a {
|
||||
.filheira_a,
|
||||
.filheira {
|
||||
text-decoration: none;
|
||||
color: var(--Matriz);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -114,8 +114,8 @@
|
|||
|
||||
}
|
||||
|
||||
|
||||
a:hover {
|
||||
a:hover,
|
||||
.filheira:hover {
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
}
|
||||
|
|
@ -145,7 +145,7 @@ a:hover {
|
|||
.subcolunas_2 button:hover {
|
||||
margin-right: 1vw;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px 2px var(--Cor_Segundaria_2_2);
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
box-shadow: 5px 5px 0px 2px var(--Cor_Segundaria_5_2);
|
||||
transition: 1s ease;
|
||||
}
|
||||
|
|
@ -21,7 +21,7 @@ Cabeçario da tela
|
|||
flex-direction: row;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
justify-content: center;
|
||||
transition: 1s ease;
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -8,4 +8,72 @@
|
|||
width: 80vw;
|
||||
z-index: 1;
|
||||
transition: 1s ease;
|
||||
|
||||
.Capitulo_1 .linha_1 {
|
||||
width: 25vw;
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_1 .painel {
|
||||
width: 25vw;
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_1 .Corpo {
|
||||
|
||||
width: 25vw;
|
||||
transition: 1s ease;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_1 .cap {
|
||||
|
||||
width: 25vw;
|
||||
transition: 1s ease;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.Capitulo_1 .linha_2 {
|
||||
|
||||
|
||||
width: 15vw;
|
||||
transition: 1s ease;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.Capitulo_1 .linha_2 .painel {
|
||||
|
||||
|
||||
width: 15vw;
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_2 .Corpo_1 {
|
||||
|
||||
width: 15vw;
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_2 .Corpo_2 {
|
||||
|
||||
width: 15vw;
|
||||
height: 15vh;
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_2 .cap {
|
||||
|
||||
width: 15vw;
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -1,99 +0,0 @@
|
|||
.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap {
|
||||
|
||||
width: 96vw;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
|
||||
gap: 1vw;
|
||||
overflow-y: scroll;
|
||||
|
||||
padding: 2vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
height: 20vh;
|
||||
}
|
||||
|
||||
|
||||
.subpainel_Status {
|
||||
width: 90%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_1 {
|
||||
width: 20%;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_2 {
|
||||
width: 70%;
|
||||
height: 8vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 1vw;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_1 .titulo {
|
||||
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 0.8vw;
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_2 .Mensagem_ambiente {
|
||||
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
margin-left: 1vw;
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
.subpainel_Status .bloco_2 .button_rel button {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
.subpainel_Status .bloco_2 .button_rel img {
|
||||
width: 2vw;
|
||||
filter: drop-shadow(5px 5px 0px var(--Cor_Segundaria_2_2));
|
||||
}
|
||||
|
||||
|
||||
.subpainel_Status .bloco_2 .status_ambiente {
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
|
||||
margin-right: 1vw;
|
||||
background-color: var(--Cor_Segundaria_2_2);
|
||||
padding: 0.2vw;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 2vw;
|
||||
width: 5vw;
|
||||
height: 5vh;
|
||||
}
|
||||
|
|
@ -1,142 +0,0 @@
|
|||
.painel_Cap .carrossel_host {
|
||||
width: 100%;
|
||||
height: 20vh;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.painel_Cap .carrossel_host .list {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 15vh;
|
||||
scroll-behavior: smooth;
|
||||
|
||||
padding: 1vw;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2vw;
|
||||
}
|
||||
|
||||
.painel_Cap .carrossel_host .list .item button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
border-radius: 2vw;
|
||||
background-color: var(--Matriz);
|
||||
padding: 2.5vw;
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
font-family: var(--font_titulo);
|
||||
}
|
||||
|
||||
.painel_Cap .carrossel_host .button button {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
padding: 0.5vw;
|
||||
border-radius: 0.5vw;
|
||||
backdrop-filter: blur(2px);
|
||||
background-color: #00000070;
|
||||
}
|
||||
|
||||
.painel_Cap .carrossel_host .button img {
|
||||
width: 2vw;
|
||||
}
|
||||
|
||||
#next_1 {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 8vh;
|
||||
}
|
||||
|
||||
#prev_1 {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 8vh;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.bloco_ambiente .dashbord {
|
||||
width: 100%;
|
||||
height: 50vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.bloco_ambiente .dashbord .dash_titulo {
|
||||
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
width: 100%;
|
||||
height: 5vh;
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .dashbord .dash_painel {
|
||||
width: 90%;
|
||||
height: 40vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
|
||||
gap: 1vw;
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.bloco_ambiente .dashbord .dash_painel .dash_subpaneis {
|
||||
width: 10vw;
|
||||
height: 10vh;
|
||||
padding: 0.4vw;
|
||||
background-color: var(--Matriz);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .dashbord .dash_painel .dash_subpaneis .sub_titulo {
|
||||
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
border-bottom: 0.3vh solid var(--Cor_Segundaria_5_1);
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .dashbord .dash_painel .dash_subpaneis .sub_titulo .Name {
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
font-size: 0.5vw;
|
||||
}
|
||||
|
||||
.bloco_ambiente .dashbord .dash_painel .dash_subpaneis .sub_titulo .sub_status {
|
||||
font-family: var(--font_titulo);
|
||||
|
||||
font-size: 0.6vw;
|
||||
}
|
||||
|
||||
.OFF {
|
||||
color: red;
|
||||
|
||||
}
|
||||
|
||||
.ON {
|
||||
color: var(--Cor_Segundaria_2_1);
|
||||
}
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
.bloco_ambiente .coluna_1 {
|
||||
width: 100%;
|
||||
margin-bottom: 2vh;
|
||||
}
|
||||
|
||||
.bloco_ambiente .coluna_1 button {
|
||||
outline: none;
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
width: 32.33%;
|
||||
height: 6vh;
|
||||
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
.coluna_2 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.opicao button {
|
||||
outline: none;
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
width: 20vw;
|
||||
height: 6vh;
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1.2vw;
|
||||
}
|
||||
|
|
@ -1,87 +0,0 @@
|
|||
.bloco_ambiente {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1,
|
||||
.bloco_ambiente .seguimento_2 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.subseguimento_1 {
|
||||
width: 70%;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.subseguimento_2 {
|
||||
width: 30%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_1 .capitulo_1 .titulo_Cap,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2 .titulo_Cap,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .titulo_Cap {
|
||||
width: 15vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
text-align: center;
|
||||
font-size: 0.9vw;
|
||||
|
||||
|
||||
background: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 7px 7px 0px var(--Cor_Segundaria_2_2);
|
||||
color: var(--Matriz);
|
||||
margin-top: 2vh;
|
||||
margin-bottom: 2vh;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2 .painel_Cap {
|
||||
width: 65vw;
|
||||
|
||||
padding: 2vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap {
|
||||
width: 26vw;
|
||||
|
||||
padding: 2vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
}
|
||||
|
||||
.bloco_ambiente .seguimento_2 .capitulo_2 .painel_Cap,
|
||||
.bloco_ambiente .seguimento_2 .capitulo_3 .painel_Cap {
|
||||
overflow-y: scroll;
|
||||
height: 80vh;
|
||||
margin-bottom: 2vh;
|
||||
|
||||
}
|
||||
|
|
@ -1,74 +0,0 @@
|
|||
.bloco_home {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .seguimento {
|
||||
width: 50%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bloco_home .capitulo_1,
|
||||
.bloco_home .capitulo_2,
|
||||
.bloco_home .capitulo_3 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bloco_home .capitulo_1 .titulo,
|
||||
.bloco_home .capitulo_2 .titulo,
|
||||
.bloco_home .capitulo_3 .titulo {
|
||||
width: 15vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
text-align: center;
|
||||
font-size: 0.9vw;
|
||||
|
||||
|
||||
background: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 7px 7px 0px var(--Cor_Segundaria_2_2);
|
||||
color: var(--Matriz);
|
||||
margin-top: 2vh;
|
||||
margin-bottom: 2vh;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .capitulo_1 .painel,
|
||||
.bloco_home .capitulo_2 .painel,
|
||||
.bloco_home .capitulo_3 .painel {
|
||||
width: 46vw;
|
||||
|
||||
|
||||
padding: 2vh;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .capitulo_1 .painel {
|
||||
height: 20vh;
|
||||
}
|
||||
|
||||
.bloco_home .capitulo_2 .painel {
|
||||
overflow-y: scroll;
|
||||
height: 40vh;
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .capitulo_3 .painel {
|
||||
overflow-y: scroll;
|
||||
height: 80vh;
|
||||
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
.corpo_controler {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.seguimento_1,
|
||||
.seguimento_2 {
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 50%;
|
||||
gap: 2vw;
|
||||
}
|
||||
|
||||
.dashbord_user_1 {
|
||||
width: 18vw;
|
||||
height: 20vh;
|
||||
background-color: var(--Matriz);
|
||||
}
|
||||
|
||||
.dashbord_user_2,
|
||||
.dashbord_user_3 {
|
||||
width: 20vw;
|
||||
height: 8vh;
|
||||
background-color: var(--Matriz);
|
||||
}
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
.bloco_home .dashbord {
|
||||
width: 100%;
|
||||
height: 50vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .dashbord .dash_titulo {
|
||||
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
width: 100%;
|
||||
height: 5vh;
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
font-size: 1vw;
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .dashbord .dash_painel {
|
||||
width: 90%;
|
||||
height: 40vh;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
|
||||
gap: 1vw;
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.bloco_home .dashbord .dash_painel .dash_subpaneis {
|
||||
width: 10vw;
|
||||
height: 10vh;
|
||||
padding: 0.4vw;
|
||||
background-color: var(--Matriz);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .dashbord .dash_painel .dash_subpaneis .sub_titulo {
|
||||
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
border-bottom: 0.3vh solid var(--Cor_Segundaria_5_1);
|
||||
|
||||
}
|
||||
|
||||
.bloco_home .dashbord .dash_painel .dash_subpaneis .sub_titulo .Name {
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
font-size: 0.5vw;
|
||||
}
|
||||
|
||||
.bloco_home .dashbord .dash_painel .dash_subpaneis .sub_titulo .sub_status {
|
||||
font-family: var(--font_titulo);
|
||||
|
||||
font-size: 0.6vw;
|
||||
}
|
||||
|
||||
.OFF {
|
||||
color: red;
|
||||
|
||||
}
|
||||
|
||||
.ON {
|
||||
color: var(--Cor_Segundaria_2_1);
|
||||
}
|
||||
|
|
@ -1,149 +0,0 @@
|
|||
.subCapitulo_1 {
|
||||
width: 100%;
|
||||
height: 20vh;
|
||||
|
||||
}
|
||||
|
||||
.subCapitulo_1 .carrossel_host {
|
||||
width: 100%;
|
||||
height: 20vh;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.subCapitulo_1 .carrossel_host .list {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 15vh;
|
||||
scroll-behavior: smooth;
|
||||
|
||||
padding: 1vw;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2vw;
|
||||
}
|
||||
|
||||
.subCapitulo_1 .carrossel_host .list .item button {
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
border-radius: 2vw;
|
||||
background-color: var(--Matriz);
|
||||
padding: 2.5vw;
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
font-family: var(--font_titulo);
|
||||
}
|
||||
|
||||
.subCapitulo_1 .carrossel_host .button button {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
|
||||
padding: 0.5vw;
|
||||
border-radius: 0.5vw;
|
||||
backdrop-filter: blur(2px);
|
||||
background-color: #00000070;
|
||||
}
|
||||
|
||||
.subCapitulo_1 .carrossel_host .button img {
|
||||
width: 2vw;
|
||||
}
|
||||
|
||||
#next {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 8vh;
|
||||
}
|
||||
|
||||
#prev {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 8vh;
|
||||
|
||||
}
|
||||
|
||||
.subCapitulo_2 {
|
||||
width: 100%;
|
||||
padding-bottom: 2vh;
|
||||
align-items: center;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.subCapitulo_2 .titulo_Sub_cap {
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 1vw;
|
||||
color: var(--Matriz);
|
||||
width: 90%;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
}
|
||||
|
||||
.subCapitulo_2 .relatorio {
|
||||
|
||||
margin-top: 2vh;
|
||||
padding-top: 1vh;
|
||||
width: 40vw;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 0.5vw;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.subCapitulo_2 .relatorio .icon img {
|
||||
width: 3vw;
|
||||
padding: 0.5vw;
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
}
|
||||
|
||||
.subCapitulo_2 .relatorio .painel_Ren {
|
||||
width: 20vw;
|
||||
height: 8vh;
|
||||
padding: 0.5vw;
|
||||
background-color: var(--Cor_Segundaria_2_1);
|
||||
box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2);
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
.subCapitulo_2 .relatorio .painel_Ren .cabecario {
|
||||
width: 100%;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
border-radius: 1vw;
|
||||
|
||||
gap: 1vw;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
background-color: var(--Matriz);
|
||||
font-size: 0.7vw;
|
||||
}
|
||||
|
||||
.subCapitulo_2 .relatorio .painel_Ren .cabecario button {
|
||||
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
border-radius: 2vw;
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
width: 6vw;
|
||||
height: 4vh;
|
||||
color: var(--Matriz);
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
|
@ -1,11 +1,3 @@
|
|||
@import url(../../../global/import.css);
|
||||
|
||||
@import url(./Ambiente/BlocoAmbiente.css);
|
||||
@import url(./Ambiente/Ambi_sec_cap_1.css);
|
||||
@import url(./Ambiente/Ambi_sec_cap_2.css);
|
||||
@import url(./Ambiente/Ambi_sec_cap_3.css);
|
||||
|
||||
@import url(./Usuário/BlocoUsuário.css);
|
||||
@import url(./Usuário/User_sec_cap_1.css);
|
||||
@import url(./Usuário/User_sec_cap_2.css);
|
||||
@import url(./Usuário/User_sec_cap_3.css);
|
||||
@import url(./tela.css);
|
||||
@import url(./Aplicacoes.css);
|
||||
@import url(./Painel_list.css);
|
||||
|
|
@ -0,0 +1,231 @@
|
|||
.capitulo_2 .CorpoArtificial {
|
||||
width: 89.6%;
|
||||
height: 88vh;
|
||||
|
||||
padding-top: 2vw;
|
||||
|
||||
padding-left: 5vw;
|
||||
padding-right: 5vw;
|
||||
|
||||
background-color: #D9D9D9;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 2vh;
|
||||
}
|
||||
|
||||
.Capitulo_1,
|
||||
.Capitulo_2 {
|
||||
width: 100%;
|
||||
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 2vw;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_1 {
|
||||
|
||||
width: 30vw;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
row-gap: 2vh;
|
||||
transition: 1s ease;
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_1 .painel {
|
||||
|
||||
|
||||
width: 30vw;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
transition: 1s ease;
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_1 .Corpo {
|
||||
|
||||
width: 30vw;
|
||||
height: 47vh;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
display: flex;
|
||||
align-items: start;
|
||||
justify-content: center;
|
||||
align-content: start;
|
||||
transition: 1s ease;
|
||||
|
||||
|
||||
overflow-y: auto;
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_1 .cap {
|
||||
|
||||
width: 30vw;
|
||||
height: 5vh;
|
||||
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: 1s ease;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.Capitulo_1 .linha_2 {
|
||||
|
||||
width: 20vw;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
row-gap: 2vh;
|
||||
transition: 1s ease;
|
||||
}
|
||||
|
||||
|
||||
.Capitulo_1 .linha_2 .painel {
|
||||
|
||||
|
||||
width: 20vw;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_2 .Corpo_1 {
|
||||
|
||||
width: 20vw;
|
||||
height: 25vh;
|
||||
transition: 1s ease;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_2 .Corpo_1 .linhaMes_1 {
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 4vw;
|
||||
|
||||
font-size: 1.6vw;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_1 .linha_2 .Corpo_1 .linhaMes_1 button {
|
||||
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
font-family: var(--font_titulo);
|
||||
font-size: 1.7vw;
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.Capitulo_1 .linha_2 .Corpo_2 {
|
||||
|
||||
width: 20vw;
|
||||
height: 15vh;
|
||||
transition: 1s ease;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.Capitulo_1 .linha_2 .cap {
|
||||
|
||||
width: 20vw;
|
||||
height: 5vh;
|
||||
transition: 1s ease;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_2 .painel {
|
||||
width: 97%;
|
||||
height: 40vh;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Capitulo_2 .cap {
|
||||
width: 100%;
|
||||
height: 5vh;
|
||||
|
||||
background-color: var(--Cor_Segundaria_5_1);
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Matriz);
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.Capitulo_2 .Corpo {
|
||||
|
||||
width: 100%;
|
||||
height: 25vh;
|
||||
|
||||
background-color: var(--Matriz);
|
||||
font-family: var(--font_titulo);
|
||||
color: var(--Cor_Segundaria_5_1);
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
|
@ -31,7 +31,7 @@
|
|||
padding: 3vh 2vw;
|
||||
width: 30vw;
|
||||
height: 75vh;
|
||||
border: 3px solid rgb(0, 119, 255);
|
||||
border: 3px solid var(--Cor_Segundaria_5_1);
|
||||
background-color: rgb(255, 255, 255);
|
||||
z-index: 999;
|
||||
position: fixed;
|
||||
|
|
|
|||
|
|
@ -18,3 +18,7 @@ async function getApiUrl() {
|
|||
function getAuthToken() {
|
||||
return localStorage.getItem('x-access-token');
|
||||
}
|
||||
|
||||
function getAuthDomain() {
|
||||
return localStorage.getItem('Id_Cliente');
|
||||
}
|
||||
|
|
|
|||
|
|
@ -77,6 +77,7 @@ document.getElementById("formLogin").addEventListener("submit", async function (
|
|||
localStorage.setItem('x-access-token', data.token); // Armazena o token de autenticação no localStorage
|
||||
// Redireciona o usuário para a página do ambiente do usuário
|
||||
window.location.href = "./Ambiente_Usuario.html";
|
||||
|
||||
}
|
||||
|
||||
/* Caso de erro*/
|
||||
|
|
|
|||
|
|
@ -0,0 +1,160 @@
|
|||
|
||||
|
||||
async function InteracoesTelas_Config() {
|
||||
//ControladorDeVisualizacao(InfoGeral);
|
||||
|
||||
|
||||
|
||||
const Config_texts = document.getElementById('Voltar_config');
|
||||
|
||||
const Home_texts = document.getElementById('Home_1');
|
||||
const Home_icon = document.getElementById('Home_2');
|
||||
|
||||
// Adiciona eventos para alternar entre as telas
|
||||
Config_texts.addEventListener('click', () => carregarTela_config('config2'));
|
||||
|
||||
Home_texts.addEventListener('click', () => carregarTela_config('home2'));
|
||||
Home_icon.addEventListener('click', () => carregarTela_config('home2'));
|
||||
}
|
||||
|
||||
async function carregarTela_config(tela) {
|
||||
|
||||
const telaVisualizacao = document.getElementById('TelaVisualizacao');
|
||||
const scriptPaths = {
|
||||
|
||||
//Alinhamento das telas por datas, aqui são organizadas das possiveis respostas de cada botão e os caminhos scripts cada uma delas necessita para o seu funcionamento.
|
||||
home2: {
|
||||
func: './js/page/Modulo_Construcao/Funcao/Home/Func_Home.js',
|
||||
html: './js/page/Modulo_Construcao/Painel/Home/Html_Home.js',
|
||||
mensagem: 'Carregando ...',
|
||||
},
|
||||
moni: {
|
||||
func: './js/page/Modulo_Construcao/Funcao/Monitoramento/Func_Moni.js',
|
||||
html: './js/page/Modulo_Construcao/Painel/Monitoramento/Html_Moni.js',
|
||||
mensagem: 'Carregando ...',
|
||||
},
|
||||
config2: {
|
||||
func: './js/page/Modulo_Construcao/Funcao/Config/Estrutura/config.js',
|
||||
html: './js/page/Modulo_Construcao/Painel/Config/Estrutura/Estrutura_Config_Html.js',
|
||||
mensagem: 'Carregando ...',
|
||||
},
|
||||
};
|
||||
|
||||
if (!scriptPaths[tela]) {
|
||||
console.error('Tela inválida:', tela);
|
||||
return;
|
||||
}
|
||||
|
||||
// Remove scripts antigos antes de adicionar novos
|
||||
document.querySelectorAll('script[data-dinamico]').forEach(script => script.remove());
|
||||
|
||||
try {
|
||||
// Aguarda o carregamento dos dois scripts
|
||||
await Promise.all([
|
||||
carregarScript(scriptPaths[tela].func),
|
||||
carregarScript(scriptPaths[tela].html),
|
||||
]);
|
||||
|
||||
// Aplicação de if realizam a modificação da mensagem de cada condicional para a estrutura de seu html respectivo.
|
||||
|
||||
// Estrutura html do home
|
||||
if (tela === 'home' && typeof estruturaHtml_Home === 'function') {
|
||||
|
||||
}
|
||||
|
||||
// Estrutura html de monitoramento
|
||||
if (tela === 'moni' && typeof estruturaHtml_Home === 'function') {
|
||||
scriptPaths[tela].mensagem = estruturaHtml_Moni();
|
||||
}
|
||||
|
||||
// Estrutura html de configuração
|
||||
if (tela === 'config2' && typeof estruturaHtml_Home === 'function') {
|
||||
// Verifica se a função EstruturaEsqueleto existe antes de chamar
|
||||
|
||||
const fimPainel = document.getElementById('entrada_2')
|
||||
fimPainel.innerHTML = '';
|
||||
|
||||
await criarBlocos();
|
||||
console.log('config')
|
||||
|
||||
}
|
||||
|
||||
telaVisualizacao.innerHTML = scriptPaths[tela].mensagem;
|
||||
console.log(`Tela ${tela} carregada com sucesso!`);
|
||||
} catch (error) {
|
||||
console.error('Erro ao carregar os scripts:', error);
|
||||
}
|
||||
}
|
||||
|
||||
// função que carreca os scripts dentro do html
|
||||
function carregarScript(src) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const script = document.createElement('script');
|
||||
script.src = src;
|
||||
script.dataset.dinamico = true; // Marca como script dinâmico
|
||||
script.onload = () => resolve();
|
||||
script.onerror = () => reject(new Error(`Erro ao carregar o script ${src}`));
|
||||
document.body.appendChild(script);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Carrega a tela 'home' automaticamente ao iniciar
|
||||
//carregarTela('home');
|
||||
|
||||
// Controlador de visualização sobre as opições que existem dentro do ambiente do usuário
|
||||
function ControladorDeVisualizacao_config(InfoGeral) {
|
||||
|
||||
if (InfoGeral.empresa.nome == "itguys.com.br") {
|
||||
const PainelMoniIcon = document.getElementById('sub_entrada_moni_1');
|
||||
const PainelMoniButton = document.getElementById('sub_entrada_moni_2');
|
||||
|
||||
|
||||
PainelMoniButton.innerHTML = "<h2>Monitormaneto</h2>"
|
||||
PainelMoniIcon.innerHTML = `<img class="img" src="./Acessts/Imagens/Iconis/monitor.png" alt="">`
|
||||
|
||||
PainelMoniButton.addEventListener('click', () => carregarTela('moni'));
|
||||
PainelMoniIcon.addEventListener('click', () => carregarTela('moni'));
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
setTimeout(async () => {
|
||||
const ConfigLoad = document.getElementById('entrada_2');
|
||||
|
||||
if (ConfigLoad) {
|
||||
// Verifica se o conteúdo do elemento não está vazio
|
||||
if (ConfigLoad.innerHTML.trim() !== "") {
|
||||
|
||||
|
||||
const estilos_config = document.getElementById('conexao');
|
||||
|
||||
const estilos_config_tela = document.getElementById('conexao_tela');
|
||||
|
||||
estilos_config_tela.href = '';
|
||||
estilos_config.href = './Css/page/Ambiente/Config/Config.css';
|
||||
|
||||
InteracoesTelas_Config();
|
||||
}
|
||||
} else {
|
||||
console.error("Elemento 'entrada_2' não encontrado.");
|
||||
}
|
||||
setTimeout(ConfigLoad == null, 500) // Salva um valor no localStorage
|
||||
}, 300); // Executa as funções 3 segundos após o carregamento do DOM
|
||||
|
||||
|
||||
|
||||
// Verifica se o elemento existe
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -1,70 +0,0 @@
|
|||
|
||||
|
||||
//Variavel botão 2 responsavel por inicar a função
|
||||
var botao_2 = document.getElementById('opicao_1');
|
||||
botao_2.addEventListener('click', surgir2);
|
||||
|
||||
//Variavel botão 3 responsavel por inicar a função
|
||||
var botao_3 = document.getElementById('opicao_3');
|
||||
botao_3.addEventListener('click', surgir3);
|
||||
|
||||
//Variavel botão 4 responsavel por inicar a função
|
||||
var botao_4 = document.getElementById('opicao_4');
|
||||
botao_4.addEventListener('click', surgir4);
|
||||
|
||||
//Variavel botão 5 responsavel por inicar a função
|
||||
var botao_5 = document.getElementById('opicao_5');
|
||||
botao_5.addEventListener('click', surgir5);
|
||||
|
||||
//Variavel botão 6 responsavel por inicar a função
|
||||
var botao_6 = document.getElementById('opicao_6');
|
||||
botao_6.addEventListener('click', surgir6);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
//Nessa função o conteudo da tela é modificado e novas informaçõe são apresentadas 'lembre de alinhar o nome da função com o seu botão respecitivo, sendo essa do botão 2'
|
||||
function surgir2() {
|
||||
var estilo = document.getElementById('conexao');
|
||||
var painel = document.getElementById('preenchimento');
|
||||
estilo.href = 'ola2';
|
||||
painel.innerHTML = 'ola2';
|
||||
}
|
||||
|
||||
|
||||
//Nessa função o conteudo da tela é modificado e novas informaçõe são apresentadas 'lembre de alinhar o nome da função com o seu botão respecitivo, sendo essa do botão 3'
|
||||
function surgir3() {
|
||||
var estilo = document.getElementById('conexao');
|
||||
var painel = document.getElementById('preenchimento');
|
||||
estilo.href = 'ola3';
|
||||
painel.innerHTML = 'ola3';
|
||||
}
|
||||
|
||||
|
||||
//Nessa função o conteudo da tela é modificado e novas informaçõe são apresentadas 'lembre de alinhar o nome da função com o seu botão respecitivo, sendo essa do botão 4'
|
||||
function surgir4() {
|
||||
var estilo = document.getElementById('conexao');
|
||||
var painel = document.getElementById('preenchimento');
|
||||
estilo.href = 'ola3';
|
||||
painel.innerHTML = 'ola4';
|
||||
}
|
||||
|
||||
|
||||
//Nessa função o conteudo da tela é modificado e novas informaçõe são apresentadas 'lembre de alinhar o nome da função com o seu botão respecitivo, sendo essa do botão 5'
|
||||
function surgir5() {
|
||||
var estilo = document.getElementById('conexao');
|
||||
var painel = document.getElementById('preenchimento');
|
||||
estilo.href = 'ola3';
|
||||
painel.innerHTML = 'ola5';
|
||||
}
|
||||
|
||||
|
||||
//Nessa função o conteudo da tela é modificado e novas informaçõe são apresentadas 'lembre de alinhar o nome da função com o seu botão respecitivo, sendo essa do botão 6'
|
||||
function surgir6() {
|
||||
var estilo = document.getElementById('conexao');
|
||||
var painel = document.getElementById('preenchimento');
|
||||
estilo.href = 'ola3';
|
||||
painel.innerHTML = 'ola6';
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
//onde estará a construção da estrutura de configuração do ambiente do usuário
|
||||
|
|
@ -1,3 +1,5 @@
|
|||
|
||||
// Função de comunicação com a rota mounting, para a construção do ambiente do usuário
|
||||
async function Autenticao() {
|
||||
const apiUrl = await getApiUrl();
|
||||
const token = getAuthToken();
|
||||
|
|
@ -13,3 +15,85 @@ async function Autenticao() {
|
|||
|
||||
return { response, apiUrl }; // Retorne um objeto com a resposta e apiUrl
|
||||
}
|
||||
|
||||
|
||||
async function IntegracaoZamade() {
|
||||
const apiUrl = await getApiUrl();
|
||||
const token = getAuthToken();
|
||||
|
||||
|
||||
if (!apiUrl || !token) {
|
||||
throw new Error("Erro: Parâmetros obrigatórios ausentes (apiUrl, token ou domain)");
|
||||
}
|
||||
|
||||
const Chamados = await fetch(`${apiUrl}/tickets`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'x-access-token': token,
|
||||
//'Id_Cliente': domain
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
if (!Chamados.ok) {
|
||||
throw new Error(`Erro na API: ${Chamados.status} - ${Chamados.statusText}`);
|
||||
}
|
||||
|
||||
return { Chamados, apiUrl }; // Retorna a resposta e a URL
|
||||
|
||||
}
|
||||
|
||||
async function IntegracaoZamade() {
|
||||
const apiUrl = await getApiUrl();
|
||||
const token = getAuthToken();
|
||||
|
||||
|
||||
if (!apiUrl || !token) {
|
||||
throw new Error("Erro: Parâmetros obrigatórios ausentes (apiUrl, token ou domain)");
|
||||
}
|
||||
|
||||
const Chamados = await fetch(`${apiUrl}/tickets`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'x-access-token': token,
|
||||
//'Id_Cliente': domain
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
if (!Chamados.ok) {
|
||||
throw new Error(`Erro na API: ${Chamados.status} - ${Chamados.statusText}`);
|
||||
}
|
||||
|
||||
return { Chamados, apiUrl }; // Retorna a resposta e a URL
|
||||
|
||||
}
|
||||
|
||||
async function IntegracaoBoleto() {
|
||||
const apiUrl = await getApiUrl();
|
||||
const token = getAuthToken();
|
||||
|
||||
|
||||
if (!apiUrl || !token) {
|
||||
throw new Error("Erro: Parâmetros obrigatórios ausentes (apiUrl, token ou domain)");
|
||||
}
|
||||
|
||||
const Boleto = await fetch(`${apiUrl}/boletos`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'x-access-token': token,
|
||||
//'Id_Cliente': domain
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
if (!Boleto.ok) {
|
||||
throw new Error(`Erro na API: ${Boleto.status} - ${Boleto.statusText}`);
|
||||
}
|
||||
|
||||
return { Boleto, apiUrl }; // Retorna a resposta e a URL
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,61 +1,94 @@
|
|||
// Função para carregar e exibir as imagens protegidas
|
||||
//Evento que esepra, todos os elementos htmls foram construidos na tela para disparar a função
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
insercaoFunc_Total();
|
||||
});
|
||||
|
||||
//Função responsavel por inserir o script de load dentro dá página html
|
||||
function insercaoFunc_Total() {
|
||||
|
||||
// Script de carregamento
|
||||
const script_Load = document.createElement('script');
|
||||
script_Load.src = './js/page/Modulo_Construcao/Painel/Estrutura/load.js';
|
||||
document.body.appendChild(script_Load);
|
||||
|
||||
script_Load.onload = async () => {
|
||||
await verificarAmbiente(); // Chama a função somente após o script ser carregado
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
|
||||
let usuarioData = null; // Variável para armazenar dados do usuário
|
||||
//Função responsavel por montar toda á página do ambiente do usuário
|
||||
async function criarBlocos() {
|
||||
|
||||
try {
|
||||
|
||||
const { response, apiUrl } = await Autenticao(); // Recebe o objeto com response e apiUrl
|
||||
const data = await response.json(); // Faz o parse do JSON retornado
|
||||
// Se os dados já estiverem carregados, use-os diretamente
|
||||
if (usuarioData) {
|
||||
const { nomeCompleto, Empresa, ImagemUser, logoEmpresa } = usuarioData;
|
||||
|
||||
// Agora acessa as propriedades do objeto
|
||||
const nomeCompleto = data.usuario.nome; // Nome completo do usuário
|
||||
loadImage(ImagemUser, 'profileImage');
|
||||
loadImage(logoEmpresa, 'companyLogo');
|
||||
|
||||
const Empresa = data.empresa.nome;
|
||||
const ImagemUser = `${apiUrl}${data.usuario.img_perfil}`;
|
||||
//const ImagemUser2 = `${apiUrl}${data.usuario.img_perfil}`;
|
||||
const logoEmpresa = `${apiUrl}${data.empresa.logo}`;
|
||||
console.log('Usando dados armazenados');
|
||||
|
||||
// Exibe as imagens protegidas usando os URLs retornados pela API
|
||||
loadImage(ImagemUser, 'profileImage');
|
||||
//loadImage(ImagemUser2, 'profileImage'); // Imagem de perfil do usuário
|
||||
loadImage(logoEmpresa, 'companyLogo'); // Logo da empresa
|
||||
|
||||
// Acessando o primeiro objeto do array retornado
|
||||
console.log(data);
|
||||
console.log(nomeCompleto);
|
||||
console.log(Empresa);
|
||||
console.log('Link da imagem de perfil -' + ImagemUser);
|
||||
console.log('Link da Logo -' + logoEmpresa);
|
||||
} else {
|
||||
// Conexção com o script de Comunicacao.js para se utilizar da função de autenticação com a rota mouten, para puxar a const response e apiURL
|
||||
const { response, apiUrl } = await Autenticao();
|
||||
|
||||
//Essa constante faz um tratamento sobre a response retirando o json para armazenar nesse data
|
||||
const data = await response.json();
|
||||
|
||||
// Armazena os dados para usos futuros
|
||||
usuarioData = {
|
||||
nomeCompleto: data.usuario.nome,
|
||||
Empresa: data.empresa.nome,
|
||||
ImagemUser: `${apiUrl}${data.usuario.img_perfil}`,
|
||||
logoEmpresa: `${apiUrl}${data.empresa.logo}`
|
||||
};
|
||||
|
||||
// Aplica as funções para carregamento das imagens, os alinhando com classe para a aplicação dentro do html.
|
||||
loadImage(usuarioData.ImagemUser, 'profileImage');
|
||||
loadImage(usuarioData.logoEmpresa, 'companyLogo');
|
||||
|
||||
console.log(usuarioData);
|
||||
console.log(usuarioData.nomeCompleto);
|
||||
console.log(usuarioData.Empresa);
|
||||
console.log('Link da imagem de perfil -' + usuarioData.ImagemUser);
|
||||
console.log('Link da Logo -' + usuarioData.logoEmpresa);
|
||||
|
||||
|
||||
}
|
||||
// Inicia a função insercaoFunc_Estrutura
|
||||
await insercaoFunc_Estrutura();
|
||||
|
||||
|
||||
// Função responsavel por construir todos os elementos sobre a tela apartir das informações recebidas pelo back end.
|
||||
async function insercaoFunc_Estrutura() {
|
||||
|
||||
const script_Func = document.createElement('script');
|
||||
script_Func.src = './js/page/Modulo_Construcao/Painel/Estrutura/Estrutura.js';
|
||||
document.body.appendChild(script_Func);
|
||||
script_Func.id = 'Ambiente_func';
|
||||
script_Func.src = './js/page/Modulo_Construcao/Funcao/Estrutura/Estrutura.js';
|
||||
|
||||
const script_Html = document.createElement('script');
|
||||
script_Html.id = 'Ambiente_Html';
|
||||
script_Html.src = './js/page/Modulo_Construcao/Painel/Estrutura/Html_estrutura.js';
|
||||
document.body.appendChild(script_Html);
|
||||
|
||||
script_Html.onload = async () => {
|
||||
await EstruturaEsqueleto(); // Chama a função somente após o script ser carregado
|
||||
};
|
||||
// Adiciona os scripts ao DOM e aguarda o carregamento
|
||||
await Promise.all([
|
||||
carregarScript(script_Func),
|
||||
carregarScript(script_Html)
|
||||
]);
|
||||
|
||||
await EstruturaEsqueleto(); // Chama a função somente após o script ser carregado
|
||||
|
||||
function carregarScript(script) {
|
||||
return new Promise((resolve, reject) => {
|
||||
script.onload = () => resolve();
|
||||
script.onerror = () => reject(new Error(`Erro ao carregar o script: ${script.src}`));
|
||||
document.body.appendChild(script);
|
||||
});
|
||||
}
|
||||
|
||||
async function EstruturaEsqueleto() {
|
||||
//constante que controla o estilo css que está estilizando todo o ambiente do usuário.
|
||||
|
|
@ -65,9 +98,13 @@ async function criarBlocos() {
|
|||
|
||||
|
||||
//Estrutura Html que será apresentada sobre a tela
|
||||
construtor_primario.innerHTML = InterfaceAmbiente(nomeCompleto, Empresa);
|
||||
Interatividade();
|
||||
ApresentarTelas();
|
||||
construtor_primario.innerHTML = InterfaceAmbiente(usuarioData.nomeCompleto, usuarioData.Empresa);
|
||||
|
||||
if (construtor_primario.innerHTML !== '') {
|
||||
Interatividade();
|
||||
ApresentarTelas(usuarioData);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -83,7 +120,7 @@ async function criarBlocos() {
|
|||
function insercaoFunc_Erro() {
|
||||
|
||||
const script_ERRO = document.createElement('script');
|
||||
script_ERRO.src = './js/page/Modulo_Construcao/Painel/Estrutura/Painel_Erro.js';
|
||||
script_ERRO.src = './js/page/Modulo_Construcao/Funcao/Estrutura/Painel_Erro.js';
|
||||
document.body.appendChild(script_ERRO);
|
||||
|
||||
script_ERRO.onload = async () => {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,184 @@
|
|||
|
||||
function Interatividade() {
|
||||
|
||||
var botao = document.getElementById('id_ajuste');
|
||||
var cabecario = document.querySelector('.capitulo_1');
|
||||
var tela = document.querySelector('.capitulo_2');
|
||||
var menu = document.querySelector('.menu_lateral');
|
||||
|
||||
if (botao) {
|
||||
botao.addEventListener('click', function () {
|
||||
console.log('Botão clicado!');
|
||||
if (menu) menu.classList.toggle('expansao');
|
||||
if (cabecario) cabecario.classList.toggle('expansao');
|
||||
if (tela) tela.classList.toggle('expansao');
|
||||
});
|
||||
} else {
|
||||
console.error('Botão não encontrado!');
|
||||
}
|
||||
|
||||
|
||||
/*if (Permissoes.visuMonitor) {
|
||||
const script2 = document.createElement('script');
|
||||
script2.src = './js/page/Ambiente/Monitoramento/Modulo_Construcao/Funcao/Estrutura_Secundaria_Monitor.js';
|
||||
script2.setAttribute // Acessando a propriedade corretamente
|
||||
document.body.appendChild(script2);
|
||||
}*/
|
||||
|
||||
// Adiciona o listener de clique após a construção do HTML
|
||||
|
||||
|
||||
}
|
||||
|
||||
async function ApresentarTelas(InfoGeral) {
|
||||
|
||||
InteracoesTelas();
|
||||
|
||||
|
||||
|
||||
function InteracoesTelas() {
|
||||
|
||||
ControladorDeVisualizacao(InfoGeral);
|
||||
|
||||
const Config_texts = document.getElementById('Configuracao_1');
|
||||
const Config_icon = document.getElementById('Configuracao_2');
|
||||
|
||||
const Home_texts = document.getElementById('Home_1');
|
||||
const Home_icon = document.getElementById('Home_2');
|
||||
|
||||
// Adiciona eventos para alternar entre as telas
|
||||
Config_texts.addEventListener('click', () => carregarTela('config'));
|
||||
Config_icon.addEventListener('click', () => carregarTela('config'));
|
||||
|
||||
Home_texts.addEventListener('click', () => carregarTela('home'));
|
||||
Home_icon.addEventListener('click', () => carregarTela('home'));
|
||||
}
|
||||
|
||||
async function carregarTela(tela) {
|
||||
const telaVisualizacao = document.getElementById('TelaVisualizacao');
|
||||
const scriptPaths = {
|
||||
|
||||
//Alinhamento das telas por datas, aqui são organizadas das possiveis respostas de cada botão e os caminhos scripts cada uma delas necessita para o seu funcionamento.
|
||||
home: {
|
||||
func: './js/page/Modulo_Construcao/Funcao/Home/Func_Home.js',
|
||||
html: './js/page/Modulo_Construcao/Painel/Home/Html_Home.js',
|
||||
mensagem: 'Carregando ...',
|
||||
},
|
||||
moni: {
|
||||
func: './js/page/Modulo_Construcao/Funcao/Monitoramento/Func_Moni.js',
|
||||
html: './js/page/Modulo_Construcao/Painel/Monitoramento/Html_Moni.js',
|
||||
mensagem: 'Carregando ...',
|
||||
},
|
||||
config: {
|
||||
func: './js/page/Modulo_Construcao/Funcao/Config/Estrutura/config.js',
|
||||
html: './js/page/Modulo_Construcao/Painel/Config/Estrutura/Estrutura_Config_Html.js',
|
||||
mensagem: 'Carregando ...',
|
||||
},
|
||||
};
|
||||
|
||||
if (!scriptPaths[tela]) {
|
||||
console.error('Tela inválida:', tela);
|
||||
return;
|
||||
}
|
||||
|
||||
// Remove scripts antigos antes de adicionar novos
|
||||
document.querySelectorAll('script[data-dinamico]').forEach(script => script.remove());
|
||||
|
||||
try {
|
||||
// Aguarda o carregamento dos dois scripts
|
||||
await Promise.all([
|
||||
carregarScript(scriptPaths[tela].html),
|
||||
carregarScript(scriptPaths[tela].func),
|
||||
|
||||
]);
|
||||
|
||||
// Aplicação de if realizam a modificação da mensagem de cada condicional para a estrutura de seu html respectivo.
|
||||
|
||||
// Estrutura html do home
|
||||
if (tela === 'home' && typeof estruturaHtml_Home === 'function') {
|
||||
scriptPaths[tela].mensagem = estruturaHtml_Home();
|
||||
|
||||
const Tela_homelink = document.getElementById('conexao_tela');
|
||||
Tela_homelink.href = "./Css/page/Ambiente/Home/root_Home.css";
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
// Estrutura html de monitoramento
|
||||
if (tela === 'moni' && typeof estruturaHtml_Home === 'function') {
|
||||
scriptPaths[tela].mensagem = estruturaHtml_Moni();
|
||||
}
|
||||
|
||||
// Estrutura html de configuração
|
||||
if (tela === 'config' && typeof estruturaHtml_Home === 'function') {
|
||||
const novatela = document.getElementById('entrada_2')
|
||||
const antigatela = document.getElementById('entrada_1')
|
||||
|
||||
novatela.innerHTML = estruturaHtml_Config();
|
||||
antigatela.innerHTML = "";
|
||||
|
||||
// Remove os scripts específicos, se existirem
|
||||
const scriptFunc = document.getElementById('Ambiente_func');
|
||||
const scriptHtml = document.getElementById('Ambiente_Html');
|
||||
|
||||
if (scriptFunc) {
|
||||
scriptFunc.remove(); // Remove o script 'func'
|
||||
console.log('Script Ambiente_func removido');
|
||||
}
|
||||
|
||||
if (scriptHtml) {
|
||||
scriptHtml.remove(); // Remove o script 'html'
|
||||
console.log('Script Ambiente_Html removido');
|
||||
}
|
||||
|
||||
console.log('estrutura')
|
||||
|
||||
}
|
||||
|
||||
telaVisualizacao.innerHTML = scriptPaths[tela].mensagem;
|
||||
console.log(`Tela ${tela} carregada com sucesso!`);
|
||||
} catch (error) {
|
||||
console.error('Erro ao carregar os scripts:', error);
|
||||
}
|
||||
}
|
||||
|
||||
// função que carreca os scripts dentro do html
|
||||
function carregarScript(src) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const script = document.createElement('script');
|
||||
script.src = src;
|
||||
script.dataset.dinamico = true; // Marca como script dinâmico
|
||||
script.onload = () => resolve();
|
||||
script.onerror = () => reject(new Error(`Erro ao carregar o script ${src}`));
|
||||
document.body.appendChild(script);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Carrega a tela 'home' automaticamente ao iniciar
|
||||
carregarTela('home');
|
||||
|
||||
// Controlador de visualização sobre as opições que existem dentro do ambiente do usuário
|
||||
function ControladorDeVisualizacao(InfoGeral) {
|
||||
|
||||
if (InfoGeral.Empresa == "itguys.com.br") {
|
||||
const PainelMoniIcon = document.getElementById('sub_entrada_moni_1');
|
||||
const PainelMoniButton = document.getElementById('sub_entrada_moni_2');
|
||||
|
||||
|
||||
PainelMoniButton.innerHTML = "<h2>Monitormaneto</h2>"
|
||||
PainelMoniIcon.innerHTML = `<img class="img" src="./Acessts/Imagens/Iconis/monitor.png" alt="">`
|
||||
|
||||
PainelMoniButton.addEventListener('click', () => carregarTela('moni'));
|
||||
PainelMoniIcon.addEventListener('click', () => carregarTela('moni'));
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,126 @@
|
|||
IniciandoTelaHome();
|
||||
|
||||
function IniciandoTelaHome() {
|
||||
|
||||
const interval_home = 500; // Tempo em milissegundos (1 segundo)
|
||||
|
||||
const checkElements_home = setInterval(() => {
|
||||
const HomeConstruida = document.getElementById('HomeConstuctor');
|
||||
|
||||
if (HomeConstruida) {
|
||||
const gerar = document.getElementById('gerar');
|
||||
gerar.addEventListener('click', gerarBoleto)
|
||||
console.log('Funções da tela Home foram iniciadas corretamente')
|
||||
|
||||
Data_home();
|
||||
//Servicos_home();
|
||||
Chamados_home();
|
||||
|
||||
function Servicos_home() {
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
async function Chamados_home() {
|
||||
|
||||
const { Chamados } = await IntegracaoZamade();
|
||||
const dataZam = await Chamados.json();
|
||||
|
||||
// Seleciona o elemento que vai receber os ambientes no painel
|
||||
const ListadeChamados = document.getElementById('ChamadosDominio');
|
||||
|
||||
// Insere o HTML gerado pela função ComponenteAmbientes dentro do painel
|
||||
ListadeChamados.innerHTML = FormeChamados(); // Inserção de HTML
|
||||
|
||||
|
||||
|
||||
// Função responsável por gerar o HTML com a estrutura dos ambientes
|
||||
function FormeChamados() {
|
||||
let htmlContent = ''; //
|
||||
|
||||
for (let Chamados in dataZam) { // Itera sobre os itens de ambientes definidos no objeto 'dataAmbientes'
|
||||
const nome = dataZam[Chamados].customer_id;
|
||||
const Titulo = dataZam[Chamados].title;
|
||||
const DatadeAbertura = dataZam[Chamados].close_at;
|
||||
const DatadeFechamento = dataZam[Chamados].created_at;
|
||||
|
||||
// Chama a função 'FormeEditarAmbiente' passando o nome de cada ambiente
|
||||
|
||||
htmlContent += `<li>${Titulo}</li>`
|
||||
|
||||
}
|
||||
|
||||
// Retorna o conteúdo HTML gerado para ser inserido no DOM
|
||||
return htmlContent;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
function Data_home() {
|
||||
const DiaAtual = document.getElementById('NumeroDodial');
|
||||
const DiaSemana = document.getElementById('DiaSemana');
|
||||
const MesAtual = document.getElementById('Mesatual');
|
||||
const AnoAtual = document.getElementById('AnoAtual');
|
||||
|
||||
let { dia, diaSemana, mes, ano, data } = CapturandoDatas();
|
||||
|
||||
function CapturandoDatas(dataReferencia = new Date()) {
|
||||
const dia = dataReferencia.getDate();
|
||||
const diasSemana = ["Domingo", "Segunda-feira", "Terça-feira", "Quarta-feira", "Quinta-feira", "Sexta-feira", "Sábado"];
|
||||
const diaSemana = diasSemana[dataReferencia.getDay()];
|
||||
const mesesAno = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
|
||||
const mes = mesesAno[dataReferencia.getMonth()];
|
||||
const ano = dataReferencia.getFullYear();
|
||||
|
||||
return { dia, diaSemana, mes, ano, data: dataReferencia };
|
||||
}
|
||||
|
||||
function AtualizarData(novaData) {
|
||||
const { dia, diaSemana, mes, ano } = CapturandoDatas(novaData);
|
||||
DiaAtual.innerHTML = dia;
|
||||
DiaSemana.innerHTML = diaSemana;
|
||||
MesAtual.innerHTML = mes;
|
||||
AnoAtual.innerHTML = ano;
|
||||
}
|
||||
|
||||
function MudarDia() {
|
||||
const proximo_dia = document.getElementById('NumeroProximo');
|
||||
const dia_anterior = document.getElementById('NumeroAnterior');
|
||||
|
||||
proximo_dia.addEventListener('click', () => {
|
||||
data.setDate(data.getDate() + 1); // Avança um dia
|
||||
AtualizarData(data);
|
||||
});
|
||||
|
||||
dia_anterior.addEventListener('click', () => {
|
||||
data.setDate(data.getDate() - 1); // Retrocede um dia
|
||||
AtualizarData(data);
|
||||
});
|
||||
}
|
||||
|
||||
// Inicializa os valores na tela
|
||||
AtualizarData(data);
|
||||
MudarDia();
|
||||
}
|
||||
|
||||
|
||||
|
||||
async function gerarBoleto() {
|
||||
|
||||
const { Boleto } = await IntegracaoBoleto();
|
||||
|
||||
const dataBole = await Boleto.json();
|
||||
|
||||
console.log(dataBole);
|
||||
|
||||
}
|
||||
|
||||
clearInterval(checkElements_home); // Para o setInterval
|
||||
}
|
||||
}, interval_home);
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
//onde estará a construção da estrutura de configuração do ambiente do usuário
|
||||
|
||||
function estruturaHtml_Config() {
|
||||
|
||||
return `
|
||||
<section class="Capa">
|
||||
<img src="./Acessts/Imagens/iT_Guys/logo_flat.png" alt="">
|
||||
</section>
|
||||
<section class="Capitulo_1">
|
||||
<button class="element_1" id="Voltar_config">
|
||||
<img src="./Acessts/Imagens/Iconis/seta-esquerda - Copia.png" alt="">
|
||||
<p>Voltar</p>
|
||||
</button>
|
||||
</section>
|
||||
<section class="Capitulo_2">
|
||||
<div class="element_1" id="Perfil_config">
|
||||
<img src="./Acessts/Imagens/Iconis/paint-palette copia.png" alt="">
|
||||
<p>Perfil</p>
|
||||
</div>
|
||||
<div class="element_1" id="Ambiente_config">
|
||||
<img src="./Acessts/Imagens/Iconis/ferramentas copiar.png" alt="" >
|
||||
<p>Ambiente</p>
|
||||
</div>
|
||||
<div class="element_1" id="Manual_config">
|
||||
<img src="./Acessts/Imagens/Iconis/abra-o-livro copiar.png" alt="">
|
||||
<p>Manual do Usuário</p>
|
||||
</div>
|
||||
<div class="element_1" id="Grupos_config">
|
||||
<img src="./Acessts/Imagens/Iconis/group.png" alt="">
|
||||
<p>Grupos</p>
|
||||
</div>
|
||||
<div class="element_1" id="Dash_config">
|
||||
<img src="./Acessts/Imagens/Iconis/monitor copiar.png" alt="">
|
||||
<p>Dashboards</p>
|
||||
</div>
|
||||
</section>
|
||||
<div class="Pop_up" id="PainelPop"></div>
|
||||
`;
|
||||
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
|
||||
function Interatividade() {
|
||||
|
||||
var botao = document.getElementById('id_ajuste');
|
||||
var cabecario = document.querySelector('.capitulo_1');
|
||||
var tela = document.querySelector('.capitulo_2');
|
||||
var menu = document.querySelector('.menu_lateral');
|
||||
|
||||
if (botao) {
|
||||
botao.addEventListener('click', function () {
|
||||
console.log('Botão clicado!');
|
||||
if (menu) menu.classList.toggle('expansao');
|
||||
if (cabecario) cabecario.classList.toggle('expansao');
|
||||
if (tela) tela.classList.toggle('expansao');
|
||||
});
|
||||
} else {
|
||||
console.error('Botão não encontrado!');
|
||||
}
|
||||
|
||||
|
||||
/*if (Permissoes.visuMonitor) {
|
||||
const script2 = document.createElement('script');
|
||||
script2.src = './js/page/Ambiente/Monitoramento/Modulo_Construcao/Funcao/Estrutura_Secundaria_Monitor.js';
|
||||
script2.setAttribute // Acessando a propriedade corretamente
|
||||
document.body.appendChild(script2);
|
||||
}*/
|
||||
|
||||
// Adiciona o listener de clique após a construção do HTML
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
function ApresentarTelas() { }
|
||||
|
|
@ -24,13 +24,13 @@ function InterfaceAmbiente(nomeCompleto, Empresa) {
|
|||
|
||||
<div class="subcolunas_1">
|
||||
|
||||
<div class="filheira">
|
||||
<div id="Home_1" class="filheira">
|
||||
|
||||
<img class="img" src="./Acessts/Imagens/Iconis/home.png" alt="">
|
||||
|
||||
</div>
|
||||
|
||||
<div id="sub_entrada_moni_1"></div>
|
||||
<div id="sub_entrada_moni_1" class="filheira"></div>
|
||||
|
||||
<div class="filheira">
|
||||
|
||||
|
|
@ -38,11 +38,11 @@ function InterfaceAmbiente(nomeCompleto, Empresa) {
|
|||
|
||||
</div>
|
||||
|
||||
<div class="filheira">
|
||||
<!-- <div class="filheira">
|
||||
|
||||
<img class="img" src="./Acessts/Imagens/Iconis/caixa-de-ferramentas.png" alt="">
|
||||
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
</div>
|
||||
|
||||
|
|
@ -54,7 +54,7 @@ function InterfaceAmbiente(nomeCompleto, Empresa) {
|
|||
|
||||
</div>
|
||||
|
||||
<div class="filheira">
|
||||
<div id="Configuracao_1" class="filheira">
|
||||
|
||||
<img class="img" src="./Acessts/Imagens/Iconis/engrenagem - Copia.png" alt="">
|
||||
|
||||
|
|
@ -74,7 +74,7 @@ function InterfaceAmbiente(nomeCompleto, Empresa) {
|
|||
|
||||
<div class="filheira">
|
||||
|
||||
<img class="profileImage" alt="">
|
||||
<img class="profileImage" alt="Perfil de ${nomeCompleto}" src="./Acessts/Imagens/Iconis/profile-user.png">
|
||||
|
||||
</div>
|
||||
|
||||
|
|
@ -101,63 +101,51 @@ function InterfaceAmbiente(nomeCompleto, Empresa) {
|
|||
|
||||
<div class="coluna_2">
|
||||
|
||||
<div class="subcolunas_1">
|
||||
<div class="subcolunas_1">
|
||||
|
||||
<a href="./html/Home.html" class="filheira_a" target="frame">
|
||||
<div id="Home_2" class="filheira">
|
||||
|
||||
<div class="filheira">
|
||||
<h2>Home</h2>
|
||||
|
||||
<h2>Home</h2>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="sub_entrada_moni_2" class="filheira"></div>
|
||||
|
||||
</a>
|
||||
<a href="https://suporte.itguys.com.br/" class="filheira_a" target="black_">
|
||||
|
||||
<div id="sub_entrada_moni_2"></div>
|
||||
<div class="filheira">
|
||||
|
||||
<a href="https://suporte.itguys.com.br/" class="filheira_a" target="frame">
|
||||
<h2>Servicdesk</h2>
|
||||
|
||||
<div class="filheira">
|
||||
</div>
|
||||
|
||||
<h2>Servicdesk</h2>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
<!-- <div class="filheira">
|
||||
|
||||
</a>
|
||||
<h2>Ferramentas</h2>
|
||||
|
||||
<a href="./html/projetos_itguys.html" class="filheira_a" target="frame">
|
||||
</div> -->
|
||||
|
||||
<div class="filheira">
|
||||
|
||||
<h2>Ferramentas</h2>
|
||||
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="subcolunas_2">
|
||||
|
||||
<a href="https://api.whatsapp.com/send?phone=5521966344698" class="filheira_a" target="black_">
|
||||
<a href="https://api.whatsapp.com/send?phone=5521966344698" class="filheira_a" target="black_">
|
||||
|
||||
<div class="filheira">
|
||||
<div class="filheira">
|
||||
|
||||
<h2>Suporte</h2>
|
||||
<h2>Suporte</h2>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
</a>
|
||||
|
||||
<a href="./html/Config.html" class="filheira_a">
|
||||
<div id="Configuracao_2" class="filheira">
|
||||
|
||||
<div class="filheira">
|
||||
<h2>Configurações</h2>
|
||||
|
||||
<h2>Configurações</h2>
|
||||
|
||||
</div>
|
||||
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -180,17 +168,16 @@ function InterfaceAmbiente(nomeCompleto, Empresa) {
|
|||
|
||||
</div>
|
||||
|
||||
<div class="Bloco_subcab1_2">
|
||||
<!--<div class="Bloco_subcab1_2">
|
||||
|
||||
<a href="https://dev.itguys.com.br/"><button>Logout</button></a>
|
||||
<a href="./login"><button>Logout</button></a>
|
||||
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
</section>
|
||||
|
||||
<section class="capitulo_2">
|
||||
<section class="capitulo_2" id="TelaVisualizacao">
|
||||
|
||||
<iframe id="test1" name="frame" class="transmissão" src="./html/Home.html"frameborder = "0" ></iframe >
|
||||
|
||||
</section>
|
||||
|
||||
|
|
|
|||
|
|
@ -36,6 +36,28 @@ async function verificarAmbiente() {
|
|||
// Inicia a contagem para limpar a tela após 3 segundos
|
||||
finalizar();
|
||||
} catch (error) {
|
||||
|
||||
const main = document.getElementById("entrada_1");
|
||||
const tela_laod = document.getElementById('entrada_2');
|
||||
|
||||
let elemento_1;
|
||||
let elemento_2;
|
||||
|
||||
if (main.innerHTML.trim() === "") {
|
||||
|
||||
elemento_1 = 'Carregando....'; // Caso o nome seja nulo ou indefinido
|
||||
|
||||
}
|
||||
|
||||
elemento_2 = '<canvas id="animationCanvas"></canvas>';
|
||||
tela_laod.innerHTML = '<div class="teste"><h1>' + elemento_1 + '</h1>' + elemento_2 + '</div>';
|
||||
|
||||
// Inicia a animação após configurar o canvas
|
||||
iniciarAnimacao();
|
||||
|
||||
// Inicia a contagem para limpar a tela após 3 segundos
|
||||
finalizar();
|
||||
|
||||
console.error('Erro ao verificar o ambiente:', error);
|
||||
}
|
||||
}
|
||||
|
|
@ -112,4 +134,4 @@ function iniciarAnimacao() {
|
|||
}
|
||||
|
||||
// Executa verificarAmbiente apenas uma vez após o carregamento total da página
|
||||
window.addEventListener('load', verificarAmbiente);
|
||||
window.addEventListener('DOMContentLoaded', verificarAmbiente);
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
async function Autenticao() {
|
||||
const apiUrl = await getApiUrl();
|
||||
const token = getAuthToken();
|
||||
|
||||
const response = await fetch(`${apiUrl}/mounting`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'x-access-token': token ? token : ''
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
return { response, apiUrl }; // Retorne um objeto com a resposta e apiUrl
|
||||
}
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
function estruturaHtml_Home() {
|
||||
|
||||
return `
|
||||
<main id="HomeConstuctor" class="CorpoArtificial">
|
||||
<section class="Capitulo_1">
|
||||
|
||||
<div class="linha_1">
|
||||
<div class="painel">
|
||||
<div class="cap">
|
||||
<h2>Serviço</h2>
|
||||
</div>
|
||||
<div class="Corpo">
|
||||
<ul id="sevicoDominio">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="linha_1">
|
||||
<div class="painel">
|
||||
<div class="cap">
|
||||
<h2>Chamados</h2>
|
||||
</div>
|
||||
<div class="Corpo">
|
||||
<ul id="ChamadosDominio">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="linha_2">
|
||||
|
||||
<div class="painel">
|
||||
<div class="cap">
|
||||
<h2 id="Mesatual">Mês</h2>
|
||||
</div>
|
||||
<div class="Corpo_1">
|
||||
<div class='linhaMes_1'>
|
||||
<button id="NumeroAnterior" > < </button>
|
||||
<h2 id="NumeroDodial">dia</h2>
|
||||
<button id="NumeroProximo" > > </button>
|
||||
</div>
|
||||
<div class='linhaMes_2'>
|
||||
<h2 id="DiaSemana">DiaAtual</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="painel">
|
||||
<div class="cap">
|
||||
<h2>Ano</h2>
|
||||
</div>
|
||||
<div class="Corpo_2">
|
||||
<h2 id="AnoAtual">Ano</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="Capitulo_2">
|
||||
|
||||
|
||||
<div class="painel">
|
||||
|
||||
<div class="cap">
|
||||
<h2>Finaceiro</h2>
|
||||
<button id="gerar">Aqui Vitoria</button>
|
||||
</div>
|
||||
<div id="apresentarBoleto" class="Corpo"></div>
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
</main>
|
||||
`;
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
function estruturaHtml_Moni() {
|
||||
|
||||
return `
|
||||
<h1>ola Monitoramento</h1>
|
||||
`;
|
||||
|
||||
}
|
||||
Loading…
Reference in New Issue