WIP(party-page): Party preview graphic

common/dist/sprites/spritesmith1.css

@@ -12,13 +12,13 @@
 }
 .hair_base_11_festive {
   background-image: url(spritesmith1.png);
-  background-position: -1274px -1092px;
+  background-position: -1274px -1183px;
   width: 90px;
   height: 90px;
 }
 .customize-option.hair_base_11_festive {
   background-image: url(spritesmith1.png);
-  background-position: -1299px -1107px;
+  background-position: -1299px -1198px;
   width: 60px;
   height: 60px;
 }
@@ -2496,25 +2496,25 @@
 }
 .hair_base_2_pgreen2 {
   background-image: url(spritesmith1.png);
-  background-position: 0px 0px;
+  background-position: -1274px -1092px;
   width: 90px;
   height: 90px;
 }
 .customize-option.hair_base_2_pgreen2 {
   background-image: url(spritesmith1.png);
-  background-position: -25px -15px;
+  background-position: -1299px -1107px;
   width: 60px;
   height: 60px;
 }
 .hair_base_2_porange {
   background-image: url(spritesmith1.png);
-  background-position: -1274px -1183px;
+  background-position: 0px 0px;
   width: 90px;
   height: 90px;
 }
 .customize-option.hair_base_2_porange {
   background-image: url(spritesmith1.png);
-  background-position: -1299px -1198px;
+  background-position: -25px -15px;
   width: 60px;
   height: 60px;
 }
@@ -5002,3 +5002,15 @@
   width: 60px;
   height: 60px;
 }
+.hair_base_7_white {
+  background-image: url(spritesmith1.png);
+  background-position: -1820px -1547px;
+  width: 90px;
+  height: 90px;
+}
+.customize-option.hair_base_7_white {
+  background-image: url(spritesmith1.png);
+  background-position: -1845px -1562px;
+  width: 60px;
+  height: 60px;
+}

website/public/css/shared.styl

@@ -68,6 +68,9 @@ ul
 .margin-auto
   margin: auto auto 1em auto
 
+.width-0
+  width: 0
+
 .width-50
   width: 50%
 

website/views/options/social/party.jade

@@ -12,12 +12,11 @@ script(type='text/ng-template', id='partials/options.social.party.html')
     div(ng-hide='user.invitations.party.id').container-fluid
       .row.margin-auto.text-center
         a.btn.btn-primary.btn-lg.width-50(ng-click="inviteOrStartParty(group)")=env.t("startPartyWithFriends")
-      .row.margin-auto.text-center(ng-controller='UserCtrl')
-        .margin-auto
-          span.inline-block.quest_vice3
-          span.figure.herobox.inline-block
-            .character-sprites
-              +generatedAvatar
+      .row.text-center.margin-auto(ng-controller='UserCtrl')
+        span.inline-block.party_preview(style='margin-left:-100px')
+        span.figure.herobox.inline-block.width-0
+          .character-sprites(style='width:0')
+            +generatedAvatar
       .row.margin-auto.text-center
         ul
           li=env.t('partyExplanation1')