Skip to content

Commit 6cdea66

Browse files
Merge pull request #2009 from RitvikSardana/styling-article-email
fix(styling): styling in article and email
2 parents 6e6171d + 73b7936 commit 6cdea66

File tree

5 files changed

+87
-81
lines changed

5 files changed

+87
-81
lines changed

desk/src/components/Settings/EmailAdd.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@
6868
:name="field.name"
6969
:type="field.type"
7070
/>
71-
<p class="text-xs text-gray-500">{{ field.description }}</p>
71+
<p class="text-gray-500 text-p-sm">{{ field.description }}</p>
7272
</div>
7373
</div>
7474
<ErrorMessage v-if="error" class="ml-1" :message="error" />

desk/src/components/Settings/EmailEdit.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
:name="field.name"
5353
:type="field.type"
5454
/>
55-
<p class="text-xs text-gray-500">{{ field.description }}</p>
55+
<p class="text-p-sm text-gray-500">{{ field.description }}</p>
5656
</div>
5757
</div>
5858
<ErrorMessage v-if="error" class="ml-1" :message="error" />

desk/src/pages/KnowledgeBaseArticle.vue

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,9 @@
1919
</template>
2020
</PageTitle>
2121
<div class="overflow-auto">
22-
<div class="container m-auto my-12">
22+
<div class="mx-5 my-12">
2323
<TextEditor
24+
v-if="textEditorContentWithIDs"
2425
:content="textEditorContentWithIDs"
2526
:editable="editMode"
2627
:placeholder="placeholder"
@@ -47,6 +48,9 @@
4748
/>
4849
</template>
4950
</TextEditor>
51+
<div v-else class="text-gray-500 text-2xl font-semibold mb-5">
52+
Article Not Found
53+
</div>
5054
<RouterLink
5155
v-if="route.meta.public"
5256
:to="{ name: CUSTOMER_PORTAL_NEW_TICKET }"
@@ -93,7 +97,6 @@ import KnowledgeBaseArticleActionsNew from "./knowledge-base/KnowledgeBaseArticl
9397
import KnowledgeBaseArticleActionsView from "./knowledge-base/KnowledgeBaseArticleActionsView.vue";
9498
import KnowledgeBaseArticleTopEdit from "./knowledge-base/KnowledgeBaseArticleTopEdit.vue";
9599
import KnowledgeBaseArticleTopNew from "./knowledge-base/KnowledgeBaseArticleTopNew.vue";
96-
import KnowledgeBaseArticleTopPublic from "./knowledge-base/KnowledgeBaseArticleTopPublic.vue";
97100
import KnowledgeBaseArticleTopView from "./knowledge-base/KnowledgeBaseArticleTopView.vue";
98101
import { Extension } from "@tiptap/core";
99102
@@ -408,7 +411,7 @@ const PreserveIds: Extension = Extension.create({
408411
});
409412
410413
const textEditorContentWithIDs = computed(() =>
411-
addLinksToHeadings(article.data?.content)
414+
article.data?.content ? addLinksToHeadings(article.data?.content) : null
412415
);
413416
414417
function addLinksToHeadings(content: string) {

desk/src/pages/TicketNew.vue

Lines changed: 76 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -5,81 +5,84 @@
55
title="New"
66
:current="route.name"
77
/>
8-
<div v-if="template.data?.about" class="mx-5 my-3">
9-
<div class="prose-f" v-html="sanitize(template.data.about)" />
10-
</div>
11-
<div class="grid grid-cols-1 gap-4 px-5 sm:grid-cols-3">
12-
<UniInput
13-
v-for="field in visibleFields"
14-
:key="field.fieldname"
15-
:field="field"
16-
:value="templateFields[field.fieldname]"
17-
@change="templateFields[field.fieldname] = $event.value"
18-
/>
19-
</div>
20-
<div class="m-5">
21-
<FormControl
22-
v-model="subject"
23-
type="text"
24-
label="Subject*"
25-
placeholder="A short description"
26-
/>
27-
</div>
28-
<TicketNewArticles
29-
v-if="isCustomerPortal"
30-
:search="subject"
31-
class="mx-5 mb-5"
32-
/>
33-
<div v-if="isCustomerPortal" class="mx-5 mb-5 h-full">
34-
<TicketTextEditor
35-
v-show="subject.length > 2 || description.length > 0"
36-
ref="editor"
37-
v-model:attachments="attachments"
38-
v-model:content="description"
39-
placeholder="Detailed explanation"
40-
expand
8+
<!-- Container -->
9+
<div class="max-w-screen-xl mx-5 flex flex-col gap-5 mb-5">
10+
<div v-if="Boolean(template.data?.about)" class="mx-5 my-3">
11+
{{ template.data.about }}
12+
<div class="prose-f" v-html="sanitize(template.data.about)" />
13+
</div>
14+
<div
15+
class="grid grid-cols-1 gap-4 sm:grid-cols-3"
16+
v-if="Boolean(visibleFields)"
4117
>
42-
<template #bottom-right>
43-
<Button
44-
label="Submit"
45-
theme="gray"
46-
variant="solid"
47-
:disabled="
48-
$refs.editor.editor.isEmpty || ticket.loading || !subject
49-
"
50-
@click="() => ticket.submit()"
51-
/>
52-
</template>
53-
</TicketTextEditor>
54-
<h4
55-
v-show="subject.length <= 2 && description.length === 0"
56-
class="flex items-center justify-center text-lg text-gray-500"
57-
>
58-
Please enter a subject to continue
59-
</h4>
60-
</div>
18+
<UniInput
19+
v-for="field in visibleFields"
20+
:key="field.fieldname"
21+
:field="field"
22+
:value="templateFields[field.fieldname]"
23+
@change="templateFields[field.fieldname] = $event.value"
24+
/>
25+
</div>
26+
<div>
27+
<FormControl
28+
v-model="subject"
29+
type="text"
30+
label="Subject*"
31+
placeholder="A short description"
32+
/>
33+
</div>
34+
<TicketNewArticles v-if="isCustomerPortal" :search="subject" />
35+
<div v-if="isCustomerPortal">
36+
<TicketTextEditor
37+
v-show="subject.length > 2 || description.length > 0"
38+
ref="editor"
39+
v-model:attachments="attachments"
40+
v-model:content="description"
41+
placeholder="Detailed explanation"
42+
expand
43+
>
44+
<template #bottom-right>
45+
<Button
46+
label="Submit"
47+
theme="gray"
48+
variant="solid"
49+
:disabled="
50+
$refs.editor.editor.isEmpty || ticket.loading || !subject
51+
"
52+
@click="() => ticket.submit()"
53+
/>
54+
</template>
55+
</TicketTextEditor>
56+
<h4
57+
v-show="subject.length <= 2 && description.length === 0"
58+
class="text-lg text-gray-500"
59+
>
60+
Please enter a subject to continue
61+
</h4>
62+
</div>
6163

62-
<!-- for agent portal -->
63-
<div v-else class="mx-5 mb-5 h-full">
64-
<TicketTextEditor
65-
ref="editor"
66-
v-model:attachments="attachments"
67-
v-model:content="description"
68-
placeholder="Detailed explanation"
69-
expand
70-
>
71-
<template #bottom-right>
72-
<Button
73-
label="Submit"
74-
theme="gray"
75-
variant="solid"
76-
:disabled="
77-
$refs.editor.editor.isEmpty || ticket.loading || !subject
78-
"
79-
@click="() => ticket.submit()"
80-
/>
81-
</template>
82-
</TicketTextEditor>
64+
<!-- for agent portal -->
65+
<div v-else>
66+
<TicketTextEditor
67+
ref="editor"
68+
v-model:attachments="attachments"
69+
v-model:content="description"
70+
placeholder="Detailed explanation"
71+
expand
72+
>
73+
<template #bottom-right>
74+
<Button
75+
label="Submit"
76+
theme="gray"
77+
variant="solid"
78+
:disabled="
79+
$refs.editor.editor.isEmpty || ticket.loading || !subject
80+
"
81+
@click="() => ticket.submit()"
82+
/>
83+
</template>
84+
</TicketTextEditor>
85+
</div>
8386
</div>
8487
</div>
8588
</template>

desk/src/pages/ticket/TicketNewArticles.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
}"
1313
target="_blank"
1414
>
15-
<span class="text-xs">(View All)</span>
15+
<span class="text-xs underline">(View All)</span>
1616
</RouterLink>
1717
</div>
1818
<dl>
@@ -22,7 +22,7 @@
2222
class="focus:ring-cyan-30 rounded-md border-2 border-hidden p-4 hover:bg-cyan-100 focus:outline-none focus:ring active:bg-cyan-50"
2323
>
2424
<RouterLink
25-
class="group cursor-pointer hover:text-gray-900"
25+
class="group cursor-pointer hover:text-gray-900 flex flex-col gap-2"
2626
:to="{
2727
name: 'KBArticlePublicNew',
2828
params: {
@@ -34,7 +34,7 @@
3434
>
3535
<dt class="font-semibold">{{ a.subject }} - {{ a.headings }}</dt>
3636
<!-- eslint-disable-next-line vue/no-v-html -->
37-
<dd class="font-light" v-html="a.description"></dd>
37+
<dd class="font-light text-p-sm" v-html="a.description"></dd>
3838
</RouterLink>
3939
</div>
4040
</dl>

0 commit comments

Comments
 (0)