Skip to content

Commit

Permalink
merge negue-ui-fixes into develop
Browse files Browse the repository at this point in the history
Squashed commit of the following:

commit d0628da
Author: negue <eugen.bolz@gmail.com>
Date:   Fri Mar 15 19:34:39 2019 +0100

    fix quest-tooltip padding/sizes

commit c16bc0f
Merge: 24e3fe2 163f316
Author: negue <eugen.bolz@gmail.com>
Date:   Fri Mar 15 18:58:51 2019 +0100

    Merge branch 'fix/quest-tooltip-cells' into negue-ui-fixes

commit 24e3fe2
Author: negue <eugen.bolz@gmail.com>
Date:   Fri Mar 15 18:49:47 2019 +0100

    use item margin instead of container padding

commit 03ab975
Author: negue <eugen.bolz@gmail.com>
Date:   Thu Mar 14 21:41:43 2019 +0100

    fix input heights

commit 3aa18f1
Author: negue <eugen.bolz@gmail.com>
Date:   Thu Mar 14 20:58:22 2019 +0100

    revert margin-bottom on checklist

commit d8f533f
Merge: fbd01ab 7d45dcf
Author: Sabe Jones <sabrecat@gmail.com>
Date:   Thu Mar 14 11:10:34 2019 -0500

    Merge branch 'fix/shops-ui' into negue-ui-fixes

commit fbd01ab
Merge: 65517d2 546e260
Author: Sabe Jones <sabrecat@gmail.com>
Date:   Thu Mar 14 11:09:03 2019 -0500

    Merge branch 'fix/more-ui' into negue-ui-fixes

commit 65517d2
Merge: 5e93523 2dcec78
Author: Sabe Jones <sabrecat@gmail.com>
Date:   Thu Mar 14 11:08:20 2019 -0500

    Merge branch 'fix/tasks-ui' into negue-ui-fixes

commit 546e260
Author: negue <eugen.bolz@gmail.com>
Date:   Sat Mar 9 23:13:54 2019 +0100

    fix checkbox check mark

commit 46ea201
Author: negue <eugen.bolz@gmail.com>
Date:   Sat Mar 9 22:48:20 2019 +0100

    remove bottom margin on a collapsed checklist

commit 7d45dcf
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Mar 6 22:45:09 2019 +0100

    fix star/empty colors - fix quest layout - countBadge z-index

commit f9b9e75
Author: negue <eugen.bolz@gmail.com>
Date:   Mon Mar 4 20:14:49 2019 +0100

    shops - timeTravelers: refactor filter logic

commit 6d3e9e0
Author: negue <eugen.bolz@gmail.com>
Date:   Mon Mar 4 20:06:02 2019 +0100

    shops-seasonal: refactor filter logic

commit aa2949e
Author: negue <eugen.bolz@gmail.com>
Date:   Mon Mar 4 19:54:23 2019 +0100

    shops - quest: refactor filter logic + quest items margins

commit ad62b7a
Author: negue <eugen.bolz@gmail.com>
Date:   Mon Mar 4 19:50:51 2019 +0100

    shop: equipment-cards background + market filter logic (as other pages)

commit 2dcec78
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Feb 27 21:02:10 2019 +0100

    remove space between notes and checklist

commit 31fab9b
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Feb 27 20:45:59 2019 +0100

    remove margin of checklist items

commit 28b134a
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Feb 27 20:33:43 2019 +0100

    show `Options` instead of  `Show More`

commit cafcfb6
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Feb 27 20:30:22 2019 +0100

    remove pointer on disabled task-controls

commit 7acbcc4
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Feb 27 20:25:36 2019 +0100

    remove margin of task-title markdown-p-tag

commit f667ab9
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Feb 27 20:25:16 2019 +0100

    40px height search + tags button

commit 2080ecb
Author: negue <eugen.bolz@gmail.com>
Date:   Wed Feb 27 20:24:35 2019 +0100

    show grabbing cursor while dragging

commit 163f316
Author: negue <eugen.bolz@gmail.com>
Date:   Fri Feb 15 23:26:40 2019 +0100

    replace the questInfo to use table-like behavior, expands to the content
  • Loading branch information
