Onboarding guide and initial achievements refactoring (#11536)
* add achievements to user * add placeholder strings * add to achievements to common script * add onboarding achievements category * add notifications * more notifications * award achievements * wip notification panel * add achievements icons and copy * do not count onboarding tasks for the created task achievement * add notes * sprites, fixes and completion status and reward * add onboarding panel * add toggle * fix toggle size * fix tests * fix typo * add notification * start adding modal * fix remove button positionin, timeout, progress bar * modal + fixes * disable broken social links from level up modal * change toggle icon color on hover * add border bottom to onboarding guide panel * add collapse animation * expanded onboarding on first open * onboarding: flip toggle colors * onboarding: show progress bar all the time * onboarding: fix panel closing on click * onboarding modal: add close icon and fix padding * wip: add migration for existing users * fix titles in guide * fix achievements copy * do not award completed task achievement when direction is down * start implementing new achievements * start migrating client * remove social links from achievements modals * prevent skipping tutorial + fix achievement notification * sync fixes * start redesign achievement modal * misc fixes to achievements, polish generic achievement modal and hatched pet modal * add special badge for onboarding * fix badge condition * modals fixes * hatched pet modal: add close icon * fix badge typo * fix justin button * new scrolling behavior for dropdowns * fix strings capitalization * add common tests * add api unit tests * add date check * achievements modal polishing * typos * add toggle for achievements categories * typo * fix test * fix edit avatar modal cannot be closed * finish migration and correct launch date * fix migration * migration fixes * fix tests
This commit is contained in:
@@ -1,72 +1,90 @@
|
||||
.weapon_warrior_3 {
|
||||
.weapon_warrior_0 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -997px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_warrior_4 {
|
||||
.weapon_warrior_1 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -997px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_warrior_5 {
|
||||
.weapon_warrior_2 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -1088px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_warrior_6 {
|
||||
.weapon_warrior_3 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1088px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_0 {
|
||||
.weapon_warrior_4 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -1179px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_1 {
|
||||
.weapon_warrior_5 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1179px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_2 {
|
||||
.weapon_warrior_6 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -1270px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_3 {
|
||||
.weapon_wizard_0 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1270px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_4 {
|
||||
.weapon_wizard_1 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -1361px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_5 {
|
||||
.weapon_wizard_2 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1361px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_6 {
|
||||
.weapon_wizard_3 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -1452px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_4 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1452px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_5 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -1543px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.weapon_wizard_6 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1543px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.Pet_Currency_Gem {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -1298px;
|
||||
background-position: -1696px -1433px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
@@ -84,19 +102,19 @@
|
||||
}
|
||||
.PixelPaw-Gold {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1688px -1436px;
|
||||
background-position: -660px -508px;
|
||||
width: 51px;
|
||||
height: 51px;
|
||||
}
|
||||
.PixelPaw {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1740px -1436px;
|
||||
background-position: -660px -560px;
|
||||
width: 51px;
|
||||
height: 51px;
|
||||
}
|
||||
.PixelPaw002 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -220px -203px;
|
||||
background-position: -880px -655px;
|
||||
width: 51px;
|
||||
height: 51px;
|
||||
}
|
||||
@@ -132,13 +150,13 @@
|
||||
}
|
||||
.ghost {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1452px;
|
||||
background-position: -1627px -422px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.inventory_present {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -746px;
|
||||
background-position: -1696px -881px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
@@ -168,187 +186,187 @@
|
||||
}
|
||||
.inventory_present_05 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -470px;
|
||||
background-position: -1718px -422px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_present_06 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -470px;
|
||||
background-position: -1718px -513px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_present_07 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -539px;
|
||||
background-position: -1718px -604px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_present_08 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -539px;
|
||||
background-position: -1627px -743px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_present_09 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -608px;
|
||||
background-position: -1696px -743px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_present_10 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -608px;
|
||||
background-position: -1627px -812px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_present_11 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -677px;
|
||||
background-position: -1696px -812px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_present_12 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -677px;
|
||||
background-position: -1627px -881px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_birthday {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -746px;
|
||||
background-position: -1627px -950px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_congrats {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -815px;
|
||||
background-position: -1696px -950px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_fortify {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -815px;
|
||||
background-position: -1627px -1019px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_getwell {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -884px;
|
||||
background-position: -1696px -1019px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_goodluck {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -884px;
|
||||
background-position: -1627px -1088px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_greeting {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -953px;
|
||||
background-position: -1696px -1088px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_nye {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -953px;
|
||||
background-position: -1627px -1157px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_opaquePotion {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -1022px;
|
||||
background-position: -1696px -1157px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_seafoam {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -1022px;
|
||||
background-position: -1627px -1226px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_shinySeed {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -1091px;
|
||||
background-position: -1696px -1226px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_snowball {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -1091px;
|
||||
background-position: -1627px -1295px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_spookySparkles {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -1160px;
|
||||
background-position: -1696px -1295px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_thankyou {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -1160px;
|
||||
background-position: -1627px -1364px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_trinket {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -1229px;
|
||||
background-position: -1696px -1364px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.inventory_special_valentine {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -1229px;
|
||||
background-position: -1627px -1433px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.knockout {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -422px;
|
||||
background-position: -1627px -695px;
|
||||
width: 120px;
|
||||
height: 47px;
|
||||
}
|
||||
.pet_key {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -1298px;
|
||||
background-position: -220px -203px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.rebirth_orb {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -1367px;
|
||||
background-position: -220px -272px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.seafoam_star {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1802px -1543px;
|
||||
background-position: -1627px -513px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.shop_armoire {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1696px -1367px;
|
||||
background-position: -220px -341px;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.snowman {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1893px -1543px;
|
||||
background-position: -1627px -604px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
.zzz {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -220px -255px;
|
||||
background-position: -660px -612px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
.zzz_light {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1748px -422px;
|
||||
background-position: -1748px -695px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
@@ -474,7 +492,7 @@
|
||||
}
|
||||
.npc_bailey {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1627px -1436px;
|
||||
background-position: -660px -435px;
|
||||
width: 60px;
|
||||
height: 72px;
|
||||
}
|
||||
@@ -486,7 +504,7 @@
|
||||
}
|
||||
.npc_matt {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -208px -1529px;
|
||||
background-position: 0px -1529px;
|
||||
width: 195px;
|
||||
height: 138px;
|
||||
}
|
||||
@@ -504,13 +522,13 @@
|
||||
}
|
||||
.phobia_dysheartener {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -307px -220px;
|
||||
background-position: -527px -220px;
|
||||
width: 201px;
|
||||
height: 195px;
|
||||
}
|
||||
.quest_alligator {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -967px -660px;
|
||||
background-position: -1187px -880px;
|
||||
width: 201px;
|
||||
height: 213px;
|
||||
}
|
||||
@@ -528,19 +546,19 @@
|
||||
}
|
||||
.quest_atom1 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1084px -1315px;
|
||||
background-position: -873px -1315px;
|
||||
width: 250px;
|
||||
height: 150px;
|
||||
}
|
||||
.quest_atom2 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: 0px -1529px;
|
||||
background-position: -1375px -1315px;
|
||||
width: 207px;
|
||||
height: 138px;
|
||||
}
|
||||
.quest_atom3 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -433px -1315px;
|
||||
background-position: -222px -1315px;
|
||||
width: 216px;
|
||||
height: 180px;
|
||||
}
|
||||
@@ -564,7 +582,7 @@
|
||||
}
|
||||
.quest_beetle {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -747px -440px;
|
||||
background-position: -967px -660px;
|
||||
width: 204px;
|
||||
height: 201px;
|
||||
}
|
||||
@@ -576,7 +594,7 @@
|
||||
}
|
||||
.quest_bunny {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -222px -1315px;
|
||||
background-position: -307px -220px;
|
||||
width: 210px;
|
||||
height: 186px;
|
||||
}
|
||||
@@ -606,7 +624,7 @@
|
||||
}
|
||||
.quest_dilatoryDistress1 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1187px -880px;
|
||||
background-position: -1407px -1097px;
|
||||
width: 210px;
|
||||
height: 210px;
|
||||
}
|
||||
@@ -690,7 +708,7 @@
|
||||
}
|
||||
.quest_goldenknight2 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1335px -1315px;
|
||||
background-position: -1124px -1315px;
|
||||
width: 250px;
|
||||
height: 150px;
|
||||
}
|
||||
@@ -702,7 +720,7 @@
|
||||
}
|
||||
.quest_gryphon {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -650px -1315px;
|
||||
background-position: -439px -1315px;
|
||||
width: 216px;
|
||||
height: 177px;
|
||||
}
|
||||
@@ -720,7 +738,7 @@
|
||||
}
|
||||
.quest_hedgehog {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -527px -220px;
|
||||
background-position: -747px -440px;
|
||||
width: 219px;
|
||||
height: 186px;
|
||||
}
|
||||
@@ -744,7 +762,7 @@
|
||||
}
|
||||
.quest_kraken {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -867px -1315px;
|
||||
background-position: -656px -1315px;
|
||||
width: 216px;
|
||||
height: 177px;
|
||||
}
|
||||
@@ -826,9 +844,3 @@
|
||||
width: 219px;
|
||||
height: 219px;
|
||||
}
|
||||
.quest_nudibranch {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-main-12.png');
|
||||
background-position: -1407px -1097px;
|
||||
width: 216px;
|
||||
height: 216px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user