discourse/discourse-solved
1
0
Fork 0
mirror of https://github.com/discourse/discourse-solved.git synced 2025-07-27 15:13:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

UX: Improve appearance and handling of accepted answers without excerpts

Browse Source 
- Hide blockquote for accepted answers without excerpts to avoid unnecessary visual elements.
- Adjust title padding for better alignment when excerpts are absent.
- Ensure no content fallback (`""`) when excerpts are not provided.
- Add `accepted-answer--has-excerpt` class for proper styling differentiation.
This commit is contained in:
Sérgio Saquetim 2025-07-22 00:29:34 -03:00
parent fe6934e1b0
commit 75b4eef73a
No known key found for this signature in database
GPG Key ID: B4E3D7F11E793062
2 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
assets/javascripts/discourse/components/solved-accepted-answer.gjs
View File

@ -29,7 +29,7 @@ export default class SolvedAcceptedAnswer extends Component {
get collapsedContent() { get collapsedContent() {
if (!this.hasExcerpt) { if (!this.hasExcerpt) {
return null; return "";
} }
return htmlSafe(this.acceptedAnswer.excerpt); return htmlSafe(this.acceptedAnswer.excerpt);
@ -89,6 +89,7 @@ export default class SolvedAcceptedAnswer extends Component {
<PostQuotedContent <PostQuotedContent
class={{concatClass class={{concatClass
"accepted-answer" "accepted-answer"
(if this.hasExcerpt "accepted-answer--has-excerpt")
(unless this.collapsedContent "title-only") (unless this.collapsedContent "title-only")
}} }}
@collapsedContent={{this.collapsedContent}} @collapsedContent={{this.collapsedContent}}

9
assets/stylesheets/solutions.scss
View File

@ -64,6 +64,15 @@ aside.quote.accepted-answer {
align-items: flex-start; align-items: flex-start;
} }
&:not(.accepted-answer--has-excerpt) {
> .title {
padding: 0.8em;
}
> blockquote {
display: none;
}
}
.accepted-answer--solver-accepter { .accepted-answer--solver-accepter {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;