refactor(client): move to Vite by @phillipthelen
This commit is contained in:
Kalista Payne
@@ -20,7 +20,7 @@ body.modal-open .habitica-top-banner {
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.habitica-top-banner {
|
||||
width: 100%;
|
||||
|
||||
@@ -41,7 +41,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.announce-text {
|
||||
color: $purple-50;
|
||||
@@ -56,7 +56,7 @@
|
||||
rgba(255,190,93,1) 25%,
|
||||
rgba(255,190,93,1) 75%,
|
||||
rgba(255,190,93,0) 100%),
|
||||
url('~@/assets/images/glitter.png');
|
||||
url('@/assets/images/glitter.png');
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -86,8 +86,8 @@ import find from 'lodash/find';
|
||||
import { mapState } from '@/libs/store';
|
||||
import BaseBanner from './base';
|
||||
|
||||
import giftsBirthday from '@/assets/svg/gifts-birthday.svg';
|
||||
import tenBirthday from '@/assets/svg/10th-birthday-linear.svg';
|
||||
import giftsBirthday from '@/assets/svg/gifts-birthday.svg?raw';
|
||||
import tenBirthday from '@/assets/svg/10th-birthday-linear.svg?raw';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.chat-banner {
|
||||
width: 100%;
|
||||
|
||||
@@ -28,7 +28,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.resting-banner {
|
||||
background-color: $blue-10;
|
||||
|
||||
@@ -15,62 +15,62 @@
|
||||
v-if="eventName === 'fall_extra_gems'"
|
||||
class="d-none d-xl-block"
|
||||
srcset="
|
||||
~@/assets/images/gems/fall-confetti-left/confetti.png,
|
||||
~@/assets/images/gems/fall-confetti-left/confetti@2x.png 2x,
|
||||
~@/assets/images/gems/fall-confetti-left/confetti@3x.png 3x"
|
||||
src="~@/assets/images/gems/fall-confetti-left/confetti.png"
|
||||
@/assets/images/gems/fall-confetti-left/confetti.png,
|
||||
@/assets/images/gems/fall-confetti-left/confetti@2x.png 2x,
|
||||
@/assets/images/gems/fall-confetti-left/confetti@3x.png 3x"
|
||||
src="@/assets/images/gems/fall-confetti-left/confetti.png"
|
||||
>
|
||||
<img
|
||||
v-else-if="eventName === 'spooky_extra_gems'"
|
||||
class="d-none d-xl-block"
|
||||
srcset="
|
||||
~@/assets/images/gems/spooky-confetti-left/confetti.png,
|
||||
~@/assets/images/gems/spooky-confetti-left/confetti@2x.png 2x,
|
||||
~@/assets/images/gems/spooky-confetti-left/confetti@3x.png 3x"
|
||||
src="~@/assets/images/gems/spooky-confetti-left/confetti.png"
|
||||
@/assets/images/gems/spooky-confetti-left/confetti.png,
|
||||
@/assets/images/gems/spooky-confetti-left/confetti@2x.png 2x,
|
||||
@/assets/images/gems/spooky-confetti-left/confetti@3x.png 3x"
|
||||
src="@/assets/images/gems/spooky-confetti-left/confetti.png"
|
||||
>
|
||||
<div class="promo-test">
|
||||
<img
|
||||
v-if="eventName === 'fall_extra_gems'"
|
||||
srcset="
|
||||
~@/assets/images/gems/fall-text/text.png,
|
||||
~@/assets/images/gems/fall-text/text@2x.png 2x,
|
||||
~@/assets/images/gems/fall-text/text@3x.png 3x"
|
||||
src="~@/assets/images/gems/fall-text/text.png"
|
||||
@/assets/images/gems/fall-text/text.png,
|
||||
@/assets/images/gems/fall-text/text@2x.png 2x,
|
||||
@/assets/images/gems/fall-text/text@3x.png 3x"
|
||||
src="@/assets/images/gems/fall-text/text.png"
|
||||
>
|
||||
<img
|
||||
v-else-if="eventName === 'spooky_extra_gems'"
|
||||
srcset="
|
||||
~@/assets/images/gems/spooky-text/text.png,
|
||||
~@/assets/images/gems/spooky-text/text@2x.png 2x,
|
||||
~@/assets/images/gems/spooky-text/text@3x.png 3x"
|
||||
src="~@/assets/images/gems/spooky-text/text.png"
|
||||
@/assets/images/gems/spooky-text/text.png,
|
||||
@/assets/images/gems/spooky-text/text@2x.png 2x,
|
||||
@/assets/images/gems/spooky-text/text@3x.png 3x"
|
||||
src="@/assets/images/gems/spooky-text/text.png"
|
||||
>
|
||||
</div>
|
||||
<img
|
||||
v-if="eventName === 'fall_extra_gems'"
|
||||
class="d-none d-xl-block"
|
||||
srcset="
|
||||
~@/assets/images/gems/fall-confetti-right/confetti.png,
|
||||
~@/assets/images/gems/fall-confetti-right/confetti@2x.png 2x,
|
||||
~@/assets/images/gems/fall-confetti-right/confetti@3x.png 3x"
|
||||
src="~@/assets/images/gems/fall-confetti-right/confetti.png"
|
||||
@/assets/images/gems/fall-confetti-right/confetti.png,
|
||||
@/assets/images/gems/fall-confetti-right/confetti@2x.png 2x,
|
||||
@/assets/images/gems/fall-confetti-right/confetti@3x.png 3x"
|
||||
src="@/assets/images/gems/fall-confetti-right/confetti.png"
|
||||
>
|
||||
<img
|
||||
v-else-if="eventName === 'spooky_extra_gems'"
|
||||
class="d-none d-xl-block"
|
||||
srcset="
|
||||
~@/assets/images/gems/spooky-confetti-right/confetti.png,
|
||||
~@/assets/images/gems/spooky-confetti-right/confetti@2x.png 2x,
|
||||
~@/assets/images/gems/spooky-confetti-right/confetti@3x.png 3x"
|
||||
src="~@/assets/images/gems/spooky-confetti-right/confetti.png"
|
||||
@/assets/images/gems/spooky-confetti-right/confetti.png,
|
||||
@/assets/images/gems/spooky-confetti-right/confetti@2x.png 2x,
|
||||
@/assets/images/gems/spooky-confetti-right/confetti@3x.png 3x"
|
||||
src="@/assets/images/gems/spooky-confetti-right/confetti.png"
|
||||
>
|
||||
</div>
|
||||
</base-banner>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.gems-promo-banner-fall_extra_gems {
|
||||
background: $gray-10;
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.announce-text {
|
||||
color: $white;
|
||||
@@ -67,7 +67,7 @@ import find from 'lodash/find';
|
||||
import { mapState } from '@/libs/store';
|
||||
import BaseBanner from './base';
|
||||
|
||||
import gifts from '@/assets/svg/gifts.svg';
|
||||
import gifts from '@/assets/svg/gifts.svg?raw';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
||||
@@ -74,7 +74,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
#app-header {
|
||||
padding-left: 24px;
|
||||
|
||||
@@ -402,9 +402,9 @@ body.modal-open #habitica-menu {
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '~@/assets/scss/utils.scss';
|
||||
@import '~@/assets/scss/variables.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/utils.scss';
|
||||
@import '@/assets/scss/variables.scss';
|
||||
|
||||
.menu-toggle {
|
||||
border: none;
|
||||
@@ -417,7 +417,7 @@ body.modal-open #habitica-menu {
|
||||
|
||||
.topbar {
|
||||
z-index: 1080;
|
||||
background: $purple-100 url(~@/assets/svg/for-css/bits.svg) right top no-repeat;
|
||||
background: $purple-100 url(@/assets/svg/for-css/bits.svg) right top no-repeat;
|
||||
min-height: 56px;
|
||||
box-shadow: 0 1px 2px 0 rgba($black, 0.24);
|
||||
|
||||
@@ -740,12 +740,12 @@ body.modal-open #habitica-menu {
|
||||
import { mapState, mapGetters } from '@/libs/store';
|
||||
import { goToModForm } from '@/libs/modform';
|
||||
|
||||
import gemIcon from '@/assets/svg/gem.svg';
|
||||
import goldIcon from '@/assets/svg/gold.svg';
|
||||
import syncIcon from '@/assets/svg/sync.svg';
|
||||
import svgHourglasses from '@/assets/svg/hourglass.svg';
|
||||
import chevronDownIcon from '@/assets/svg/chevron-down.svg';
|
||||
import melior from '@/assets/svg/melior.svg';
|
||||
import gemIcon from '@/assets/svg/gem.svg?raw';
|
||||
import goldIcon from '@/assets/svg/gold.svg?raw';
|
||||
import syncIcon from '@/assets/svg/sync.svg?raw';
|
||||
import svgHourglasses from '@/assets/svg/hourglass.svg?raw';
|
||||
import chevronDownIcon from '@/assets/svg/chevron-down.svg?raw';
|
||||
import melior from '@/assets/svg/melior.svg?raw';
|
||||
|
||||
import creatorIntro from '../creatorIntro';
|
||||
import notificationMenu from './notificationsDropdown';
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.message-count {
|
||||
background-color: $red-50;
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss"> // Not scoped because the classes could be used in i18n strings
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
.notification-small {
|
||||
font-size: 12px;
|
||||
line-height: 1.33;
|
||||
@@ -68,7 +68,7 @@
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.notification {
|
||||
width: 378px;
|
||||
@@ -132,7 +132,7 @@
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import closeIcon from '@/assets/svg/close.svg';
|
||||
import closeIcon from '@/assets/svg/close.svg?raw';
|
||||
import { mapActions, mapState } from '@/libs/store';
|
||||
|
||||
export default {
|
||||
|
||||
@@ -39,14 +39,14 @@
|
||||
</template>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
small, strong {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.notification {
|
||||
background-image: url('~@/assets/images/g1g1-notif.png');
|
||||
background-image: url('@/assets/images/g1g1-notif.png');
|
||||
height: 10rem;
|
||||
padding: 3rem;
|
||||
position: relative;
|
||||
@@ -81,7 +81,7 @@
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import closeIcon from '@/assets/svg/close-teal.svg';
|
||||
import closeIcon from '@/assets/svg/close-teal.svg?raw';
|
||||
import { mapActions } from '@/libs/store';
|
||||
|
||||
export default {
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
>
|
||||
<img
|
||||
class="onboarding-complete-banner d-block"
|
||||
src="~@/assets/images/onboarding-complete-banner@2x.png"
|
||||
src="@/assets/images/onboarding-complete-banner@2x.png"
|
||||
>
|
||||
<h3 v-once>
|
||||
{{ $t('onboardingComplete') }}
|
||||
@@ -36,7 +36,7 @@
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.onboarding-complete-content {
|
||||
text-align: center;
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
|
||||
<script>
|
||||
import BaseNotification from './base';
|
||||
import sparklesIcon from '@/assets/svg/sparkles.svg';
|
||||
import sparklesIcon from '@/assets/svg/sparkles.svg?raw';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
||||
@@ -102,7 +102,7 @@
|
||||
}
|
||||
|
||||
.left-hearts {
|
||||
background-image: url('~@/assets/images/world-boss/left-hearts@3x.png');
|
||||
background-image: url('@/assets/images/world-boss/left-hearts@3x.png');
|
||||
}
|
||||
|
||||
.quest_dysheartener_notification, .phobia_dysheartener_notification {
|
||||
@@ -116,12 +116,12 @@
|
||||
}
|
||||
|
||||
.quest_dysheartener_notification {
|
||||
background-image: url('~@/assets/images/world-boss/mantis-static-notification@3x.png');
|
||||
background-image: url('@/assets/images/world-boss/mantis-static-notification@3x.png');
|
||||
}
|
||||
|
||||
.phobia_dysheartener_notification {
|
||||
display: none;
|
||||
background-image: url('~@/assets/images/world-boss/heart-translucent-shadow-notification@3x.png');
|
||||
background-image: url('@/assets/images/world-boss/heart-translucent-shadow-notification@3x.png');
|
||||
}
|
||||
|
||||
.health-bar {
|
||||
@@ -173,8 +173,8 @@ import * as quests from '@/../../common/script/content/quests';
|
||||
import { mapState } from '@/libs/store';
|
||||
import BaseNotification from './base';
|
||||
|
||||
import health from '@/assets/svg/health.svg';
|
||||
import sword from '@/assets/svg/sword.svg';
|
||||
import health from '@/assets/svg/health.svg?raw';
|
||||
import sword from '@/assets/svg/sword.svg?raw';
|
||||
import { worldStateMixin } from '@/mixins/worldState';
|
||||
|
||||
export default {
|
||||
|
||||
@@ -73,7 +73,7 @@
|
||||
</template>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.dropdown-item {
|
||||
padding: 16px 24px;
|
||||
@@ -115,12 +115,12 @@
|
||||
import * as quests from '@/../../common/script/content/quests';
|
||||
import { hasCompletedOnboarding } from '@/../../common/script/libs/onboarding';
|
||||
import { mapState, mapActions } from '@/libs/store';
|
||||
import notificationsIcon from '@/assets/svg/notifications.svg';
|
||||
import notificationsIcon from '@/assets/svg/notifications.svg?raw';
|
||||
import MenuDropdown from '../ui/customMenuDropdown';
|
||||
import MessageCount from './messageCount.functional.vue';
|
||||
import { CONSTANTS, getLocalSetting, setLocalSetting } from '@/libs/userlocalManager';
|
||||
import successImage from '@/assets/svg/success.svg';
|
||||
import starBadge from '@/assets/svg/star-badge.svg';
|
||||
import successImage from '@/assets/svg/success.svg?raw';
|
||||
import starBadge from '@/assets/svg/star-badge.svg?raw';
|
||||
|
||||
// Notifications
|
||||
import CARD_RECEIVED from './notifications/cardReceived';
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
</template>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
|
||||
.onboarding-guide-panel {
|
||||
white-space: normal;
|
||||
@@ -193,8 +193,8 @@
|
||||
import achievs from '@/../../common/script/libs/achievements';
|
||||
import { mapState } from '@/libs/store';
|
||||
|
||||
import onboardingGuideBanner from '@/assets/svg/onboarding-guide-banner.svg';
|
||||
import downIcon from '@/assets/svg/down.svg';
|
||||
import onboardingGuideBanner from '@/assets/svg/onboarding-guide-banner.svg?raw';
|
||||
import downIcon from '@/assets/svg/down.svg?raw';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
|
||||
@@ -80,10 +80,10 @@
|
||||
<img
|
||||
class="swords mb-3"
|
||||
srcset="
|
||||
~@/assets/images/swords.png,
|
||||
~@/assets/images/swords@2x.png 2x,
|
||||
~@/assets/images/swords@3x.png 3x"
|
||||
src="~@/assets/images/swords.png"
|
||||
@/assets/images/swords.png,
|
||||
@/assets/images/swords@2x.png 2x,
|
||||
@/assets/images/swords@3x.png 3x"
|
||||
src="@/assets/images/swords.png"
|
||||
>
|
||||
<p
|
||||
v-once
|
||||
@@ -104,7 +104,7 @@
|
||||
</template>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
@import '~@/assets/scss/colors.scss';
|
||||
@import '@/assets/scss/colors.scss';
|
||||
@media only screen and (max-width: 992px) {
|
||||
.item-with-icon.item-user {
|
||||
margin-right: 0px;
|
||||
@@ -140,7 +140,7 @@
|
||||
|
||||
<script>
|
||||
import { mapState } from '@/libs/store';
|
||||
import userIcon from '@/assets/svg/user.svg';
|
||||
import userIcon from '@/assets/svg/user.svg?raw';
|
||||
import MenuDropdown from '../ui/customMenuDropdown';
|
||||
import MessageCount from './messageCount.functional.vue';
|
||||
import { EVENTS } from '@/libs/events';
|
||||
|
||||
Reference in New Issue
Block a user