[extensions-web] Implement new Beta banner

[Jasper St. Pierre <jstpierre src gnome org>]

commit 9a53cd5bbc37f85f25165ca297835f3fa7f7e99d
Author: Jasper St. Pierre <jstpierre mecheye net>
Date:   Sun Jun 3 03:43:48 2012 -0400

    Implement new Beta banner
    
    This is what I'm wasting my time on these days...

 sweettooth/static/css/sweettooth.css |   36 +++++++++++++++++++--------------
 sweettooth/templates/base.html       |    3 +-
 2 files changed, 23 insertions(+), 16 deletions(-)
---
diff --git a/sweettooth/static/css/sweettooth.css b/sweettooth/static/css/sweettooth.css
index aea9703..259676a 100644
--- a/sweettooth/static/css/sweettooth.css
+++ b/sweettooth/static/css/sweettooth.css
@@ -75,22 +75,28 @@
 }
 
 .beta-banner {
-    -webkit-transform: rotate(-7deg);
-    -moz-transform: rotate(-7deg);
-    -ms-transform: rotate(-7deg);
-    -o-transform: rotate(-7deg);
-    transform: rotate(-7deg);
-    font-size: .6em;
-    background-color: #42BC42;
-    background-color: rgba(66, 188, 66, 0.7);
-    color: white;
-    text-shadow: none;
-    padding: .4em;
+    -moz-transform: rotate(-35deg);
+    z-index: -1;
+    display: block;
+    text-align: center;
+    text-transform: uppercase;
+    font-family: Serif;
+    font-size: 1.4em;
     position: absolute;
-    border-radius: 1em;
-    line-height: 1;
-    margin-left: -60px;
-    margin-top: -5px;
+    width: 200px;
+    top: 36px;
+    left: -45px;
+    border: 1px solid #4e9a06;
+}
+
+.beta-banner span {
+    display: block;
+    background-image: -moz-linear-gradient(#4e9a06, #73d216);
+    background-color: #73d216;
+    color: white;
+    text-shadow: 0px 2px 0 rgba(0, 0, 0, 0.4);
+    border-top: 1px solid #73d216;
+    border-bottom: 1px solid #a9ef65;
 }
 
 .beta-disclaimer {
diff --git a/sweettooth/templates/base.html b/sweettooth/templates/base.html
index f1939ca..7b65744 100644
--- a/sweettooth/templates/base.html
+++ b/sweettooth/templates/base.html
@@ -45,8 +45,9 @@
 
     <!-- header -->
     <div id="gnome_header">
+      <div class="beta-banner"><span>Beta</span></div>
       <div class="maxwidth">
-        <h1><a href="/"><img src="/static/images/foot.png" alt="GNOME" />Extensions</a><span class="beta-banner">Beta!</span></h1>
+        <h1><a href="/"><img src="/static/images/foot.png" alt="GNOME" />Extensions</a></h1>
         
         <ul id="globalnav" class="{% block navclass %}{% endblock %}">
           <li class="main"><a href="{% url extensions-index %}">Extensions</a></li>