Update blockquote styling to latest designs

This commit is contained in:
Stefan Ceriu
2023-05-16 16:52:55 +03:00
committed by Stefan Ceriu
parent 70790161f1
commit 6ec5922956
3 changed files with 17 additions and 14 deletions
@@ -71,11 +71,3 @@ struct TimelineBubbleLayout: Layout {
}
}
}
extension View {
func timelineQuoteBubbleFormatting() -> some View {
foregroundColor(.compound.textPlaceholder)
.fixedSize(horizontal: false, vertical: true)
.padding(4.0)
}
}
@@ -131,7 +131,9 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
// The rendered reply bubble with a greedy width. The custom layout prevents
// the infinite width from increasing the overall width of the view.
TimelineReplyView(timelineItemReplyDetails: replyDetails)
.timelineQuoteBubbleFormatting()
.foregroundColor(.compound.textPlaceholder)
.fixedSize(horizontal: false, vertical: true)
.padding(4.0)
.frame(maxWidth: .infinity, alignment: .leading)
.background(Color.element.background)
.cornerRadius(8)
@@ -139,7 +141,8 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
// Add a fixed width reply bubble that is used for layout calculations but won't be rendered.
TimelineReplyView(timelineItemReplyDetails: replyDetails)
.timelineQuoteBubbleFormatting()
.fixedSize(horizontal: false, vertical: true)
.padding(4.0)
.layoutPriority(TimelineBubbleLayout.Priority.hiddenQuote)
.hidden()
}
@@ -43,10 +43,17 @@ struct FormattedBodyText: View {
// The rendered blockquote with a greedy width. The custom layout prevents the
// infinite width from increasing the overall width of the view.
Text(component.attributedString.mergingAttributes(blockquoteAttributes))
.timelineQuoteBubbleFormatting()
.foregroundColor(.compound.textPlaceholder)
.fixedSize(horizontal: false, vertical: true)
.frame(maxWidth: .infinity, alignment: .leading)
.background(Color.element.background)
.cornerRadius(8)
.padding(.leading, 12.0)
.overlay(alignment: .leading) {
// User an overlay here so that the rectangle's infinite height doesn't take priority
Rectangle()
.frame(width: 2.0)
.padding(.leading, 6.0)
.foregroundColor(.compound.textPlaceholder)
}
.layoutPriority(TimelineBubbleLayout.Priority.visibleQuote)
} else {
Text(component.attributedString)
@@ -62,7 +69,8 @@ struct FormattedBodyText: View {
ForEach(attributedComponents, id: \.self) { component in
if component.isBlockquote {
Text(component.attributedString.mergingAttributes(blockquoteAttributes))
.timelineQuoteBubbleFormatting()
.fixedSize(horizontal: false, vertical: true)
.padding(.leading, 12.0)
.layoutPriority(TimelineBubbleLayout.Priority.hiddenQuote)
.hidden()
}