The esp8266 portion of the project
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

109 lines
5.1 KiB

<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" sizes="144x144" href="/favicon-144x144.png">
<link rel="icon" type="image/png" sizes="48x48" href="/favicon.ico">
<link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#00878f">
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport'>
<meta charset="utf-8">
<script src="loadMenu.js" defer></script>
<script src="main.js" defer></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.15.0/esm/popper.js" type="module"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sprintf/1.1.2/sprintf.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pretty-checkbox@3.0/dist/pretty-checkbox.min.css">
<link href='main.css' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="colors.css">
</head>
<body>
<!-- <iframe src="menu.html" width="90%"></iframe> -->
<div id="navigation"></div>
<div class="container">
<div class="shadow-lg p-3 mb-5 bg-white rounded">
<header>
<div class="container">
<div class="row">
<div class="col">
<div class="pt-5 mt-3">
<h2 class="display-4 text-ternary text-center"> Welcome </h2>
<p class="text-center">Welcome to the planted aquarium controller.</p>
</div>
</div>
</div>
</div>
</header>
<section>
<div class="container bg-ternary shadow-sm p-3 mb-2 rounded">
<div class="row mb-3">
<div class="col">
<h2 class="text-white text-center display-4">Settings at a glance</h2>
</div>
</div>
<div class="row" id="content-row">
<div class="col-md">
<section id="mySection "></section>
<div class="card mb-3 text-center card-form rounded mx-auto shadow-sm ">
<h2 class="card-header text-center text-ternary">Ballast #1</h2>
<div class="card-body rounded">
<div class="card-text" id="ballast1">
</div>
</div>
</div>
</div>
<div class="col-md">
<div class="card mb-3 text-center card-form rounded mx-auto shadow-sm">
<h2 class="card-header text-center text-ternary">Ballast #2</h2>
<div class="card-body rounded">
<div class="card-text" id="ballast2">
</div>
</div>
</div>
</div>
<div class="col-md">
<div class="card mb-3 text-center card-form rounded mx-auto shadow-sm">
<h2 class="card-header text-center text-ternary">Ballast #3</h2>
<div class="card-body rounded">
<div class="card-text" id="ballast3">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<div class="row">
<div class="col">
<div class="pretty p-switch ">
<input type="checkbox" id="temperatures-switch" />
<div class="state p-primary">
<label>Show temperature readings</label>
</div>
</div>
<p id="temperature"></p>
<noscript>No javascript</noscript>
</div>
</div>
</div>
</section>
</div>
</div>
</body>
</html>