new button styles

This commit is contained in:
Karl Hudgell 2019-07-16 16:58:29 +01:00
parent 50ff77fba6
commit cfc1d86253
2 changed files with 45 additions and 22 deletions

View File

@ -37,23 +37,47 @@ body {
}
.button-off {
height: 50px;
line-height: 50px;
width: 100%;
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-align: center;
font-size: 20px;
box-shadow: 1px 1px black;
color: red
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%;
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-align: center;
font-size: 20px;
box-shadow: 1px 1px black;
color: green;
text-shadow:0px 1px 0px #2f6627;
}
.button-on:hover {
background-color:#5cbf2a;
}
.button-on:active {
position:relative;
top:1px;
}

View File

@ -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}
else
a.button-on(href=`/?uid=${socket.uid}`)
| #{socket.state}