perf: improve word-break style for comment content (#852)

#### What type of PR is this?

/kind improvement

#### What this PR does / why we need it:

修复评论管理中内容文字过长导致样式异常的问题。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/3294

#### Screenshots:

before:

<img width="1016" alt="image" src="https://user-images.githubusercontent.com/21301288/218379816-73a39f13-32f7-40a8-a65d-9e7f6f691f71.png">

after:

<img width="1416" alt="image" src="https://user-images.githubusercontent.com/21301288/218379719-f86193c0-d6d7-4aa6-ad5c-d538c215e80b.png">

#### Does this PR introduce a user-facing change?


```release-note
修复 Console 的评论管理中内容文字过长导致样式异常的问题。
```
pull/857/head
Ryan Wang 2023-02-13 16:30:20 +08:00 committed by GitHub
parent 5315a0d429
commit 381c3e2484
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 5 deletions

View File

@ -308,10 +308,10 @@ const subjectRefResult = computed(() => {
:title="comment?.owner?.displayName"
:description="comment?.owner?.email"
></VEntityField>
<VEntityField>
<VEntityField width="60%">
<template #description>
<div class="flex flex-col gap-2">
<div class="text-sm text-gray-900">
<div class="break-all text-sm text-gray-900">
{{ comment?.comment?.spec.content }}
</div>
<div class="flex items-center gap-3 text-xs">

View File

@ -122,11 +122,11 @@ const isHoveredReply = computed(() => {
:title="reply?.owner.displayName"
:description="reply?.owner.email"
></VEntityField>
<VEntityField>
<VEntityField width="60%">
<template #description>
<div class="flex flex-col gap-2">
<div class="w-96 text-sm text-gray-800">
<p>
<div class="text-sm text-gray-800">
<p class="break-all">
<a
v-if="quoteReply"
class="mr-1 inline-flex flex-row items-center gap-1 rounded bg-gray-200 py-0.5 px-1 text-xs font-medium text-gray-600 hover:text-blue-500 hover:underline"