From 20dba18e8eb7f38aec5c2baa82afc79d25474313 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Mon, 30 Mar 2026 18:48:11 +0400 Subject: [PATCH 01/11] fix: show reply instantly after adding without page refresh --- src/Livewire/CommentItem.php | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/Livewire/CommentItem.php b/src/Livewire/CommentItem.php index ead7671..c4aed95 100644 --- a/src/Livewire/CommentItem.php +++ b/src/Livewire/CommentItem.php @@ -180,6 +180,8 @@ class CommentItem extends Component implements HasForms app(MentionParser::class)->syncMentions($reply); + $this->comment->load(['replies.commenter', 'replies.mentions', 'replies.attachments', 'replies.reactions.commenter']); + $this->dispatch('commentUpdated'); $this->isReplying = false; From 812556cba20e6cc7ef8980378bf9785a74ff4041 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Mon, 30 Mar 2026 18:59:07 +0400 Subject: [PATCH 02/11] fix: include replies in comment count and cascade delete to replies --- resources/views/livewire/comments.blade.php | 2 +- src/Livewire/Comments.php | 8 +++++++- src/Models/Comment.php | 4 ++++ 3 files changed, 12 insertions(+), 2 deletions(-) diff --git a/resources/views/livewire/comments.blade.php b/resources/views/livewire/comments.blade.php index 3764b17..19ddf14 100644 --- a/resources/views/livewire/comments.blade.php +++ b/resources/views/livewire/comments.blade.php @@ -6,7 +6,7 @@ {{-- Sort toggle --}}

- Comments ({{ $this->totalCount }}) + Comments ({{ $this->allCommentsCount }})

