scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-02 03:57:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Update styles for canned responses modal (#6350)

Browse Source
This commit is contained in:
Pranav Raj S
2023-01-25 19:11:54 -08:00
committed by GitHub
parent 5d331f0bb2
commit 6bd4e8853b
5 changed files with 65 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/javascript/dashboard/components/widgets/conversation/CannedResponse.vue
View File

@@ -1,5 +1,9 @@
<template>
<mention-box :items="items" @mention-select="handleMentionClick" />
<mention-box :items="items" @mention-select="handleMentionClick">
<template slot-scope="{ item }">
<strong>{{ item.label }}</strong> - {{ item.description }}
</template>
</mention-box>
</template>
<script>

14
app/javascript/dashboard/components/widgets/conversation/VariableList.vue
View File

@@ -1,5 +1,12 @@
<template>
<mention-box :items="items" @mention-select="handleVariableClick" />
<mention-box :items="items" @mention-select="handleVariableClick">
<template slot-scope="{ item }">
<span class="text-capitalize variable--list-label">
{{ item.description }}
</span>
({{ item.label }})
</template>
</mention-box>
</template>
<script>
@@ -35,3 +42,8 @@ export default {
},
};
</script>
<style scoped>
.variable--list-label {
font-weight: var(--font-weight-bold);
}
</style>

2
app/javascript/dashboard/components/widgets/mentions/MentionBox.vue
View File

@@ -13,7 +13,7 @@
@mouseover="onHover(index)"
>
<a class="text-truncate">
<strong>{{ item.label }}</strong> - {{ item.description }}
<slot :item="item" />
</a>
</li>
</ul>

34
app/javascript/dashboard/routes/dashboard/settings/canned/AddCanned.vue
View File

@@ -21,18 +21,18 @@
<div class="medium-12 columns">
<label :class="{ error: $v.content.$error }">
{{ $t('CANNED_MGMT.ADD.FORM.CONTENT.LABEL') }}
<label class="editor-wrap">
<woot-message-editor
v-model="content"
class="message-editor"
:class="{ editor_warning: $v.content.$error }"
:enable-variables="true"
:enable-canned-responses="false"
:placeholder="$t('CANNED_MGMT.ADD.FORM.CONTENT.PLACEHOLDER')"
@blur="$v.content.$touch"
/>
</label>
</label>
<div class="editor-wrap">
<woot-message-editor
v-model="content"
class="message-editor"
:class="{ editor_warning: $v.content.$error }"
:enable-variables="true"
:enable-canned-responses="false"
:placeholder="$t('CANNED_MGMT.ADD.FORM.CONTENT.PLACEHOLDER')"
@blur="$v.content.$touch"
/>
</div>
</div>
<div class="modal-footer">
<div class="medium-12 columns">
@@ -137,5 +137,17 @@ export default {
.ProseMirror-menubar {
display: none;
}
.ProseMirror-woot-style {
min-height: 20rem;
p {
font-size: var(--font-size-default);
}
}
.message-editor {
border: 1px solid var(--s-200);
}
}
</style>

34
app/javascript/dashboard/routes/dashboard/settings/canned/EditCanned.vue
View File

@@ -18,18 +18,18 @@
<div class="medium-12 columns">
<label :class="{ error: $v.content.$error }">
{{ $t('CANNED_MGMT.EDIT.FORM.CONTENT.LABEL') }}
<label class="editor-wrap">
<woot-message-editor
v-model="content"
class="message-editor"
:class="{ editor_warning: $v.content.$error }"
:enable-variables="true"
:enable-canned-responses="false"
:placeholder="$t('CANNED_MGMT.EDIT.FORM.CONTENT.PLACEHOLDER')"
@blur="$v.content.$touch"
/>
</label>
</label>
<div class="editor-wrap">
<woot-message-editor
v-model="content"
class="message-editor"
:class="{ editor_warning: $v.content.$error }"
:enable-variables="true"
:enable-canned-responses="false"
:placeholder="$t('CANNED_MGMT.EDIT.FORM.CONTENT.PLACEHOLDER')"
@blur="$v.content.$touch"
/>
</div>
</div>
<div class="modal-footer">
<div class="medium-12 columns">
@@ -149,5 +149,17 @@ export default {
.ProseMirror-menubar {
display: none;
}
.ProseMirror-woot-style {
min-height: 20rem;
p {
font-size: var(--font-size-default);
}
}
.message-editor {
border: 1px solid var(--s-200);
}
}
</style>