feat: Multiple Features, Accessibility, Security, and UX Improvements #59

Merged
naomi merged 27 commits from feat/polish into main 2026-02-20 01:51:25 -08:00
Showing only changes of commit b8d3365158 - Show all commits
@@ -91,13 +91,15 @@ import { SanitizeService } from '../../services/sanitize.service';
} }
@case (ActivityType.comment) { @case (ActivityType.comment) {
<div class="activity-comment"> <div class="activity-comment">
<div class="activity-comment-header">
<span class="activity-icon">πŸ’¬</span> <span class="activity-icon">πŸ’¬</span>
<span class="activity-text"> <span class="activity-text">
commented on commented on
<a [routerLink]="['/' + activity.entityType + 's']" class="entity-link"> <a [routerLink]="['/' + activity.entityType + 's', activity.entityId]" class="entity-link">
{{ activity.entityTitle }} {{ activity.entityTitle }}
</a> </a>
</span> </span>
</div>
<div class="comment-preview" [innerHTML]="sanitizeService.sanitizeHtml(activity.commentPreview)"></div> <div class="comment-preview" [innerHTML]="sanitizeService.sanitizeHtml(activity.commentPreview)"></div>
</div> </div>
} }
@@ -256,13 +258,19 @@ import { SanitizeService } from '../../services/sanitize.service';
.activity-suggestion, .activity-suggestion,
.activity-like, .activity-like,
.activity-comment, .activity-comment-header,
.activity-achievement { .activity-achievement {
display: flex; display: flex;
align-items: start; align-items: start;
gap: 0.75rem; gap: 0.75rem;
} }
.activity-comment {
display: flex;
flex-direction: column;
gap: 0;
}
.activity-icon { .activity-icon {
font-size: 1.5rem; font-size: 1.5rem;
line-height: 1; line-height: 1;
@@ -290,12 +298,12 @@ import { SanitizeService } from '../../services/sanitize.service';
.comment-preview { .comment-preview {
margin-top: 0.5rem; margin-top: 0.5rem;
margin-left: 55px;
padding: 0.75rem; padding: 0.75rem;
background: #f9fafb; background: #f9fafb;
border-left: 3px solid #10b981; border-left: 3px solid #10b981;
border-radius: 4px; border-radius: 4px;
color: #4b5563; color: #4b5563;
font-style: italic;
} }
.status-badge { .status-badge {