@auth
diff --git a/src/Livewire/Comments.php b/src/Livewire/Comments.php index bfbe6bc..da391de 100644 --- a/src/Livewire/Comments.php +++ b/src/Livewire/Comments.php @@ -80,6 +80,12 @@ class Comments extends Component implements HasForms return $this->model->topLevelComments()->count(); } + #[Computed] + public function allCommentsCount(): int + { + return $this->model->commentCount(); + } + #[Computed] public function hasMore(): bool { @@ -203,7 +209,7 @@ class Comments extends Component implements HasForms public function refreshComments(): void { - unset($this->comments, $this->totalCount, $this->hasMore); + unset($this->comments, $this->totalCount, $this->hasMore, $this->allCommentsCount); } public function render(): View diff --git a/src/Models/Comment.php b/src/Models/Comment.php index eb3714d..48eb5f5 100644 --- a/src/Models/Comment.php +++ b/src/Models/Comment.php @@ -28,6 +28,10 @@ class Comment extends Model $comment->body = Str::sanitizeHtml($comment->body); }); + static::deleting(function (self $comment): void { + $comment->replies()->each(fn ($reply) => $reply->delete()); + }); + static::forceDeleting(function (self $comment): void { $comment->attachments()->delete(); $comment->reactions()->delete(); From 5e44a4051aac1d72d7726170f0bb44947fca8684 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Mon, 30 Mar 2026 19:00:52 +0400 Subject: [PATCH 03/11] fix: eager load 2nd level replies so all nesting levels render correctly --- src/Livewire/CommentItem.php | 2 +- src/Livewire/Comments.php | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Livewire/CommentItem.php b/src/Livewire/CommentItem.php index c4aed95..0a77ef1 100644 --- a/src/Livewire/CommentItem.php +++ b/src/Livewire/CommentItem.php @@ -180,7 +180,7 @@ class CommentItem extends Component implements HasForms app(MentionParser::class)->syncMentions($reply); - $this->comment->load(['replies.commenter', 'replies.mentions', 'replies.attachments', 'replies.reactions.commenter']); + $this->comment->load(['replies.commenter', 'replies.mentions', 'replies.attachments', 'replies.reactions.commenter', 'replies.replies.commenter', 'replies.replies.mentions', 'replies.replies.attachments', 'replies.replies.reactions.commenter']); $this->dispatch('commentUpdated'); diff --git a/src/Livewire/Comments.php b/src/Livewire/Comments.php index da391de..7a35366 100644 --- a/src/Livewire/Comments.php +++ b/src/Livewire/Comments.php @@ -68,7 +68,7 @@ class Comments extends Component implements HasForms { return $this->model ->topLevelComments() - ->with(['commenter', 'mentions', 'attachments', 'reactions.commenter', 'replies.commenter', 'replies.mentions', 'replies.attachments', 'replies.reactions.commenter']) + ->with(['commenter', 'mentions', 'attachments', 'reactions.commenter', 'replies.commenter', 'replies.mentions', 'replies.attachments', 'replies.reactions.commenter', 'replies.replies.commenter', 'replies.replies.mentions', 'replies.replies.attachments', 'replies.replies.reactions.commenter']) ->orderBy('created_at', $this->sortDirection) ->take($this->loadedCount) ->get(); From 583b49125f2cb90248c12706084dffb891b862e7 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Mon, 30 Mar 2026 19:03:43 +0400 Subject: [PATCH 04/11] fix: add InteractsWithActions so RichEditor link toolbar works --- src/Livewire/CommentItem.php | 5 ++++- src/Livewire/Comments.php | 5 ++++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/src/Livewire/CommentItem.php b/src/Livewire/CommentItem.php index 0a77ef1..def25ef 100644 --- a/src/Livewire/CommentItem.php +++ b/src/Livewire/CommentItem.php @@ -2,6 +2,8 @@ namespace Relaticle\Comments\Livewire; +use Filament\Actions\Concerns\InteractsWithActions; +use Filament\Actions\Contracts\HasActions; use Filament\Forms\Components\RichEditor; use Filament\Forms\Concerns\InteractsWithForms; use Filament\Forms\Contracts\HasForms; @@ -17,9 +19,10 @@ use Relaticle\Comments\Events\CommentUpdated; use Relaticle\Comments\Mentions\MentionParser; use Relaticle\Comments\Models\Comment; -class CommentItem extends Component implements HasForms +class CommentItem extends Component implements HasForms, HasActions { use InteractsWithForms; + use InteractsWithActions; use WithFileUploads; public Comment $comment; diff --git a/src/Livewire/Comments.php b/src/Livewire/Comments.php index 7a35366..85ea251 100644 --- a/src/Livewire/Comments.php +++ b/src/Livewire/Comments.php @@ -2,6 +2,8 @@ namespace Relaticle\Comments\Livewire; +use Filament\Actions\Concerns\InteractsWithActions; +use Filament\Actions\Contracts\HasActions; use Filament\Forms\Components\RichEditor; use Filament\Forms\Concerns\InteractsWithForms; use Filament\Forms\Contracts\HasForms; @@ -19,9 +21,10 @@ use Relaticle\Comments\Mentions\MentionParser; use Relaticle\Comments\Models\Comment; use Relaticle\Comments\Models\Subscription; -class Comments extends Component implements HasForms +class Comments extends Component implements HasForms, HasActions { use InteractsWithForms; + use InteractsWithActions; use WithFileUploads; public Model $model; From bff68f87a33565ff1a42085f5ada5bb32c414748 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Mon, 30 Mar 2026 19:15:38 +0400 Subject: [PATCH 05/11] fix: render mentions by replacing spans directly instead of RichContentRenderer --- src/Models/Comment.php | 27 ++++++++------------------- 1 file changed, 8 insertions(+), 19 deletions(-) diff --git a/src/Models/Comment.php b/src/Models/Comment.php index 48eb5f5..845288e 100644 --- a/src/Models/Comment.php +++ b/src/Models/Comment.php @@ -2,8 +2,6 @@ namespace Relaticle\Comments\Models; -use Filament\Forms\Components\RichEditor\MentionProvider; -use Filament\Forms\Components\RichEditor\RichContentRenderer; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; use Illuminate\Database\Eloquent\Relations\BelongsTo; @@ -149,33 +147,24 @@ class Comment extends Model { $body = $this->body; - if ($this->hasRichEditorMentions($body)) { - return RichContentRenderer::make($body) - ->mentions([ - MentionProvider::make('@') - ->getLabelsUsing(fn (array $ids): array => CommentsConfig::getCommenterModel()::query() - ->whereIn('id', $ids) - ->pluck('name', 'id') - ->all()), - ]) - ->toHtml(); - } - $mentionNames = $this->mentions->pluck('name')->filter()->unique(); foreach ($mentionNames as $name) { $escapedName = e($name); $styledSpan = '@'.$escapedName.''; + // Replace rich-editor mention spans (data-type="mention" with @Name as text content) + $body = preg_replace( + '/<(?:span|a)[^>]*data-type="mention"[^>]*>@?' . preg_quote($escapedName, '/') . '<\/(?:span|a)>/', + $styledSpan, + $body + ); + + // Replace plain-text mentions $body = str_replace("@{$name}", $styledSpan, $body); $body = str_replace("@{$name}", $styledSpan, $body); } return $body; } - - protected function hasRichEditorMentions(string $body): bool - { - return str_contains($body, 'data-type="mention"') || str_contains($body, '

