KumiSystems/Chatwoot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix: Add a fix for minor UI / a11y issues (#4905)

Browse source
This commit is contained in:
Fayaz Ahmed 2022-06-24 23:12:53 +05:30 committed by GitHub
parent dcbca173ac
commit 263b8240d3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 35 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/javascript/dashboard/assets/scss/_typography.scss
View file

@ -4,6 +4,7 @@
.page-sub-title {
font-size: $font-size-large;
word-wrap: break-word;
}
.block-title {

7
app/javascript/dashboard/components/ModalHeader.vue
View file

@ -4,7 +4,7 @@
<h2 class="page-sub-title">
{{ headerTitle }}
</h2>
<p v-if="headerContent" class="small-12 column">
<p v-if="headerContent" class="small-12 column wrap-content">
{{ headerContent }}
</p>
<slot />
@ -29,3 +29,8 @@ export default {
},
};
</script>
<style scoped lang="scss">
.wrap-content {
word-wrap: break-word;
}
</style>

1
app/javascript/dashboard/components/layout/Sidebar.vue
View file

@ -191,6 +191,7 @@ export default {
display: flex;
min-height: 0;
height: 100%;
width: fit-content;
}
</style>

2
app/javascript/dashboard/components/layout/sidebarComponents/AccountContext.vue
View file

@ -83,7 +83,7 @@ export default {
border-bottom-right-radius: var(--border-radius-normal);
display: flex;
height: 100%;
justify-content: end;
justify-content: flex-end;
opacity: 1;
position: absolute;
right: 0;

1
app/javascript/dashboard/components/layout/sidebarComponents/SecondaryChildNavItem.vue
View file

@ -146,6 +146,7 @@ $label-badge-size: var(--space-slab);
height: $label-badge-size;
min-width: $label-badge-size;
margin-left: var(--space-smaller);
border: 1px solid var(--color-border-light);
}
.badge.secondary {

3
app/javascript/dashboard/components/widgets/conversation/Message.vue
View file

@ -66,7 +66,7 @@
<spinner v-if="isPending" size="tiny" />
<div
v-if="showAvatar"
v-tooltip.top="tooltipForSender"
v-tooltip.left="tooltipForSender"
class="sender--info"
>
<woot-thumbnail
@ -313,7 +313,6 @@ export default {
return showTooltip
? {
content: `${this.$t('CONVERSATION.SENT_BY')} ${name}`,
classes: 'top',
}
: false;
},

1
app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/LabelActions.vue
View file

@ -258,6 +258,7 @@ ul {
height: var(--space-slab);
width: var(--space-slab);
flex-shrink: 0;
border: 1px solid var(--color-border-light);
}
}
}

4
app/javascript/dashboard/components/widgets/modal/DeleteModal.vue
View file

@ -2,10 +2,10 @@
<modal :show.sync="show" :on-close="onClose">
<woot-modal-header :header-title="title" :header-content="message" />
<div class="modal-footer delete-item">
<button class="alert button nice" @click="onConfirm">
<button class="alert button nice text-truncate" @click="onConfirm">
{{ confirmText }}
</button>
<button class="button clear" @click="onClose">
<button class="button clear text-truncate" @click="onClose">
{{ rejectText }}
</button>
</div>

1
app/javascript/dashboard/i18n/locale/en/report.json
View file

@ -65,6 +65,7 @@
"PLACEHOLDER": "Select date range"
},
"GROUP_BY_FILTER_DROPDOWN_LABEL": "Group By",
"DURATION_FILTER_LABEL": "Duration",
"GROUP_BY_DAY_OPTIONS": [{ "id": 1, "groupBy": "Day" }],
"GROUP_BY_WEEK_OPTIONS": [
{ "id": 1, "groupBy": "Day" },

1
app/javascript/dashboard/routes/dashboard/conversation/ContactPanel.vue
View file

@ -9,6 +9,7 @@
<draggable
:list="conversationSidebarItems"
:disabled="!dragEnabled"
animation="200"
class="list-group"
ghost-class="ghost"
handle=".drag-handle"

13
app/javascript/dashboard/routes/dashboard/settings/labels/Index.vue
View file

@ -9,7 +9,7 @@
{{ $t('LABEL_MGMT.HEADER_BTN_TXT') }}
</woot-button>
<div class="row">
<div class="small-8 columns with-right-space ">
<div class="small-8 columns with-right-space">
<p
v-if="!uiFlags.isFetching && !records.length"
class="no-items-error-message"
@ -31,7 +31,9 @@
</thead>
<tbody>
<tr v-for="(label, index) in records" :key="label.title">
<td>{{ label.title }}</td>
<td class="label-title">
<span class="text-truncate">{{ label.title }}</span>
</td>
<td>{{ label.description }}</td>
<td>
<div class="label-color--container">
@ -201,5 +203,12 @@ export default {
height: $space-normal;
margin-right: $space-smaller;
width: $space-normal;
border: 1px solid var(--color-border-light);
}
.label-title {
span {
width: var(--space-giga);
display: inline-block;
}
}
</style>

11
app/javascript/dashboard/routes/dashboard/settings/reports/components/ReportFilters.vue
View file

@ -1,7 +1,7 @@
<template>
<div class="flex-container flex-dir-column medium-flex-dir-row">
<div v-if="type === 'agent'" class="small-12 medium-3 pull-right">
<p aria-hidden="true" class="hide">
<p>
{{ $t('AGENT_REPORTS.FILTER_DROPDOWN_LABEL') }}
</p>
<multiselect
@ -43,7 +43,7 @@
</multiselect>
</div>
<div v-else-if="type === 'label'" class="small-12 medium-3 pull-right">
<p aria-hidden="true" class="hide">
<p>
{{ $t('LABEL_REPORTS.FILTER_DROPDOWN_LABEL') }}
</p>
<multiselect
@ -89,7 +89,7 @@
</multiselect>
</div>
<div v-else class="small-12 medium-3 pull-right">
<p aria-hidden="true" class="hide">
<p>
{{ $t('INBOX_REPORTS.FILTER_DROPDOWN_LABEL') }}
</p>
<multiselect
@ -107,6 +107,9 @@
/>
</div>
<div class="small-12 medium-3 pull-right margin-left-small">
<p>
{{ $t('REPORT.DURATION_FILTER_LABEL') }}
</p>
<multiselect
v-model="currentDateRangeSelection"
track-by="name"
@ -133,7 +136,7 @@
v-if="notLast7Days"
class="small-12 medium-3 pull-right margin-left-small"
>
<p aria-hidden="true" class="hide">
<p>
{{ $t('REPORT.GROUP_BY_FILTER_DROPDOWN_LABEL') }}
</p>
<multiselect

1
app/javascript/shared/components/ui/label/LabelDropdownItem.vue
View file

@ -94,6 +94,7 @@ export default {
margin-top: var(--space-micro);
min-width: var(--space-slab);
width: var(--space-slab);
border: 1px solid var(--color-border-light);
}
}
</style>