control.html styling

main
louisafriederike 7 months ago
parent 2287cd439f
commit d4b7db5a99

@ -11,7 +11,7 @@ const io = require('socket.io')(server);
const udpPort = new osc.UDPPort({ const udpPort = new osc.UDPPort({
localAddress: "0.0.0.0", localAddress: "0.0.0.0",
localPort: 57121, localPort: 57121,
remoteAddress: "192.168.2.5", remoteAddress: "192.168.2.5", //microcontroller ip
remotePort: 8080, remotePort: 8080,
metadata: true metadata: true
}); });

@ -1,6 +1,6 @@
<html> <html>
<head> <head>
<title>hamsters remote</title> <title>remote control</title>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="icon" href="img/favicon.ico" type="image/x-icon" /> <link rel="icon" href="img/favicon.ico" type="image/x-icon" />
@ -14,10 +14,37 @@
<!-- <img id="logo" src="img/logo.png">--> <!-- <img id="logo" src="img/logo.png">-->
<div class="profile"> <p id="title"> ~* *..* welcome to remote control ~</p> <div class="profile"> <p id="title"> ~* *..* welcome to remote control ~</p>
<div class="wrapper">
<div class="flex-container">
<!-- 16 divs -->
<div>
<p class="data">
<br>
module name: wire::;;
<br>
<button id="sendOscButton" style="background-color: lightpink;">ON 🐹</button> <button id="sendOscButton" style="background-color: lightpink;">ON 🐹</button>
<button id="sendOffButton" style="background-color: lightpink;">OFF 🐱</button> <button id="sendOffButton" style="background-color: lightpink;">OFF 🐱</button>
<div id="response"></div> <div id="response"></div>
</p>
</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
<div>10</div>
<div>11</div>
<div>12</div>
<div>13</div>
<div>14</div>
<div>15</div>
<div>16</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {

@ -11,7 +11,7 @@
</head> </head>
<body> <body>
<h1>~* *..* sensor dashboard ~</h1> <p id="title"> ~* *..* welcome to the dashboard ~</p>
<br><br> <br><br>
<div class="wrapper"> <div class="wrapper">
<div class="flex-container"> <div class="flex-container">

@ -6,7 +6,7 @@
body { body {
font-family: 'Inconsolata', monospace; font-family: 'Inconsolata', monospace;
color:lightblue; color:rgb(140, 222, 249);
font-weight: 400; font-weight: 400;
background-color: black; background-color: black;
margin: 5px; margin: 5px;
@ -42,7 +42,7 @@ body {
border-radius: 5px; border-radius: 5px;
min-width: 22vw; min-width: 22vw;
min-height: 24vh; min-height: 24vh;
text-shadow: 0px 0px 10px #ff7300; text-shadow: 0px 0px 5px #e3863ab4;
overflow: scroll; overflow: scroll;
} }

Loading…
Cancel
Save