Add Meloetta icons to roomlist

2.7ish years ago, when I redesigned PS, PS's mascot was Meloetta,
and in the old design, there was a Meloetta-P icon on "Look for a
battle" and a Meloetta-A in the backgroud of the chat room.

The new design was built around custom backgrounds, and there
wasn't really room to fit Meloetta back in.

Well, now, I've finally fit Meloetta back in next to the user count
and battle count, and it actually looks pretty good there. Now more
people can be aware that PS has a mascot!
This commit is contained in:
Guangcong Luo 2015-11-28 04:00:22 -05:00
parent 789acecf54
commit 8264fea7d2
2 changed files with 7 additions and 3 deletions

View File

@ -59,8 +59,8 @@
var userCount = Number(rooms.userCount);
var battleCount = Number(rooms.battleCount);
buf += '<table class="roomcounters" border="0" cellspacing="0" cellpadding="0" width="100%"><tr><td>';
buf += '<button class="button" name="finduser"><strong>' + userCount + '</strong> ' + (userCount == 1 ? 'user' : 'users') + ' online</button></td><td>';
buf += '<button class="button" name="roomlist"><strong>' + battleCount + '</strong> active ' + (battleCount == 1 ? 'battle' : 'battles') + '</button>';
buf += '<span style="' + Tools.getIcon('meloetta') + ';display:inline-block;vertical-align:middle;transform:scaleX(-1);webkit-transform:scaleX(-1);" class="pokemonicon" title="Meloetta is PS\'s mascot! The Aria forme is about using its voice, and represents our chatrooms."></span> <button class="button" name="finduser"><strong>' + userCount + '</strong> ' + (userCount == 1 ? 'user' : 'users') + ' online</button></td><td>';
buf += '<button class="button" name="roomlist"><strong>' + battleCount + '</strong> active ' + (battleCount == 1 ? 'battle' : 'battles') + '</button> <span style="' + Tools.getIcon('meloetta-pirouette') + ';display:inline-block;vertical-align:middle" class="pokemonicon" title="Meloetta is PS\'s mascot! The Pirouette forme is Fighting-type, and represents our battles."></span>';
buf += '</td></tr></table>';
this.$('.roomlisttop').html(buf);
}

View File

@ -947,12 +947,16 @@ p.or:after {
max-width: 480px;
margin-bottom: 10px;
}
.roomcounters {
margin: 4px auto;
max-width: 400px;
}
.roomcounters td {
text-align: center;
}
.roomcounters button {
margin: 0 auto;
width: 140px;
width: 120px;
height: 60px;
padding: 3px 8px;
text-align: center;