Finalizing Chrome app window layout

Stylized buttons for chrome app
This commit is contained in:
Casey Halverson 2015-06-22 11:47:40 -07:00
parent 33270f5442
commit 0126665e4c
4 changed files with 110 additions and 9 deletions

View File

@ -1,8 +1,8 @@
chrome.app.runtime.onLaunched.addListener(function() { chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create("window.html", { chrome.app.window.create("window.html", {
"bounds": { "bounds": {
"width": 400, "width": 685,
"height": 500 "height": 263
} }
}); });
}); });

View File

@ -1,6 +1,6 @@
{ {
"name": "", "name": "HamShield",
"description": "HAMShield", "description": "HamShield",
"version": "1.0.0", "version": "1.0.0",
"app": { "app": {
"background": { "background": {

View File

@ -1 +1,48 @@
body{} body{
display: inline-block;
}
.btn {
background: #adadad;
background-image: -webkit-linear-gradient(top, #adadad, #3d3d3d);
background-image: -moz-linear-gradient(top, #adadad, #3d3d3d);
background-image: -ms-linear-gradient(top, #adadad, #3d3d3d);
background-image: -o-linear-gradient(top, #adadad, #3d3d3d);
background-image: linear-gradient(to bottom, #adadad, #3d3d3d);
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
font-family: Arial;
color: #ffffff;
font-size: 20px;
padding: 10px 20px 10px 20px;
text-decoration: none;
float: left;
text-align:center;
}
.btn:hover {
background: #3d3d3d;
text-decoration: none;
}
.lcd {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
font-family: Courier New;
color: #00ff00;
font-size: 50px;
background: #000000;
padding: 10px 20px 10px 20px;
text-decoration: none;
width: 500px;
}
.lcd:hover {
text-decoration: none;
}
.bs1 { width: 50px; }
.bs2 { width: 100px; }
.bs3 { width: 200px; }

View File

@ -1,13 +1,67 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head> </head>
<body> <body>
<div> <div class="lcd" style="width: 623px">
Power 220.000 MHz
</div> </div>
<div> <div class="lcd" style="width: 623px; font-size: 15px;">
1.25M | BW 12.5KHz | TX CTCSS: 103.5 | RX CTCSS: 109.4 | Filter OFF
</div>
<div class="btn" style="width: 75px">
BW
</div>
<div class="btn">
Band
</div>
<div class="btn">
+
</div>
<div class="btn">
-
</div>
<div class="btn">
&lt;&lt;
</div>
<div class="btn">
&gt;&gt;
</div>
<div class="btn">
SQ-
</div>
<div class="btn">
SQ+
</div>
<div class="btn">
VOL
</div>
<br/>
<div class="btn">
CTCSS
</div>
<div class="btn">
CDCSS
</div>
<div class="btn">
Vox
</div>
<div class="btn">
Filter
</div>
<div class="btn">
Offset
</div>
<div class="btn">
Directory
</div>
<div class="btn">
WX
</div>
<br/>
<div class="btn" style="width: 622px">
Transmit
</div> </div>
</body> </body>
</html> </html>