SabreCat committed Mar 18, 2019
1 parent dae37c1 commit 9a6aa5f
Show file tree
Hide file tree
Showing 8 changed files with 89 additions and 43 deletions.
2 changes: 1 addition & 1 deletion website/client/assets/scss/form.scss
Expand Up @@ -159,7 +159,7 @@ $bg-disabled-control: #34303a;
width: 18px; width: 18px;
height: 18px; height: 18px;
background-image: url(~client/assets/svg/for-css/checkbox-white.svg); background-image: url(~client/assets/svg/for-css/checkbox-white.svg);
background-size: 75% 75%; background-size: 13px 10px;
} }


&:active~.custom-control-label::before { &:active~.custom-control-label::before {
Expand Down
12 changes: 3 additions & 9 deletions website/client/components/shops/quests/index.vue
Expand Up @@ -52,11 +52,6 @@
:popoverPosition="'top'", :popoverPosition="'top'",
@click="selectItem(item)" @click="selectItem(item)"
) )
template(slot="popoverContent", slot-scope="ctx")
div.questPopover
h4.popover-content-title {{ item.text }}
questInfo(:quest="item")

template(slot="itemBadge", slot-scope="ctx") template(slot="itemBadge", slot-scope="ctx")
span.badge.badge-pill.badge-item.badge-svg( span.badge.badge-pill.badge-item.badge-svg(
:class="{'item-selected-badge': ctx.item.pinned, 'hide': !ctx.item.pinned}", :class="{'item-selected-badge': ctx.item.pinned, 'hide': !ctx.item.pinned}",
Expand Down Expand Up @@ -250,17 +245,16 @@
border-radius: 2px; border-radius: 2px;
background-color: #edecee; background-color: #edecee;
display: inline-block; display: inline-block;
padding: 8px; padding: 0;
margin-right: 12px; margin-right: 12px;
} }
.item-wrapper { .item-wrapper {
margin-bottom: 0; margin-bottom: 0;
} }
.items > div:not(:last-of-type) { .items > div {
margin-right: 16px; margin: 8px;
margin-bottom: 16px;
} }
} }
Expand Down
61 changes: 40 additions & 21 deletions website/client/components/shops/quests/questInfo.vue
@@ -1,39 +1,58 @@
<template lang="pug"> <template lang="pug">
.row(:class="{'small-version': smallVersion}") .row(:class="{'small-version': smallVersion}")
dl .table-row(v-if="quest.collect")
template(v-if="quest.collect") dt {{ $t('collect') + ':' }}
dt(:class="smallVersion ? 'col-3' : 'col-4'") {{ $t('collect') + ':' }} dd
dd.col-8
div(v-for="(collect, key) of quest.collect") div(v-for="(collect, key) of quest.collect")
span {{ collect.count }} {{ getCollectText(collect) }} span {{ collect.count }} {{ getCollectText(collect) }}


template(v-if="quest.boss") .table-row(v-if="quest.boss")
dt(:class="smallVersion ? 'col-3' : 'col-4'") {{ $t('bossHP') + ':' }} dt {{ $t('bossHP') + ':' }}
dd.col-8 {{ quest.boss.hp }} dd {{ quest.boss.hp }}


dt(:class="smallVersion ? 'col-3' : 'col-4'") {{ $t('difficulty') + ':' }} .table-row
dd.col-8 dt {{ $t('difficulty') + ':' }}
.svg-icon.inline( dd
v-for="star of stars()", v-html="icons[star]", .svg-icon.inline(
:class="smallVersion ? 'icon-12' : 'icon-16'", v-for="star of stars()", v-html="icons[star]",
) :class="smallVersion ? 'icon-12' : 'icon-16'",
)
</template> </template>


