diff --git a/server/css/style.css b/server/css/style.css index 3599abb..8079dae 100644 --- a/server/css/style.css +++ b/server/css/style.css @@ -37,23 +37,47 @@ body { } .button-off { - height: 50px; - line-height: 50px; - width: 100%; - text-decoration: none; - text-align: center; - font-size: 20px; - box-shadow: 1px 1px black; - color: red + background-color:#fc0000; + -moz-border-radius:28px; + -webkit-border-radius:28px; + border-radius:28px; + border:1px solid #000000; + display:inline-block; + cursor:pointer; + color:#ffffff; + font-family:Arial; + font-size:17px; + padding:16px 31px; + text-decoration:none; + text-shadow:0px 1px 0px #000000; +} +.button-off:hover { + background-color:red; +} +.button-off:active { + position:relative; + top:1px; } .button-on { - height: 50px; - line-height: 50px; - width: 100%; - text-decoration: none; - text-align: center; - font-size: 20px; - box-shadow: 1px 1px black; - color: green; + background-color:#44c767; + -moz-border-radius:28px; + -webkit-border-radius:28px; + border-radius:28px; + border:1px solid black; + display:inline-block; + cursor:pointer; + color:#ffffff; + font-family:Arial; + font-size:17px; + padding:16px 31px; + text-decoration:none; + text-shadow:0px 1px 0px #2f6627; } +.button-on:hover { + background-color:#5cbf2a; +} +.button-on:active { + position:relative; + top:1px; +} \ No newline at end of file diff --git a/views/index.pug b/views/index.pug index 003d2a6..9a46bfb 100644 --- a/views/index.pug +++ b/views/index.pug @@ -8,10 +8,9 @@ block content | #{socket.name} h2.socket-name | #{socket.uid} - h2.socket-name - if socket.state === 1 - a.button-on(href=`/?uid=${socket.uid}`) - | #{socket.state} - else + if socket.state === 'OFF' a.button-off(href=`/?uid=${socket.uid}`) - | #{socket.state} \ No newline at end of file + | #{socket.state} + else + a.button-on(href=`/?uid=${socket.uid}`) + | #{socket.state} \ No newline at end of file