From 1fc549e6c156dcb2aec6fc710934ad1bc60c0253 Mon Sep 17 00:00:00 2001
From: benmanley <info@benmanley.org>
Date: Sun, 16 Mar 2014 23:53:51 +0000
Subject: [PATCH] Add herobox background colour variables

---
 public/css/avatar.styl     | 9 +++++----
 public/css/color-vars.styl | 4 +++-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/public/css/avatar.styl b/public/css/avatar.styl
index 5afe496a29..2f08387d30 100644
--- a/public/css/avatar.styl
+++ b/public/css/avatar.styl
@@ -27,7 +27,7 @@ future re: pets and whatnot, this is just temporary.
 	margin: 0 // need this b/c of bootstrap, remove or reset later
 	position: relative
 	cursor: pointer
-	background: #f5f5f5
+	background: $color-herobox
 	transition: border 0.25s ease-out, background 0.25s ease-out//, padding 0.13s ease-out
 	outline: 1px solid rgba(0,0,0,0.1)
 // padding: 0 // push down the sprite
@@ -53,7 +53,7 @@ future re: pets and whatnot, this is just temporary.
 .herobox.isUser:not(.hasMount):after
 	opacity: 1
 	// make it a bit special
-	background darken($better, 15%)
+	background darken($color-herobox, 15%)
 
 .character-sprites span
     position: absolute
@@ -65,6 +65,7 @@ future re: pets and whatnot, this is just temporary.
 // if not user's avatar, remove lines for party unity
 .herobox:not(.isUser)
   outline: 0
+  background-color: darken($color-herobox, 8%)
 
 // vertically center avatar sprite depending on if they have a pet
 .herobox.hasPet
@@ -77,7 +78,7 @@ future re: pets and whatnot, this is just temporary.
 // expose hero info on hover, taking
 // into account the extra pet space
 .herobox:hover, .herobox:focus
-	background: desaturate(lighten($better, 30%), 10%)
+	background: lighten($color-herobox, 30%)
 	&:after
 		opacity: 1
 
@@ -92,4 +93,4 @@ future re: pets and whatnot, this is just temporary.
 		position: absolute
 
 .herobox.isLeader
-	background: $better
\ No newline at end of file
+	background: lighten($color-herobox, 10%)
\ No newline at end of file
diff --git a/public/css/color-vars.styl b/public/css/color-vars.styl
index 2b2250be6f..fe84027b98 100644
--- a/public/css/color-vars.styl
+++ b/public/css/color-vars.styl
@@ -6,4 +6,6 @@ $neutral    =   rgb(255, 242, 204)
 $good       =   rgb(217, 234, 211)
 $better     =   rgb(208, 224, 227)
 $best       =   rgb(201, 218, 248)
-$completed  =   rgb(217, 217, 217)
\ No newline at end of file
+$completed  =   rgb(217, 217, 217)
+// avatar background color variables
+$color-herobox = desaturate(lighten($better, 16%),32%)