') || str_contains($body, ' Date: Mon, 30 Mar 2026 19:17:40 +0400 Subject: [PATCH 06/11] fix: match mention styling exactly to RichEditor for custom primary color support --- src/Models/Comment.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Models/Comment.php b/src/Models/Comment.php index 845288e..a169e85 100644 --- a/src/Models/Comment.php +++ b/src/Models/Comment.php @@ -151,7 +151,7 @@ class Comment extends Model foreach ($mentionNames as $name) { $escapedName = e($name); - $styledSpan = '@'.$escapedName.''; + $styledSpan = '@'.$escapedName.''; // Replace rich-editor mention spans (data-type="mention" with @Name as text content) $body = preg_replace( From 48fbd3c9d752b217545c6b7cd2019c245c9d57b8 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Mon, 30 Mar 2026 19:20:50 +0400 Subject: [PATCH 07/11] fix: use CSS variables for mention styling so dark mode and custom colors work --- resources/css/comments.css | 17 +++++++++++++++++ src/CommentsServiceProvider.php | 6 ++++++ src/Models/Comment.php | 2 +- 3 files changed, 24 insertions(+), 1 deletion(-) create mode 100644 resources/css/comments.css diff --git a/resources/css/comments.css b/resources/css/comments.css new file mode 100644 index 0000000..3846440 --- /dev/null +++ b/resources/css/comments.css @@ -0,0 +1,17 @@ +.comment-mention { + background-color: rgb(var(--primary-50)); + color: rgb(var(--primary-600)); + margin-top: 0; + margin-bottom: 0; + display: inline-block; + border-radius: 0.25rem; + padding-left: 0.25rem; + padding-right: 0.25rem; + font-weight: 500; + white-space: nowrap; +} + +.dark .comment-mention { + background-color: rgb(var(--primary-400) / 0.1); + color: rgb(var(--primary-400)); +} diff --git a/src/CommentsServiceProvider.php b/src/CommentsServiceProvider.php index 94e5f58..66ade45 100644 --- a/src/CommentsServiceProvider.php +++ b/src/CommentsServiceProvider.php @@ -2,6 +2,8 @@ namespace Relaticle\Comments; +use Filament\Support\Assets\Css; +use Filament\Support\Facades\FilamentAsset; use Illuminate\Database\Eloquent\Relations\Relation; use Illuminate\Support\Facades\Event; use Illuminate\Support\Facades\Gate; @@ -64,5 +66,9 @@ class CommentsServiceProvider extends PackageServiceProvider Livewire::component('comments', Comments::class); Livewire::component('comment-item', CommentItem::class); Livewire::component('reactions', Reactions::class); + + FilamentAsset::register([ + Css::make('comments', __DIR__.'/../resources/css/comments.css'), + ], 'relaticle/comments'); } } diff --git a/src/Models/Comment.php b/src/Models/Comment.php index a169e85..78ec451 100644 --- a/src/Models/Comment.php +++ b/src/Models/Comment.php @@ -151,7 +151,7 @@ class Comment extends Model foreach ($mentionNames as $name) { $escapedName = e($name); - $styledSpan = '@'.$escapedName.''; + $styledSpan = '@'.$escapedName.''; // Replace rich-editor mention spans (data-type="mention" with @Name as text content) $body = preg_replace( From 541d11ab9044fa99d5b8ee76225c2d80891985e2 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Wed, 1 Apr 2026 01:10:05 +0400 Subject: [PATCH 08/11] fix: preserve mention data attributes through HTML sanitization Filament's sanitizer strips data-id, data-label and data-char from mention spans, breaking both display (unstyled @mention) and editing (@-only shown in RichEditor). Register a package-scoped sanitizer that explicitly allows these attributes on span elements. Also fix double-replacement bug in renderBodyWithMentions() where both the rich-editor regex and str_replace fallback could run on the same mention, producing nested styled spans. --- src/CommentsServiceProvider.php | 23 +++++++++++++++++++++++ src/Models/Comment.php | 20 +++++++++----------- tests/Feature/ContentSanitizationTest.php | 20 ++++++++++++++++++++ tests/Feature/MentionDisplayTest.php | 22 ++++++++++++++++++++++ tests/Feature/MentionParserTest.php | 11 +++++++++++ 5 files changed, 85 insertions(+), 11 deletions(-) diff --git a/src/CommentsServiceProvider.php b/src/CommentsServiceProvider.php index 66ade45..2418923 100644 --- a/src/CommentsServiceProvider.php +++ b/src/CommentsServiceProvider.php @@ -18,6 +18,8 @@ use Relaticle\Comments\Livewire\Comments; use Relaticle\Comments\Livewire\Reactions; use Spatie\LaravelPackageTools\Package; use Spatie\LaravelPackageTools\PackageServiceProvider; +use Symfony\Component\HtmlSanitizer\HtmlSanitizer; +use Symfony\Component\HtmlSanitizer\HtmlSanitizerConfig; class CommentsServiceProvider extends PackageServiceProvider { @@ -51,6 +53,27 @@ class CommentsServiceProvider extends PackageServiceProvider MentionResolver::class, fn () => new (CommentsConfig::getMentionResolver()) ); + + $this->app->scoped( + 'comments.html_sanitizer', + fn (): HtmlSanitizer => new HtmlSanitizer( + (new HtmlSanitizerConfig) + ->allowSafeElements() + ->allowRelativeLinks() + ->allowRelativeMedias() + ->allowAttribute('class', allowedElements: '*') + ->allowAttribute('data-color', allowedElements: '*') + ->allowAttribute('data-from-breakpoint', allowedElements: '*') + ->allowAttribute('data-type', allowedElements: '*') + ->allowAttribute('data-id', allowedElements: 'span') + ->allowAttribute('data-label', allowedElements: 'span') + ->allowAttribute('data-char', allowedElements: 'span') + ->allowAttribute('style', allowedElements: '*') + ->allowAttribute('width', allowedElements: 'img') + ->allowAttribute('height', allowedElements: 'img') + ->withMaxInputLength(500000) + ), + ); } public function packageBooted(): void diff --git a/src/Models/Comment.php b/src/Models/Comment.php index 78ec451..a03f50a 100644 --- a/src/Models/Comment.php +++ b/src/Models/Comment.php @@ -9,7 +9,6 @@ use Illuminate\Database\Eloquent\Relations\HasMany; use Illuminate\Database\Eloquent\Relations\MorphTo; use Illuminate\Database\Eloquent\Relations\MorphToMany; use Illuminate\Database\Eloquent\SoftDeletes; -use Illuminate\Support\Str; use Relaticle\Comments\CommentsConfig; use Relaticle\Comments\Database\Factories\CommentFactory; @@ -23,7 +22,7 @@ class Comment extends Model parent::boot(); static::saving(function (self $comment): void { - $comment->body = Str::sanitizeHtml($comment->body); + $comment->body = app('comments.html_sanitizer')->sanitize($comment->body); }); static::deleting(function (self $comment): void { @@ -153,16 +152,15 @@ class Comment extends Model $escapedName = e($name); $styledSpan = '@'.$escapedName.''; - // Replace rich-editor mention spans (data-type="mention" with @Name as text content) - $body = preg_replace( - '/<(?:span|a)[^>]*data-type="mention"[^>]*>@?' . preg_quote($escapedName, '/') . '<\/(?:span|a)>/', - $styledSpan, - $body - ); + $pattern = '/<(?:span|a)[^>]*data-type="mention"[^>]*>@?' . preg_quote($escapedName, '/') . '<\/(?:span|a)>/'; - // Replace plain-text mentions - $body = str_replace("@{$name}", $styledSpan, $body); - $body = str_replace("@{$name}", $styledSpan, $body); + if (preg_match($pattern, $body)) { + $body = preg_replace($pattern, $styledSpan, $body); + } else { + // Fallback for plain-text mentions + $body = str_replace("@{$name}", $styledSpan, $body); + $body = str_replace("@{$name}", $styledSpan, $body); + } } return $body; diff --git a/tests/Feature/ContentSanitizationTest.php b/tests/Feature/ContentSanitizationTest.php index e49a302..e855d62 100644 --- a/tests/Feature/ContentSanitizationTest.php +++ b/tests/Feature/ContentSanitizationTest.php @@ -155,6 +155,26 @@ it('strips onclick handler from elements', function () { expect($comment->body)->toContain('click me'); }); +it('preserves mention data attributes in comment body', function () { + $user = User::factory()->create(); + $post = Post::factory()->create(); + + $body = '@max'; + + $comment = Comment::factory()->create([ + 'commentable_id' => $post->id, + 'commentable_type' => $post->getMorphClass(), + 'commenter_id' => $user->getKey(), + 'commenter_type' => $user->getMorphClass(), + 'body' => $body, + ]); + + expect($comment->body)->toContain('data-type="mention"'); + expect($comment->body)->toContain('data-id="1"'); + expect($comment->body)->toContain('data-label="max"'); + expect($comment->body)->toContain('data-char="@"'); +}); + it('sanitizes content submitted through livewire component', function () { $user = User::factory()->create(); $post = Post::factory()->create(); diff --git a/tests/Feature/MentionDisplayTest.php b/tests/Feature/MentionDisplayTest.php index fe96f86..c20124f 100644 --- a/tests/Feature/MentionDisplayTest.php +++ b/tests/Feature/MentionDisplayTest.php @@ -51,6 +51,28 @@ it('renders multiple mentions with styled spans', function () { expect($rendered)->toContain('comment-mention'); }); +it('renders rich-editor mention span as styled mention', function () { + $user = User::factory()->create(); + $alice = User::factory()->create(['name' => 'Alice']); + $post = Post::factory()->create(); + + $comment = Comment::factory()->create([ + 'commentable_id' => $post->id, + 'commentable_type' => $post->getMorphClass(), + 'commenter_id' => $user->getKey(), + 'commenter_type' => $user->getMorphClass(), + 'body' => '

@Alice said hi

', + ]); + + $comment->mentions()->attach($alice->id, ['commenter_type' => $alice->getMorphClass()]); + + $rendered = $comment->renderBodyWithMentions(); + + expect($rendered)->toContain('comment-mention'); + expect($rendered)->toContain('@Alice'); + expect($rendered)->not->toContain('data-type="mention"'); +}); + it('does not style non-mentioned @text', function () { $user = User::factory()->create(); $post = Post::factory()->create(); diff --git a/tests/Feature/MentionParserTest.php b/tests/Feature/MentionParserTest.php index ee7c01a..9fa23fc 100644 --- a/tests/Feature/MentionParserTest.php +++ b/tests/Feature/MentionParserTest.php @@ -10,6 +10,17 @@ use Relaticle\Comments\Models\Comment; use Relaticle\Comments\Tests\Models\Post; use Relaticle\Comments\Tests\Models\User; +it('parses rich-editor mention spans using data-id', function () { + $john = User::factory()->create(['name' => 'john']); + + $parser = app(MentionParser::class); + $body = '

Hello @john

'; + $result = $parser->parse($body); + + expect($result)->toHaveCount(1); + expect($result->first())->toBe($john->id); +}); + it('parses @username from plain text body', function () { User::factory()->create(['name' => 'john']); User::factory()->create(['name' => 'jane']); From d189743a9c083f15949d20efc7e73414756a7d5a Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Wed, 1 Apr 2026 01:10:13 +0400 Subject: [PATCH 09/11] fix: show user-friendly error on file upload failure (413) Livewire fires a livewire-upload-error JS event when an upload fails, including 413 responses from the server. Add x-on: Alpine listeners on the comment and reply forms to display an error message instead of silently failing. Use x-on: instead of @ shorthand to avoid Blade parsing @livewire as a directive. --- resources/views/livewire/comment-item.blade.php | 7 ++++++- resources/views/livewire/comments.blade.php | 4 ++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/resources/views/livewire/comment-item.blade.php b/resources/views/livewire/comment-item.blade.php index 9a6c1d8..f6a6646 100644 --- a/resources/views/livewire/comment-item.blade.php +++ b/resources/views/livewire/comment-item.blade.php @@ -104,7 +104,11 @@ {{-- Reply form --}} @if ($isReplying) -
+
{{ $this->replyForm }} @if (!empty($replyAttachments)) @@ -120,6 +124,7 @@ @error('replyAttachments.*')

{{ $message }}

@enderror +

@endif
diff --git a/resources/views/livewire/comments.blade.php b/resources/views/livewire/comments.blade.php index 19ddf14..1087cae 100644 --- a/resources/views/livewire/comments.blade.php +++ b/resources/views/livewire/comments.blade.php @@ -2,6 +2,9 @@ @if (!\Relaticle\Comments\CommentsConfig::isBroadcastingEnabled()) wire:poll.{{ \Relaticle\Comments\CommentsConfig::getPollingInterval() }} @endif + x-data="{ uploadError: null }" + x-on:livewire-upload-error.window="uploadError = '{{ __('File upload failed. The file may be too large or an unsupported type.') }}'" + x-on:livewire-upload-start.window="uploadError = null" > {{-- Sort toggle --}}
@@ -76,6 +79,7 @@ @error('attachments.*')

{{ $message }}

@enderror +

@endif
From 4b783e437fabcdb1c4dd32027543accf9c1b2407 Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Wed, 1 Apr 2026 01:22:37 +0400 Subject: [PATCH 10/11] improve: polish mention badge styling with dark mode support Add border, adjust sizing, font-weight and transition for both light (primary-50 bg / primary-700 text / primary-200 border) and dark (15% primary bg / primary-300 text / 30% primary border) themes using Filament CSS variables. --- resources/css/comments.css | 23 +++++++++++++---------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/resources/css/comments.css b/resources/css/comments.css index 3846440..08ec231 100644 --- a/resources/css/comments.css +++ b/resources/css/comments.css @@ -1,17 +1,20 @@ .comment-mention { + display: inline-flex; + align-items: center; background-color: rgb(var(--primary-50)); - color: rgb(var(--primary-600)); - margin-top: 0; - margin-bottom: 0; - display: inline-block; - border-radius: 0.25rem; - padding-left: 0.25rem; - padding-right: 0.25rem; - font-weight: 500; + color: rgb(var(--primary-700)); + border: 1px solid rgb(var(--primary-200)); + border-radius: 0.375rem; + padding: 0.0625rem 0.375rem; + font-size: 0.875em; + font-weight: 600; + line-height: 1.5; white-space: nowrap; + transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease; } .dark .comment-mention { - background-color: rgb(var(--primary-400) / 0.1); - color: rgb(var(--primary-400)); + background-color: rgb(var(--primary-400) / 0.15); + color: rgb(var(--primary-300)); + border-color: rgb(var(--primary-400) / 0.3); } From bb88583f09bcaf68a9223f5799376a50182cf7db Mon Sep 17 00:00:00 2001 From: ilyapashayan Date: Wed, 1 Apr 2026 01:24:25 +0400 Subject: [PATCH 11/11] fix: match mention badge style exactly to Filament RichEditor spec MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Filament uses: bg-primary-50 text-primary-600 rounded px-1 font-medium dark: bg-primary-400/10 text-primary-400 — no border, 0.25rem radius. Previous commit added incorrect border/padding/font-weight overrides. --- resources/css/comments.css | 24 +++++++++++------------- 1 file changed, 11 insertions(+), 13 deletions(-) diff --git a/resources/css/comments.css b/resources/css/comments.css index 08ec231..ed75f65 100644 --- a/resources/css/comments.css +++ b/resources/css/comments.css @@ -1,20 +1,18 @@ .comment-mention { - display: inline-flex; - align-items: center; background-color: rgb(var(--primary-50)); - color: rgb(var(--primary-700)); - border: 1px solid rgb(var(--primary-200)); - border-radius: 0.375rem; - padding: 0.0625rem 0.375rem; - font-size: 0.875em; - font-weight: 600; - line-height: 1.5; + color: rgb(var(--primary-600)); + margin-top: 0; + margin-bottom: 0; + display: inline-block; + border-radius: 0.25rem; + padding-left: 0.25rem; + padding-right: 0.25rem; + font-weight: 500; white-space: nowrap; - transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease; + transition: background-color 0.15s ease, color 0.15s ease; } .dark .comment-mention { - background-color: rgb(var(--primary-400) / 0.15); - color: rgb(var(--primary-300)); - border-color: rgb(var(--primary-400) / 0.3); + background-color: rgb(var(--primary-400) / 0.1); + color: rgb(var(--primary-400)); }