mirror of
https://github.com/HabitRPG/habitica.git
synced 2025-12-17 14:47:53 +01:00
Does not reuse same css classes, imports them from pin.scss. For the togglePin function the notification.
This commit is contained in:
31
website/client/assets/scss/pin.scss
Normal file
31
website/client/assets/scss/pin.scss
Normal 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;
|
||||||
|
}
|
||||||
@@ -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;
|
||||||
|
|||||||
@@ -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);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user