krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-18 07:07:35 +01:00
Code Issues Packages Projects Releases Wiki Activity

Updated avatar menu icons and style (#9409)

Browse Source
This commit is contained in:
Keith Holliday
2017-11-07 11:57:42 -07:00
committed by GitHub
parent f25fe9e263
commit f964e3c0a5
6 changed files with 16 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
website/client/components/creatorIntro.vue
View File

@@ -16,23 +16,23 @@ b-modal#avatar-modal(title="", :size='editing ? "lg" : "md"', :hide-header='true
button.btn.btn-secondary(v-once) {{$t('randomize')}}
#options-nav.container.section.text-center.customize-menu
.row
div(:class='{"col-3": !editing, "col-2 offset-1": editing}')
.menu-container(:class='{"col-3": !editing, "col-2 offset-1": editing, active: activeTopPage === "body"}')
.menu-item(@click='changeTopPage("body", "size")')
.svg-icon(v-html='icons.bodyIcon')
strong(v-once) {{$t('bodyBody')}}
div(:class='{"col-3": !editing, "col-2": editing}')
.menu-container(:class='{"col-3": !editing, "col-2": editing, active: activeTopPage === "skin"}')
.menu-item(@click='changeTopPage("skin", "color")')
.svg-icon(v-html='icons.skinIcon')
strong(v-once) {{$t('skin')}}
div(:class='{"col-3": !editing, "col-2": editing}')
.menu-container(:class='{"col-3": !editing, "col-2": editing, active: activeTopPage === "hair"}')
.menu-item(@click='changeTopPage("hair", "color")')
.svg-icon(v-html='icons.hairIcon')
strong(v-once) {{$t('hair')}}
div(:class='{"col-3": !editing, "col-2": editing}')
.menu-container(:class='{"col-3": !editing, "col-2": editing, active: activeTopPage === "extra"}')
.menu-item(@click='changeTopPage("extra", "glasses")')
.svg-icon(v-html='icons.accessoriesIcon')
strong(v-once) {{$t('extra')}}
.col-2(v-if='editing')
.menu-container.col-2(v-if='editing', :class='{active: activeTopPage === "backgrounds"}')
.menu-item(@click='changeTopPage("backgrounds", "2017")')
.svg-icon(v-html='icons.backgroundsIcon')
strong(v-once) {{$t('backgrounds')}}
@@ -505,14 +505,15 @@ b-modal#avatar-modal(title="", :size='editing ? "lg" : "md"', :hide-header='true
width: 32px;
height: 32px;
margin: 0 auto;
color: #6133B4;
}
.menu-item:hover {
.menu-container {
color: #a5a1ac;
}
.menu-container:hover, .menu-container.active {
cursor: pointer;
svg path, strong {
stroke: purple !important;
}
color: #6133B4;
}
}