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

Added mobile style fixes (#9741)

Browse Source
This commit is contained in:
Keith Holliday
2017-12-26 17:31:00 -06:00
committed by GitHub
parent a3bf329c44
commit d90d781740
14 changed files with 134 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
website/client/components/userMenu/profile.vue
View File

@@ -17,22 +17,22 @@ div
.col-12
member-details(:member="user")
.row
.col-6.offset-3.text-center.nav
.col-12.col-md-6.offset-md-3.text-center.nav
.nav-item(@click='selectPage("profile")', :class="{active: selectedPage === 'profile'}") {{ $t('profile') }}
.nav-item(@click='selectPage("stats")', :class="{active: selectedPage === 'stats'}") {{ $t('stats') }}
.nav-item(@click='selectPage("achievements")', :class="{active: selectedPage === 'achievements'}") {{ $t('achievements') }}
#userProfile.standard-page(v-show='selectedPage === "profile"', v-if='user.profile')
.row
.col-8
.col-12.col-md-8
.header
h1 {{user.profile.name}}
h4
strong {{ $t('userId') }}:
| {{user._id}}
.col-4
.col-12.col-md-4
button.btn.btn-secondary(v-if='user._id === userLoggedIn._id', @click='editing = !editing') {{ $t('edit') }}
.row(v-if='!editing')
.col-8
.col-12.col-md-8
.about
h2 {{ $t('about') }}
p(v-if='user.profile.blurb', v-markdown='user.profile.blurb')
@@ -42,7 +42,7 @@ div
img.img-rendering-auto(v-if='user.profile.imageUrl', :src='user.profile.imageUrl')
p(v-else) {{ $t('noPhoto') }}
.col-4
.col-12.col-md-4
.info
h2 {{ $t('info') }}
div
@@ -93,7 +93,7 @@ div
#achievements.standard-page.container(v-show='selectedPage === "achievements"', v-if='user.achievements')
.row(v-for='(category, key) in achievements')
h2.col-12.text-center {{ $t(key+'Achievs') }}
.col-3.text-center(v-for='(achievement, key) in category.achievements')
.col-12.col-md-3.text-center(v-for='(achievement, key) in category.achievements')
.box.achievement-container(:id='key + "-achievement"', :class='{"achievement-unearned": !achievement.earned}')
b-popover(
:target="'#' + key + '-achievement'",
@@ -107,103 +107,103 @@ div
.achievement.achievement-unearned(class='achievement-unearned2x', v-if='!achievement.earned')
hr.col-12
.row
.col-6(v-if='user.achievements.challenges')
.col-12.col-md-6(v-if='user.achievements.challenges')
.achievement-icon.achievement-karaoke
h2.text-center {{$t('challengesWon')}}
div(v-for='chal in user.achievements.challenges')
span(v-markdown='chal')
hr
.col-6(v-if='user.achievements.quests')
.col-12.col-md-6(v-if='user.achievements.quests')
.achievement-icon.achievement-alien
h2.text-center {{$t('questsCompleted')}}
div(v-for='(value, key) in user.achievements.quests')
span {{ content.quests[key].text() }} ({{ value }})
#stats.standard-page(v-show='selectedPage === "stats"', v-if='user.preferences')
.row
.col-6
.col-12.col-md-6
h2.text-center {{$t('equipment')}}
.well
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.eyewear && equippedItems.eyewear.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.eyewear}`")
h3 {{$t('eyewear')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.head && equippedItems.head.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.head}`")
h3 {{$t('headgearCapitalized')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.headAccessory && equippedItems.headAccessory.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.headAccessory}`")
h3 {{$t('headAccess')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.back && equippedItems.back.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.back}`")
h3 {{$t('backAccess')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.armor && equippedItems.armor.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.armor}`")
h3 {{$t('armorCapitalized')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.body && equippedItems.body.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.body}`")
h3 {{$t('bodyAccess')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.weapon && equippedItems.weapon.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.weapon}`")
h3 {{$t('mainHand')}}
.col-4.item-wrapper
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: equippedItems.shield && equippedItems.shield.indexOf("base_0") === -1}')
div(:class="`shop_${equippedItems.shield}`")
h3 {{$t('offHand')}}
.col-6
.col-12.col-md-6
h2.text-center {{$t('costume')}}
.well
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.eyewear && costumeItems.eyewear.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.eyewear}`")
h3 {{$t('eyewear')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.head && costumeItems.head.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.head}`")
h3 {{$t('headgearCapitalized')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.headAccessory && costumeItems.headAccessory.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.headAccessory}`")
h3 {{$t('headAccess')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.back && costumeItems.back.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.back}`")
h3 {{$t('backAccess')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.armor && costumeItems.armor.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.armor}`")
h3 {{$t('armorCapitalized')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.body && costumeItems.body.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.body}`")
h3 {{$t('bodyAccess')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.weapon && costumeItems.weapon.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.weapon}`")
h3 {{$t('mainHand')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: user.preferences.background}', style="overflow:hidden")
div(:class="'icon_background_' + user.preferences.background")
h3 {{$t('background')}}
.col-4.item-wrapper
.col-12.col-md-4.item-wrapper
.box(:class='{white: costumeItems.shield && costumeItems.shield.indexOf("base_0") === -1}')
div(:class="`shop_${costumeItems.shield}`")
h3 {{$t('offHand')}}
.row.pet-mount-row
.col-6
.col-12.col-md-6
h2.text-center(v-once) {{ $t('pets') }}
.well.pet-mount-well
.row.col-12
.col-4
.col-12.col-md-4
.box(:class='{white: user.items.currentPet}')
.pet(:class="`Pet-${user.items.currentPet}`")
.col-8
.col-12.col-md-8
div
| {{ formatAnimal(user.items.currentPet, 'pet') }}
div
@@ -212,14 +212,14 @@ div
div
strong {{ $t('beastMasterProgress') }}:
| {{ beastMasterProgress(user.items.pets) }}
.col-6
.col-12.col-md-6
h2.text-center(v-once) {{ $t('mounts') }}
.well.pet-mount-well
.row.col-12
.col-4
.col-12.col-md-4
.box(:class='{white: user.items.currentMount}')
.mount(:class="`Mount_Icon_${user.items.currentMount}`")
.col-8
.col-12.col-md-8
div
| {{ formatAnimal(user.items.currentMount, 'mount') }}
div
@@ -231,14 +231,14 @@ div
#attributes.row
hr.col-12
h2.col-12 {{$t('attributes')}}
.col-6(v-for="(statInfo, stat) in stats")
.col-12.col-md-6(v-for="(statInfo, stat) in stats")
.row.col-12.stats-column
.col-4.attribute-label
.col-12.col-md-4.attribute-label
span.hint(:popover-title='$t(statInfo.title)', popover-placement='right',
:popover='$t(statInfo.popover)', popover-trigger='mouseenter')
.stat-title(:class='stat') {{ $t(statInfo.title) }}
strong.number {{ statsComputed[stat] }}
.col-6
.col-12.col-md-6
ul.bonus-stats
li
strong {{$t('level')}}:
@@ -257,26 +257,26 @@ div
| {{user.stats.buffs[stat]}}
#allocation(v-if='user._id === userLoggedIn._id')
.row.title-row
.col-6
.col-12.col-md-6
h3(v-if='userLevel100Plus', v-once, v-html="$t('noMoreAllocate')")
h3(v-if='user.stats.points || userLevel100Plus')
| {{$t('pointsAvailable')}}
.counter.badge(v-if='user.stats.points || userLevel100Plus')
| {{user.stats.points}} 
.col-6
.col-12.col-md-6
.float-right
toggle-switch(:label="$t('autoAllocation')",
v-model='user.preferences.automaticAllocation',
@change='userset({"preferences.automaticAllocation": Boolean(user.preferences.automaticAllocation), "preferences.allocationMode": "taskbased"})')
.row
.col-3(v-for='(statInfo, stat) in allocateStatsList')
.col-12.col-md-3(v-for='(statInfo, stat) in allocateStatsList')
.box.white.row.col-12
.col-12
div(:class='stat') {{ $t(stats[stat].title) }}
.number {{ user.stats[stat] }}
.points {{$t('pts')}}
.col-4
.col-12.col-md-4
.up(v-if='user.stats.points', @click='allocate(stat)')
send-gems-modal(:userReceivingGems='userReceivingGems')
</template>