<style lang="scss" scoped> <style lang="scss" scoped>
@import '~client/assets/scss/colors.scss'; @import '~client/assets/scss/colors.scss';
dt { .row {
font-size: 1.3em; display: table;
line-height: 1.2; color: #E1E0E3;
color: $gray-50; margin: 0;
} }
.col-8 { .table-row {
display: table-row;
margin-bottom: 4px;
}
dd {
height: 24px;
padding-left: 1em;
padding-top: 3px;
padding-bottom: 3px;
}
dt, dd {
display: table-cell;
vertical-align: middle;
}
dt, dd, dd > * {
text-align: left; text-align: left;
} }
.col-8:not(:last-child) { dt {
margin-bottom: 4px; font-size: 1.3em;
line-height: 1.2;
color: $gray-50;
} }
.svg-icon { .svg-icon {
Expand Down
21 changes: 17 additions & 4 deletions website/client/components/tasks/column.vue
Expand Up @@ -37,8 +37,9 @@
draggable.sortable-tasks( draggable.sortable-tasks(
ref="tasksList", ref="tasksList",
@update='taskSorted', @update='taskSorted',
@start="isDragging(true)",
@end="isDragging(false)",
:options='{disabled: activeFilter.label === "scheduled", scrollSensitivity: 64}', :options='{disabled: activeFilter.label === "scheduled", scrollSensitivity: 64}',
class="sortable-tasks"
) )
task( task(
v-for="task in taskList", v-for="task in taskList",
Expand All @@ -49,12 +50,11 @@
:group='group', :group='group',
) )
template(v-if="hasRewardsList") template(v-if="hasRewardsList")
draggable( draggable.reward-items(
ref="rewardsList", ref="rewardsList",
@update="rewardSorted", @update="rewardSorted",
@start="rewardDragStart", @start="rewardDragStart",
@end="rewardDragEnd", @end="rewardDragEnd",
class="reward-items",
) )
shopItem( shopItem(
v-for="reward in inAppRewards", v-for="reward in inAppRewards",
Expand All @@ -76,6 +76,9 @@
<style lang="scss" scoped> <style lang="scss" scoped>
@import '~client/assets/scss/colors.scss'; @import '~client/assets/scss/colors.scss';
/deep/ .draggable-cursor {
cursor: grabbing;
}
.tasks-column { .tasks-column {
min-height: 556px; min-height: 556px;
Expand All @@ -89,7 +92,6 @@
margin-top: 16px; margin-top: 16px;
} }
.reward-items { .reward-items {
@supports (display: grid) { @supports (display: grid) {
display: grid; display: grid;
Expand Down Expand Up @@ -335,6 +337,7 @@ export default {
showPopovers: true, showPopovers: true,
selectedItemToBuy: {}, selectedItemToBuy: {},
dragging: false,
}; };
}, },
created () { created () {
Expand Down Expand Up @@ -521,9 +524,11 @@ export default {
rewardDragStart () { rewardDragStart () {
// We need to stop popovers from interfering with our dragging // We need to stop popovers from interfering with our dragging
this.showPopovers = false; this.showPopovers = false;
this.isDragging(true);
}, },
rewardDragEnd () { rewardDragEnd () {
this.showPopovers = true; this.showPopovers = true;
this.isDragging(false);
}, },
quickAdd (ev) { quickAdd (ev) {
// Add a new line if Shift+Enter Pressed // Add a new line if Shift+Enter Pressed
Expand Down Expand Up @@ -678,6 +683,14 @@ export default {
this.error(e.message); this.error(e.message);
} }
}, },
isDragging (dragging) {
this.dragging = dragging;
if (dragging) {
document.documentElement.classList.add('draggable-cursor');
} else {
document.documentElement.classList.remove('draggable-cursor');
}
},
}, },
}; };
</script> </script>
25 changes: 18 additions & 7 deletions website/client/components/tasks/task.vue
Expand Up @@ -20,7 +20,7 @@
v-if="isUser && !isRunningYesterdailies", v-if="isUser && !isRunningYesterdailies",
:right="task.type === 'reward'", :right="task.type === 'reward'",
ref="taskDropdown", ref="taskDropdown",
v-b-tooltip.hover.top="$t('showMore')" v-b-tooltip.hover.top="$t('options')"
) )
div(slot="dropdown-toggle", draggable=false) div(slot="dropdown-toggle", draggable=false)
.svg-icon.dropdown-icon(v-html="icons.menu") .svg-icon.dropdown-icon(v-html="icons.menu")
Expand All @@ -46,7 +46,7 @@
v-markdown="task.notes", v-markdown="task.notes",
:class="{'has-checklist': task.notes && hasChecklist}", :class="{'has-checklist': task.notes && hasChecklist}",
) )
.checklist(v-if="canViewchecklist") .checklist(v-if="canViewchecklist", :class="{isOpen: !task.collapseChecklist}")
.d-inline-flex .d-inline-flex
.collapse-checklist.d-flex.align-items-center.expand-toggle( .collapse-checklist.d-flex.align-items-center.expand-toggle(
v-if="isUser", v-if="isUser",
Expand Down Expand Up @@ -141,6 +141,11 @@
min-width: 0px; min-width: 0px;
overflow-wrap: break-word; overflow-wrap: break-word;
// markdown p-tag, can't find without /deep/
/deep/ p {
margin-bottom: 0;
}
&.has-notes { &.has-notes {
padding-bottom: 4px; padding-bottom: 4px;
} }
Expand Down Expand Up @@ -229,7 +234,7 @@
overflow-wrap: break-word; overflow-wrap: break-word;
&.has-checklist { &.has-checklist {
padding-bottom: 8px; padding-bottom: 2px;
} }
} }
Expand All @@ -254,19 +259,25 @@
} }
.checklist { .checklist {
margin-bottom: 2px; &.isOpen {
margin-bottom: 2px;
}
margin-top: -3px; margin-top: -3px;
} }
.collapse-checklist { .collapse-checklist {
padding: 2px 6px; padding: 2px 6px;
margin-bottom: 9px;
border-radius: 1px; border-radius: 1px;
background-color: $gray-600; background-color: $gray-600;
font-size: 10px; font-size: 10px;
line-height: 1.2; line-height: 1.2;
text-align: center; text-align: center;
color: $gray-200; color: $gray-200;
margin-bottom: 9px;
&.open {
}
span { span {
margin: 0px 4px; margin: 0px 4px;
Expand All @@ -285,7 +296,7 @@
margin-bottom: -3px; margin-bottom: -3px;
min-height: 0px; min-height: 0px;
width: 100%; width: 100%;
margin-left: 8px; margin-left: 0;
padding-right: 20px; padding-right: 20px;
overflow-wrap: break-word; overflow-wrap: break-word;
Expand Down Expand Up @@ -427,7 +438,7 @@
border-left: none; border-left: none;
} }
.task-control, .reward-control { .task-control:not(.task-disabled-habit-control-inner), .reward-control {
cursor: pointer; cursor: pointer;
} }
Expand Down
4 changes: 4 additions & 0 deletions website/client/components/tasks/taskModal.vue
Expand Up @@ -259,6 +259,10 @@
font-weight: bold; font-weight: bold;
} }
.input-group > * {
height: 40px;
}
input, textarea { input, textarea {
border: none; border: none;
background: rgba(0, 0, 0, 0.24); background: rgba(0, 0, 0, 0.24);
Expand Down
6 changes: 5 additions & 1 deletion website/client/components/tasks/user.vue
Expand Up @@ -12,7 +12,7 @@
.col-12.col-md-4.offset-md-4 .col-12.col-md-4.offset-md-4
.d-flex .d-flex
input.form-control.input-search(type="text", :placeholder="$t('search')", v-model="searchText") input.form-control.input-search(type="text", :placeholder="$t('search')", v-model="searchText")
button.btn.btn-secondary.dropdown-toggle.ml-2.d-flex.align-items-center( button.btn.btn-secondary.dropdown-toggle.ml-2.d-flex.align-items-center.search-button(
type="button", type="button",
@click="toggleFilterPanel()", @click="toggleFilterPanel()",
:class="{active: selectedTags.length > 0}", :class="{active: selectedTags.length > 0}",
Expand Down Expand Up @@ -110,6 +110,10 @@
padding-top: 16px; padding-top: 16px;
} }
.input-search, .search-button {
height: 40px;
}
.tasks-navigation { .tasks-navigation {
margin-bottom: 20px; margin-bottom: 20px;
} }
Expand Down
1 change: 1 addition & 0 deletions website/common/locales/en/generic.json
Expand Up @@ -34,6 +34,7 @@
"saveEdits": "Save Edits", "saveEdits": "Save Edits",
"showMore": "Show More", "showMore": "Show More",
"showLess": "Show Less", "showLess": "Show Less",
"options": "Options",


"expandToolbar": "Expand Toolbar", "expandToolbar": "Expand Toolbar",
"collapseToolbar": "Collapse Toolbar", "collapseToolbar": "Collapse Toolbar",
Expand Down

0 comments on commit 9a6aa5f

Please sign in to comment.