feat(event): turn on G1G1 2019
This commit is contained in:
+70
-10
@@ -64,6 +64,30 @@
|
||||
></span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="g1g1-banner d-flex justify-content-center align-items-center"
|
||||
v-if="!giftingHidden">
|
||||
<div
|
||||
class="svg-icon svg-gifts left-gift"
|
||||
v-html="icons.gifts">
|
||||
</div>
|
||||
<router-link class="g1g1-link" to="/user/settings/subscription">
|
||||
{{ $t('g1g1Announcement') }}
|
||||
</router-link>
|
||||
<div
|
||||
class="svg-icon svg-gifts right-gift"
|
||||
v-html="icons.gifts">
|
||||
</div>
|
||||
<div
|
||||
class="closepadding"
|
||||
@click="hideGiftingBanner()">
|
||||
<span
|
||||
class="svg-icon inline-icon icon-10"
|
||||
aria-hidden="true"
|
||||
v-html="icons.close">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<notifications-display />
|
||||
<app-menu />
|
||||
<div class="container-fluid">
|
||||
@@ -135,10 +159,43 @@
|
||||
cursor: crosshair;
|
||||
}
|
||||
|
||||
.closepadding {
|
||||
margin: 11px 24px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
right: 0;
|
||||
top: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
|
||||
.g1g1-banner {
|
||||
width: 100%;
|
||||
min-height: 2.5rem;
|
||||
background-color: $teal-50;
|
||||
}
|
||||
|
||||
.g1g1-link {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.left-gift {
|
||||
margin: auto 1rem auto auto;
|
||||
}
|
||||
|
||||
.right-gift {
|
||||
margin: auto auto auto 1rem;
|
||||
filter: flipH;
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
.svg-gifts {
|
||||
width: 4.6rem;
|
||||
}
|
||||
|
||||
.notification {
|
||||
border-radius: 1000px;
|
||||
background-color: $green-10;
|
||||
@@ -165,15 +222,6 @@
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.closepadding {
|
||||
margin: 11px 24px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
right: 0;
|
||||
top: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
.content {
|
||||
font-size: 12px;
|
||||
@@ -239,8 +287,14 @@ import subCancelModalConfirm from '@/components/payments/cancelModalConfirm';
|
||||
import subCanceledModal from '@/components/payments/canceledModal';
|
||||
|
||||
import spellsMixin from '@/mixins/spells';
|
||||
import { CONSTANTS, getLocalSetting, removeLocalSetting } from '@/libs/userlocalManager';
|
||||
import {
|
||||
CONSTANTS,
|
||||
getLocalSetting,
|
||||
removeLocalSetting,
|
||||
setLocalSetting,
|
||||
} from '@/libs/userlocalManager';
|
||||
|
||||
import gifts from '@/assets/svg/gifts.svg';
|
||||
import svgClose from '@/assets/svg/close.svg';
|
||||
import bannedAccountModal from '@/components/bannedAccountModal';
|
||||
|
||||
@@ -267,6 +321,7 @@ export default {
|
||||
return {
|
||||
icons: Object.freeze({
|
||||
close: svgClose,
|
||||
gifts,
|
||||
}),
|
||||
selectedItemToBuy: null,
|
||||
selectedSpellToBuy: null,
|
||||
@@ -277,6 +332,7 @@ export default {
|
||||
loading: true,
|
||||
currentTipNumber: 0,
|
||||
bannerHidden: false,
|
||||
giftingHidden: getLocalSetting(CONSTANTS.keyConstants.GIFTING_BANNER_DISPLAY) === 'dismissed',
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@@ -670,6 +726,10 @@ export default {
|
||||
hideBanner () {
|
||||
this.bannerHidden = true;
|
||||
},
|
||||
hideGiftingBanner () {
|
||||
setLocalSetting(CONSTANTS.keyConstants.GIFTING_BANNER_DISPLAY, 'dismissed');
|
||||
this.giftingHidden = true;
|
||||
},
|
||||
resumeDamage () {
|
||||
this.$store.dispatch('user:sleep');
|
||||
},
|
||||
|
||||
@@ -1,72 +1,36 @@
|
||||
.promo_achievement_white {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -928px -465px;
|
||||
background-position: -283px -293px;
|
||||
width: 204px;
|
||||
height: 102px;
|
||||
}
|
||||
.promo_armoire_backgrounds_201912 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -928px 0px;
|
||||
background-position: 0px 0px;
|
||||
width: 423px;
|
||||
height: 147px;
|
||||
}
|
||||
.promo_costume_achievement {
|
||||
.promo_g1g1_2019 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -1175px -296px;
|
||||
width: 144px;
|
||||
height: 156px;
|
||||
}
|
||||
.promo_delightful_dinos {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: 0px -752px;
|
||||
width: 423px;
|
||||
height: 147px;
|
||||
}
|
||||
.promo_ember_thunderstorm_potions {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -424px -752px;
|
||||
width: 423px;
|
||||
height: 147px;
|
||||
}
|
||||
.promo_harvest_feast {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -928px -296px;
|
||||
width: 246px;
|
||||
height: 168px;
|
||||
background-position: 0px -148px;
|
||||
width: 357px;
|
||||
height: 144px;
|
||||
}
|
||||
.promo_mystery_201912 {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -928px -148px;
|
||||
background-position: 0px -293px;
|
||||
width: 282px;
|
||||
height: 147px;
|
||||
}
|
||||
.promo_take_this {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -1211px -148px;
|
||||
background-position: -424px -196px;
|
||||
width: 96px;
|
||||
height: 69px;
|
||||
}
|
||||
.scene_habitica_map {
|
||||
.scene_todos {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: 0px 0px;
|
||||
width: 450px;
|
||||
height: 450px;
|
||||
}
|
||||
.scene_office {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -421px -451px;
|
||||
width: 360px;
|
||||
height: 240px;
|
||||
}
|
||||
.scene_seaserpent {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: -451px 0px;
|
||||
width: 476px;
|
||||
height: 364px;
|
||||
}
|
||||
.scene_yarn_boss {
|
||||
background-image: url('~@/assets/images/sprites/spritesmith-largeSprites-0.png');
|
||||
background-position: 0px -451px;
|
||||
width: 420px;
|
||||
height: 300px;
|
||||
background-position: -424px 0px;
|
||||
width: 240px;
|
||||
height: 195px;
|
||||
}
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 93 KiB After Width: | Height: | Size: 28 KiB |
@@ -76,7 +76,7 @@
|
||||
</h3>
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<!-- eslint-disable vue/no-use-v-if-with-v-for -->
|
||||
<div
|
||||
@@ -98,6 +98,11 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
<h4 v-once> {{ $t('winterPromoGiftHeader') }} </h4>
|
||||
<p v-once> {{ $t('winterPromoGiftDetails1') }} </p>
|
||||
<p v-once> {{ $t('winterPromoGiftDetails2') }} </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -237,6 +237,11 @@
|
||||
{{ $t('giftSubscriptionText4') }}
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<h2 v-once> {{ $t('winterPromoGiftHeader') }} </h2>
|
||||
<p v-once> {{ $t('winterPromoGiftDetails1') }} </p>
|
||||
<p v-once> {{ $t('winterPromoGiftDetails2') }} </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -20,6 +20,10 @@
|
||||
z-index: 1400; // 1400 is above modal backgrounds
|
||||
|
||||
&-top-pos {
|
||||
&-double {
|
||||
top: 145px;
|
||||
}
|
||||
|
||||
&-normal {
|
||||
top: 65px;
|
||||
}
|
||||
@@ -34,6 +38,7 @@
|
||||
<script>
|
||||
import { mapState } from '@/libs/store';
|
||||
import notification from './notification';
|
||||
import { CONSTANTS, getLocalSetting } from '@/libs/userlocalManager';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
@@ -47,7 +52,9 @@ export default {
|
||||
notificationsTopPos () {
|
||||
const base = 'notifications-top-pos-';
|
||||
let modifier = '';
|
||||
if (this.userSleeping) {
|
||||
if (this.userSleeping && this.giftingShown) {
|
||||
modifier = 'double';
|
||||
} else if (this.userSleeping || this.giftingShown) {
|
||||
modifier = 'sleeping';
|
||||
} else {
|
||||
modifier = 'normal';
|
||||
@@ -55,5 +62,10 @@ export default {
|
||||
return `${base}${modifier}`;
|
||||
},
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
giftingShown: getLocalSetting(CONSTANTS.keyConstants.GIFTING_BANNER_DISPLAY) !== 'dismissed',
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -5,6 +5,7 @@ const CONSTANTS = {
|
||||
EQUIPMENT_DRAWER_STATE: 'equipment-drawer-state',
|
||||
CURRENT_EQUIPMENT_DRAWER_TAB: 'current-equipment-drawer-tab',
|
||||
STABLE_SORT_STATE: 'stable-sort-state',
|
||||
GIFTING_BANNER_DISPLAY: 'gifting-banner-display',
|
||||
},
|
||||
drawerStateValues: {
|
||||
DRAWER_CLOSED: 'drawer-closed',
|
||||
|
||||
Reference in New Issue
Block a user