Does not reuse same css classes, imports them from pin.scss. For the togglePin function the notification.

This commit is contained in:
Unknown
2017-11-14 18:10:33 -05:00
parent 08073acf11
commit 6259b68b4f
3 changed files with 39 additions and 65 deletions

View File

@@ -0,0 +1,31 @@
.badge-svg {
left: calc((100% - 18px) / 2);
cursor: pointer;
color: $gray-400;
background: $white;
padding: 4.5px 6px;
&.item-selected-badge {
background: $purple-300;
color: $white;
}
}
span.badge.badge-pill.badge-item.badge-svg:not(.item-selected-badge) {
color: #a5a1ac;
}
span.badge.badge-pill.badge-item.badge-svg.hide {
display: none;
}
.item:hover {
span.badge.badge-pill.badge-item.badge-svg.hide {
display: block;
}
}
.icon-12 {
width: 12px;
height: 12px;
}

View File

@@ -234,6 +234,7 @@
<style lang="scss"> <style lang="scss">
@import '~client/assets/scss/colors.scss'; @import '~client/assets/scss/colors.scss';
@import '~client/assets/scss/variables.scss'; @import '~client/assets/scss/variables.scss';
@import '~client/assets/scss/pin.scss';
.market .drawer-slider { .market .drawer-slider {
min-height: 60px; min-height: 60px;
@@ -247,37 +248,7 @@
height: 38px; // button + margin + padding height: 38px; // button + margin + padding
} }
.badge-svg {
left: calc((100% - 18px) / 2);
cursor: pointer;
color: $gray-400;
background: $white;
padding: 4.5px 6px;
&.item-selected-badge {
background: $purple-300;
color: $white;
}
}
span.badge.badge-pill.badge-item.badge-svg:not(.item-selected-badge) {
color: #a5a1ac;
}
span.badge.badge-pill.badge-item.badge-svg.hide {
display: none;
}
.item:hover {
span.badge.badge-pill.badge-item.badge-svg.hide {
display: block;
}
}
.icon-12 {
width: 12px;
height: 12px;
}
.icon-48 { .icon-48 {
width: 48px; width: 48px;
height: 48px; height: 48px;

View File

@@ -69,38 +69,8 @@
<style lang="scss" scoped> <style lang="scss" scoped>
@import '~client/assets/scss/colors.scss'; @import '~client/assets/scss/colors.scss';
@import '~client/assets/scss/pin.scss';
.badge-svg {
left: calc((100% - 18px) / 2);
cursor: pointer;
color: $gray-400;
background: $white;
padding: 4.5px 6px;
&.item-selected-badge {
background: $purple-300;
color: $white;
}
}
span.badge.badge-pill.badge-item.badge-svg:not(.item-selected-badge) {
color: #a5a1ac;
}
span.badge.badge-pill.badge-item.badge-svg.hide {
display: none;
}
.item:hover {
span.badge.badge-pill.badge-item.badge-svg.hide {
display: block;
}
}
.icon-12 {
width: 12px;
height: 12px;
}
.tasks-column { .tasks-column {
min-height: 556px; min-height: 556px;
@@ -110,6 +80,7 @@
margin-top: 16px; margin-top: 16px;
} }
.reward-items { .reward-items {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@@ -271,6 +242,7 @@ import { mapState, mapActions } from 'client/libs/store';
import shopItem from '../shops/shopItem'; import shopItem from '../shops/shopItem';
import BuyQuestModal from 'client/components/shops/quests/buyQuestModal.vue'; import BuyQuestModal from 'client/components/shops/quests/buyQuestModal.vue';
import notifications from 'client/mixins/notifications';
import { shouldDo } from 'common/script/cron'; import { shouldDo } from 'common/script/cron';
import inAppRewards from 'common/script/libs/inAppRewards'; import inAppRewards from 'common/script/libs/inAppRewards';
import spells from 'common/script/content/spells'; import spells from 'common/script/content/spells';
@@ -283,7 +255,7 @@ import todoIcon from 'assets/svg/todo.svg';
import rewardIcon from 'assets/svg/reward.svg'; import rewardIcon from 'assets/svg/reward.svg';
export default { export default {
mixins: [buyMixin], mixins: [buyMixin, notifications],
components: { components: {
Task, Task,
BuyQuestModal, BuyQuestModal,
@@ -630,10 +602,10 @@ export default {
togglePinned (item) { togglePinned (item) {
try { try {
if (!this.$store.dispatch('user:togglePinnedItem', {type: item.pinType, path: item.path})) { if (!this.$store.dispatch('user:togglePinnedItem', {type: item.pinType, path: item.path})) {
this.$parent.$parent.text(this.$t('unpinnedItem', {item: item.text})); this.text(this.$t('unpinnedItem', {item: item.text}));
} }
} catch (e) { } catch (e) {
this.$parent.$parent.text(e.message); this.error(e.message);
} }
}, },
}, },