This repository has been archived by the owner. It is now read-only.
Permalink
Browse files

Target boomerang by ID and use a name less likely to conflict

  • Loading branch information...
bjeanes committed Aug 27, 2013
1 parent 9a75d2b commit c3f2c25ee199840437f55027ea9947ea67cf67f2
Showing with 27 additions and 26 deletions.
  1. +9 −6 demo.html
  2. +9 −9 lib/boomerang.css
  3. +4 −5 lib/boomerang.js
  4. +4 −5 src/boomerang.coffee
  5. +1 −1 src/boomerang.styl
View
@@ -4,22 +4,25 @@
<script src="http://localhost:8080/lib/demo.js"></script>
<style>
body {
padding: 20px;
font-family: Helvetica;
}
body.heroku-boomerang-loaded {
padding: 20px;
}
</style>
</head>
<body class='no-boomerang'>
<h1>Boomerang Demo</h1>
<ul class='demo_links'>
<li><a href="#" class="a">Demo A</a></li>
<li><a href="#" class="b">Demo B (with app and addon)</a></li>
<li><a href="#" class="c">Demo C</a></li>
</ul>
<a href="#" onclick="Boomerang.reset();return false" class="reset">Reset</a>
</body>
</body>
View
@@ -1,9 +1,9 @@
.boomerang{background-color:#272b4b;position:fixed;float:none;clear:both;overflow:hidden;top:0;left:0;z-index:10000;margin:0;padding:0;width:100%;height:32px;font-family:"helvetica neue",helvetica,arial;font-weight:normal;font-size:14px;line-height:32px;}
.boomerang a.logo{display:block;float:left;max-width:200px;color:rgba(255,255,255,0.6);text-decoration:none;padding:0 0 0 10px;font-size:14px;line-height:32px}
.boomerang ul{display:block;float:right;margin:0 10px 0 0;padding:0;}
.boomerang ul > li{display:block;float:left;color:rgba(255,255,255,0.6);margin:0;padding:0;font-size:14px;line-height:32px;}
.boomerang ul > li a{display:block;color:rgba(255,255,255,0.6);text-decoration:none;padding:0;}
.boomerang ul > li a:hover{color:#fff}
.boomerang ul > li.big a{color:#fff;padding-left:50px;}
.boomerang ul > li.big a:after{color:rgba(255,255,255,0.6);content:"\2192";margin:0 0 0 8px}
.boomerang ul > li.sub,.boomerang ul > li a{padding:0 8px 0 0}
#heroku-boomerang{background-color:#272b4b;position:fixed;float:none;clear:both;overflow:hidden;top:0;left:0;z-index:10000;margin:0;padding:0;width:100%;height:32px;font-family:"helvetica neue",helvetica,arial;font-weight:normal;font-size:14px;line-height:32px;}
#heroku-boomerang a.logo{display:block;float:left;max-width:200px;color:rgba(255,255,255,0.6);text-decoration:none;padding:0 0 0 10px;font-size:14px;line-height:32px}
#heroku-boomerang ul{display:block;float:right;margin:0 10px 0 0;padding:0;}
#heroku-boomerang ul > li{display:block;float:left;color:rgba(255,255,255,0.6);margin:0;padding:0;font-size:14px;line-height:32px;}
#heroku-boomerang ul > li a{display:block;color:rgba(255,255,255,0.6);text-decoration:none;padding:0;}
#heroku-boomerang ul > li a:hover{color:#fff}
#heroku-boomerang ul > li.big a{color:#fff;padding-left:50px;}
#heroku-boomerang ul > li.big a:after{color:rgba(255,255,255,0.6);content:"\2192";margin:0 0 0 8px}
#heroku-boomerang ul > li.sub,#heroku-boomerang ul > li a{padding:0 8px 0 0}
View

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.
View
@@ -20,7 +20,7 @@ class Boomerang
# Event Listeners
window.addEventListener('click', @hideMenu)
document.querySelector("#boomerang a.toggler").addEventListener('click', @toggleMenu)
document.querySelector("#heroku-boomerang a.toggler").addEventListener('click', @toggleMenu)
# console.log @
@body.classList.add("heroku-boomerang-loaded")
@@ -35,8 +35,7 @@ class Boomerang
attachDiv: ->
@div = document.createElement("div")
@div.className = "boomerang"
@div.id = "boomerang"
@div.id = "heroku-boomerang"
@div.innerHTML = """
<a href="#" class="toggler logo">Heroku Add-ons</a>
@@ -67,11 +66,11 @@ class Boomerang
@body.appendChild(@div)
hideMenu: ->
h = document.querySelector("#boomerang")
h = document.querySelector("#heroku-boomerang")
h.classList.remove("active") if h
toggleMenu: (e=null) ->
document.querySelector("#boomerang").classList.toggle("active")
document.querySelector("#heroku-boomerang").classList.toggle("active")
# Don't let the click propage to window, or it will @hideMenu
e.stopPropagation() if e
View
@@ -3,7 +3,7 @@ backgroundColor = purple
linkColorInactive = rgba(#FFF, 0.6)
linkColorActive = rgba(#FFF, 1)
.boomerang
#heroku-boomerang
background-color backgroundColor
position fixed
float none

0 comments on commit c3f2c25

Please sign in to comment.