-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
5 changed files
with
306 additions
and
21 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,286 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
|
||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | ||
<title>SIGE IE - Electrical Maintenance</title> | ||
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/tailwind.min.css" /> | ||
<style> | ||
.gradient { | ||
background: linear-gradient(90deg, #003366 0%, #ffcc00 100%); | ||
} | ||
|
||
.image-container { | ||
display: flex; | ||
justify-content: center; | ||
align-items: center; | ||
} | ||
|
||
.image-container img { | ||
width: 100%; | ||
height: auto; | ||
max-width: 300px; /* Tamanho máximo das imagens */ | ||
border-radius: 8px; | ||
margin: 0 auto; | ||
} | ||
</style> | ||
</head> | ||
|
||
<body class="leading-normal tracking-normal text-white gradient" style="font-family: 'Source Sans Pro', sans-serif;"> | ||
<!--Nav--> | ||
<nav id="header" class="fixed w-full z-30 top-0 text-white"> | ||
<div class="w-full container mx-auto flex flex-wrap items-center justify-between mt-0 py-2"> | ||
<div class="pl-4 flex items-center"> | ||
<img src="../assets/default_765x625.png" alt="SIGE IE Logo" class="h-8 mr-2" /> | ||
<a class="toggleColour text-white no-underline hover:no-underline font-bold text-2xl lg:text-4xl" | ||
href="#"> | ||
SIGE IE | ||
</a> | ||
</div> | ||
<div class="block lg:hidden pr-4"> | ||
<button id="nav-toggle" | ||
class="flex items-center p-1 text-yellow-800 hover:text-gray-900 focus:outline-none focus:shadow-outline transform transition hover:scale-105 duration-300 ease-in-out"> | ||
<svg class="fill-current h-6 w-6" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> | ||
<title>Menu</title> | ||
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" /> | ||
</svg> | ||
</button> | ||
</div> | ||
<div class="w-full flex-grow lg:flex lg:items-center lg:w-auto hidden mt-2 lg:mt-0 bg-white lg:bg-transparent text-black p-4 lg:p-0 z-20" | ||
id="nav-content"> | ||
<ul class="list-reset lg:flex justify-end flex-1 items-center"> | ||
<li class="mr-3"> | ||
<a class="inline-block py-2 px-4 text-black font-bold no-underline" href="#features">Features</a> | ||
</li> | ||
<li class="mr-3"> | ||
<a class="inline-block text-black no-underline hover:text-gray-800 hover:text-underline py-2 px-4" | ||
href="#about">about</about.html></a> | ||
</li> | ||
<li class="mr-3"> | ||
<a class="inline-block text-black no-underline hover:text-gray-800 hover:text-underline py-2 px-4" | ||
href="#contact">Contact</a> | ||
</li> | ||
</ul> | ||
<a href="https://residenciaticbrisa.github.io/T2G3-Sistema-Instalacao-Eletrica/info/home"> | ||
<button id="navAction" | ||
class="mx-auto lg:mx-0 hover:underline bg-yellow-500 text-gray-800 font-bold rounded-full mt-4 lg:mt-0 py-4 px-8 shadow opacity-75 focus:outline-none focus:shadow-outline transform transition hover:scale-105 duration-300 ease-in-out"> | ||
Conhecer | ||
</button> | ||
</a> | ||
</div> | ||
</div> | ||
<hr class="border-b border-gray-100 opacity-25 my-0 py-0" /> | ||
</nav> | ||
|
||
<!--Hero--> | ||
<div class="pt-24"> | ||
<div class="container px-3 mx-auto flex flex-wrap flex-col md:flex-row items-center"> | ||
<!--Left Col--> | ||
<div class="flex flex-col w-full md:w-2/5 justify-center items-start text-center md:text-left"> | ||
<p class="uppercase tracking-loose w-full"></p> | ||
<h1 class="my-4 text-5xl font-bold leading-tight"> | ||
Sistema de Auxilio para Operação e Manutenção de Instalação Elétrica. | ||
</h1> | ||
<p class="leading-normal text-2xl mb-8"> | ||
Uma ferramenta concebida para facilitar o processo de coleta de dados, essencial no suporte às operações e manutenções e sistemas de instalação elétrica. Este sistema foi desenvolvido com o propósito específico de agilizar a obtenção de informações cruciais, aprimorando assim a eficiência nas operações e garantindo uma gestão mais eficaz das instalações elétricas. | ||
</p> | ||
<button | ||
class="mx-auto lg:mx-0 hover:underline bg-yellow-500 text-gray-800 font-bold rounded-full my-6 py-4 px-8 shadow-lg focus:outline-none focus:shadow-outline transform transition hover:scale-105 duration-300 ease-in-out" | ||
onclick="location.href='saber-mais.html'"> | ||
Learn More | ||
</button> | ||
</div> | ||
<!--Right Col--> | ||
<div class="w-full md:w-3/5 py-6 text-center"> | ||
<img class="w-full md:w-4/5 z-50" src="../assets/default_transparent_1000x1000.png" /> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div class="relative -mt-12 lg:-mt-24"> | ||
<svg viewBox="0 0 1428 174" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||
<g transform="translate(-2.000000, 44.000000)" fill="#FFFFFF" fill-rule="nonzero"> | ||
<path | ||
d="M0,0 C90.7283404,0.927527913 147.912752,27.187927 291.910178,59.9119003 C387.908462,81.7278826 543.605069,89.334785 759,82.7326078 C469.336065,156.254352 216.336065,153.6679 0,74.9732496" | ||
opacity="0.100000001"></path> | ||
<path | ||
d="M100,104.708498 C277.413333,72.2345949 426.147877,52.5246657 546.203633,45.5787101 C666.259389,38.6327546 810.524845,41.7979068 979,55.0741668 C931.069965,56.122511 810.303266,74.8455141 616.699903,111.243176 C423.096539,147.640838 250.863238,145.462612 100,104.708498 Z" | ||
opacity="0.100000001"></path> | ||
<path | ||
d="M1046,51.6521276 C1130.83045,29.328812 1279.08318,17.607883 1439,40.1656806 L1439,120 C1271.17211,77.9435312 1140.17211,55.1609071 1046,51.6521276 Z" | ||
id="Path-4" opacity="0.200000003"></path> | ||
</g> | ||
<g transform="translate(-4.000000, 76.000000)" fill="#FFFFFF" fill-rule="nonzero"> | ||
<path | ||
d="M0.457,34.035 C57.086,53.198 98.208,65.809 123.822,71.865 C181.454,85.495 234.295,90.29 272.033,93.459 C311.355,96.759 396.635,95.801 461.025,91.663 C486.76,90.01 518.727,86.372 556.926,80.752 C595.747,74.596 622.372,70.008 636.799,66.991 C663.913,61.324 712.501,49.503 727.605,46.128 C780.47,34.317 818.839,22.532 856.324,15.904 C922.689,4.169 955.676,2.522 1011.185,0.432 C1060.705,1.477 1097.39,3.129 1121.236,5.387 C1161.703,9.219 1208.621,17.821 1235.4,22.304 C1285.855,30.748 1354.351,47.432 1440.886,72.354 L1441.191,104.352 L1.121,104.031 L0.457,34.035 Z"> | ||
</path> | ||
</g> | ||
</g> | ||
</svg> | ||
</div> | ||
|
||
<!-- Features --> | ||
<section class="bg-white border-b py-8" id="features"> | ||
<div class="container max-w-5xl mx-auto m-8"> | ||
<h2 class="w-full my-2 text-5xl font-bold leading-tight text-center text-gray-800"> | ||
Features | ||
</h2> | ||
<div class="w-full mb-4"> | ||
<div class="h-1 mx-auto gradient w-64 opacity-25 my-0 py-0 rounded-t"></div> | ||
</div> | ||
<div class="flex flex-wrap"> | ||
<div class="w-full sm:w-1/2 p-6"> | ||
<div class="flex"> | ||
<div class="w-2/3"> | ||
<h3 class="text-3xl text-gray-800 font-bold leading-none mb-3"> | ||
Gerenciamento de Instalações em Locais. | ||
</h3> | ||
<p class="text-gray-600 mb-8"> | ||
Cadastre Locais e Gerenciar os sistemas de instalações elétricas, sistema de iluminação, cargas elétricas, linhas elétricas, | ||
cabeamento estruturado, sistema de refrigeração, sistema de alarme de proteção contra incêndio, quadro de distribuição, circuitos | ||
elétricos e sistema de proteção contra Descargas Atmosféricas. | ||
<br /> | ||
<br /> | ||
</p> | ||
</div> | ||
<div class="w-1/3 image-container"> | ||
<img src="../assets/adicionar.equipamentos.jpeg" alt="Gerenciamento de Instalações" /> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="w-full sm:w-1/2 p-6"> | ||
<div class="flex"> | ||
<div class="w-2/3"> | ||
<h3 class="text-3xl text-gray-800 font-bold leading-none mb-3"> | ||
Cadastro de Locais. | ||
</h3> | ||
<p class="text-gray-600 mb-8"> | ||
Crie e mantenha um registro detalhado de todos os locais e salas dentro da instalação, facilitando a gestão e manutenção das instalações elétricas. | ||
<br /> | ||
<br /> | ||
</p> | ||
</div> | ||
<div class="w-1/3 image-container"> | ||
<img src="../assets/locais.jpeg" alt="Cadastro de Locais" /> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="flex flex-wrap flex-col-reverse sm:flex-row"> | ||
<div class="w-full sm:w-1/2 p-6 mt-6"> | ||
<div class="flex"> | ||
<div class="w-2/3"> | ||
<h3 class="text-3xl text-gray-800 font-bold leading-none mb-3"> | ||
Menu de Instalações. | ||
</h3> | ||
<p class="text-gray-600 mb-8"> | ||
Acesse rapidamente todas as instalações registradas e visualize informações detalhadas sobre cada uma delas, incluindo status de manutenção e histórico de serviços. | ||
<br /> | ||
<br /> | ||
</p> | ||
</div> | ||
<div class="w-1/3 image-container"> | ||
<img src="../assets/menu.instalaçoes.jpeg" alt="Menu de Instalações" /> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="w-full sm:w-1/2 p-6 mt-6"> | ||
<div class="align-middle"> | ||
<div class="flex"> | ||
<div class="w-2/3"> | ||
<h3 class="text-3xl text-gray-800 font-bold leading-none mb-3"> | ||
Integração com Mapas | ||
</h3> | ||
<p class="text-gray-600 mb-8"> | ||
O aplicativo conta com uma funcionalidade de integração | ||
em tempo real, permitindo o acompanhamento de localizações e salas | ||
registradas. Os usuários podem criar e atualizar locais | ||
instantaneamente, garantindo que todas as mudanças sejam refletidas no sistema | ||
sem atrasos. Essa funcionalidade é essencial para uma gestão eficiente de ambientes dinâmicos, | ||
proporcionando uma visão atualizada e precisa de todas as localizações e salas | ||
monitoradas pelo aplicativo. | ||
<br /> | ||
<br /> | ||
</p> | ||
</div> | ||
<div class="w-1/3 image-container"> | ||
<img src="../assets/imagem.mapa.jpeg" alt="Map Integration" /> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</section> | ||
|
||
<!-- Call to Action --> | ||
<section class="container mx-auto text-center py-6 mb-12"> | ||
<h2 class="w-full my-2 text-5xl font-bold leading-tight text-center text-white"> | ||
SIGE IE | ||
</h2> | ||
<div class="w-full mb-4"> | ||
<div class="h-1 mx-auto bg-white w-1/6 opacity-25 my-0 py-0 rounded-t"></div> | ||
</div> | ||
<h3 class="my-4 text-3xl leading-tight"> | ||
Conheça nosso Projeto. | ||
</h3> | ||
<button | ||
class="mx-auto lg:mx-0 hover:underline bg-yellow-500 text-gray-800 font-bold rounded-full my-6 py-4 px-8 shadow-lg focus:outline-none focus:shadow-outline transform transition hover:scale-105 duration-300 ease-in-out" | ||
onclick="location.href='about.html'"> | ||
Saber mais | ||
</button> | ||
</section> | ||
|
||
<script> | ||
var scrollpos = window.scrollY; | ||
var header = document.getElementById("header"); | ||
var navcontent = document.getElementById("nav-content"); | ||
var navaction = document.getElementById("navAction"); | ||
var brandname = document.getElementById("brandname"); | ||
var toToggle = document.querySelectorAll(".toggleColour"); | ||
|
||
document.addEventListener("scroll", function () { | ||
/*Apply classes for slide in bar*/ | ||
scrollpos = window.scrollY; | ||
|
||
if (scrollpos > 10) { | ||
header.classList.add("bg-white"); | ||
navaction.classList.remove("bg-white"); | ||
navaction.classList.add("gradient"); | ||
navaction.classList.remove("text-gray-800"); | ||
navaction.classList.add("text-white"); | ||
//Use to switch toggleColour colours | ||
for (var i = 0; i < toToggle.length; i++) { | ||
toToggle[i].classList.add("text-gray-800"); | ||
toToggle[i].classList.remove("text-white"); | ||
} | ||
header.classList.add("shadow"); | ||
navcontent.classList.remove("bg-gray-100"); | ||
navcontent.classList.add("bg-white"); | ||
} else { | ||
header.classList.remove("bg-white"); | ||
navaction.classList.remove("gradient"); | ||
navaction.classList.add("bg-white"); | ||
navaction.classList.remove("text-white"); | ||
navaction.classList.add("text-gray-800"); | ||
//Use to switch toggleColour colours | ||
for (var i = 0; i < toToggle.length; i++) { | ||
toToggle[i].classList.add("text-white"); | ||
toToggle[i].classList.remove("text-gray-800"); | ||
} | ||
|
||
header.classList.remove("shadow"); | ||
navcontent.classList.remove("bg-white"); | ||
navcontent.classList.add("bg-gray-100"); | ||
} | ||
}); | ||
|
||
document.getElementById('nav-toggle').addEventListener('click', function () { | ||
document.getElementById('nav-content').classList.toggle('hidden'); | ||
}); | ||
</script> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters