Updated example page

riccio82 · Oct 16, 2015 · 792a12e · 792a12e
1 parent b24653e
commit 792a12e
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 6 deletions.
diff --git a/example/src/images/congruent_pentagon.png b/example/src/images/congruent_pentagon.png
diff --git a/example/src/images/footer_lodyas.png b/example/src/images/footer_lodyas.png
diff --git a/example/src/scripts/App.jsx b/example/src/scripts/App.jsx
@@ -123,9 +123,10 @@ NotificationSystemExample = React.createClass({
         <div className="wrapper">
           <NotificationGenerator notifications={ this._notificationSystemInstance } allowHTML={ this._allowHTML } />
         </div>
-        <footer className="footer fractal">
+        <footer className="footer gradient">
+          <div className="overlay"></div>
           <div className="wrapper">
-            <p>Made in Brasília/Brazil by <a href="http://igorprado.com">Igor Prado</a>. <a href="https://github.com/igorprado/react-notification-system">See at Github</a>.</p>
+            <p>Made in Brasília, Brazil by <a href="http://igorprado.com" target="_blank">Igor Prado</a>.</p>
           </div>
         </footer>
         <NotificationSystem ref="notificationSystem" allowHTML={ this.state.allowHTML } />

diff --git a/example/src/styles/base.sass b/example/src/styles/base.sass
@@ -21,6 +21,8 @@ html, body
   padding: 150px 0 0
   text-align: center
   border-bottom: 6px solid $blue-green
+  position: relative
+  height: auto
 
 .overlay
   background: url(../images/congruent_pentagon.png) top left repeat
@@ -30,13 +32,11 @@ html, body
   width: 100%
   height: 100%
   opacity: 0.3
+  background-attachment: fixed
 
 .content
   position: relative
 
-.fractal
-  background: url(../images/footer_lodyas.png) top left repeat;
-
 .gradient
   background: #00b7ea; /* Old browsers */
   background: -moz-linear-gradient(-45deg,  #00b7ea 0%, #8ca246 100%); /* FF3.6+ */
@@ -46,6 +46,7 @@ html, body
   background: -ms-linear-gradient(-45deg,  #00b7ea 0%,#8ca246 100%); /* IE10+ */
   background: linear-gradient(135deg,  #00b7ea 0%,#8ca246 100%); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#8ca246',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
+  background-attachment: fixed
 
 .title
   color: #FFF
@@ -94,12 +95,14 @@ html, body
 .wrapper
   max-width: 520px
   margin: 40px auto 0
+  position: relative
 
 h2
   color: $blue-green
 
 a
-  color: #ffde00
+  color: $blue-green
+  font-weight: bold
 
 .hide
   display: none !important
@@ -108,3 +111,4 @@ a
   color: #FFF
   text-align: center
   padding: 20px 0
+  position: relative