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

Profile Page: redesign gear label (#12395)

Browse Source 
* redesign gear label + lintOnSave not in development environment

* fix lint / build

* fix(lint): remove extra parens

* fix break-word + remove lintOnSave

* remove unneeded styles

Co-authored-by: Sabe Jones <sabrecat@gmail.com>
This commit is contained in:
negue
2020-07-17 12:43:27 +02:00
committed by GitHub
parent 8bbb0ddaee
commit 0261d12bd9
1 changed files with 51 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
website/client/src/components/userMenu/profileStats.vue
View File

@@ -17,7 +17,7 @@
<div
v-if="label !== 'skip'"
:id="key"
class="box"
class="gear box"
:class="{white: equippedItems[key] && equippedItems[key].indexOf('base_0') === -1}"
>
<div :class="`shop_${equippedItems[key]}`"></div>
@@ -39,9 +39,12 @@
:user="user"
/>
</b-popover>
<h3 v-if="label !== 'skip'">
<span
v-if="label !== 'skip'"
class="gear-label"
>
{{ label }}
</h3>
</span>
</div>
</div>
</div>
@@ -60,7 +63,7 @@
<div
v-if="label !== 'skip'"
:id="key + 'C'"
class="box"
class="gear box"
:class="{white: costumeItems[key] && costumeItems[key].indexOf('base_0') === -1}"
>
<div :class="`shop_${costumeItems[key]}`"></div>
@@ -68,7 +71,7 @@
<!-- Show background on 8th tile rather than a piece of equipment.-->
<div
v-if="label === 'skip'"
class="box"
class="gear box"
:class="{white: user.preferences.background}"
style="overflow:hidden"
>
@@ -91,12 +94,18 @@
:user="user"
/>
</b-popover>
<h3 v-if="label !== 'skip'">
<span
v-if="label !== 'skip'"
class="gear-label"
>
{{ label }}
</h3>
<h3 v-else>
</span>
<span
v-else
class="gear-label"
>
{{ $t('background') }}
</h3>
</span>
</div>
</div>
</div>
@@ -667,9 +676,9 @@ export default {
}
.item-wrapper {
h3 {
text-align: center;
}
text-align: center;
vertical-align: top;
margin-bottom: 0.5rem;
}
.pet-mount-row {
@@ -684,4 +693,34 @@ export default {
.save-row {
margin-top: 1em;
}
.gear.box {
vertical-align: top;
margin: 0 auto;
}
.gear-label {
margin: 0 auto;
margin-top: 0.5rem;
min-height: 1rem;
font-family: Roboto;
font-size: 12px;
font-weight: bold;
line-height: 1.33;
text-align: center;
color: $gray-200;
text-overflow: ellipsis;
// the following 4 lines are needed for the 2 line clamp
// the non-prefixes not supported "anywhere" but these "-webkit"-ones are
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
// breaks the long words without a space
word-break: break-word;
}
</style>