diff options
| author | Yuval Adam <yuv.adm@gmail.com> | 2014-05-28 13:00:44 +0300 |
|---|---|---|
| committer | Yuval Adam <yuv.adm@gmail.com> | 2014-05-28 13:00:44 +0300 |
| commit | 38ab5a4a505caee5ed6ef40b1b0a6d6a47936f3e (patch) | |
| tree | f4d00918b856e0af56cb436c7327f509e0b1bf01 | |
| parent | 652a428b44088aec28cc7bf5b8ae292e2d98a398 (diff) | |
Add button colors
| -rw-r--r-- | static/css/main.css | 7 | ||||
| -rw-r--r-- | templates/home.html | 7 |
2 files changed, 11 insertions, 3 deletions
diff --git a/static/css/main.css b/static/css/main.css new file mode 100644 index 0000000..62dea16 --- /dev/null +++ b/static/css/main.css @@ -0,0 +1,7 @@ +.light-cell-btn { + margin: 2px; +} + +.light-cell-btn.active { + background-color: #0F340D; +} diff --git a/templates/home.html b/templates/home.html index dd5a702..9f48ad1 100644 --- a/templates/home.html +++ b/templates/home.html @@ -4,6 +4,7 @@ <title>Light Loop Pi</title> <link rel="stylesheet" href="/static/css/bootstrap.min.css"> <link rel="stylesheet" href="/static/css/bootstrap-theme.min.css"> + <link rel="stylesheet" href="/static/css/main.css"/> <script src="/static/js/jquery-2.1.1.min.js"></script> <script src="/static/js/underscore-min.js"></script> <script src="/static/js/bootstrap.min.js"></script> @@ -12,14 +13,14 @@ var CHANNELS = 8; var LIGHTS = 8; - // _.templateSettings = { interpolate: /\{\{(.+?)\}\}/g }; - _.each(_.range(CHANNELS), function(i) { var row = $(_.template($('#light-row-template').text(), {i: i, lights: LIGHTS})); $('#light-container').append(row); }); }); </script> + <style> + </style> </head> <body> <div class="container"> @@ -29,7 +30,7 @@ <script type="text/template" class="template" id="light-row-template"> <div class="light-row" data-light-row="<%= i %>"> <% _.each(_.range(lights), function(j) { %> - <button type="button" class="btn btn-success" data-toggle="button" data-light-cell="<%= j %>"> </button> + <button type="button" class="btn btn-success light-cell-btn" data-toggle="button" data-light-cell="<%= j %>"> </button> <% }); %> </div> </script> |