content: Consolidate plain-paragraph style in baseContentTextStyle

For non-paragraph content that wants to inherit its font size and
line height attributes, it seems at least as natural to inherit them
from our plain paragraph style, as from...hmm...
TextTheme.bodyMedium, as is happening currently. Doing so should
make the content styles more self-contained and decrease the need
for nonlocal reasoning when reading the code.

These are the elements that inherit both their font-size and
line-height attributes:
- line breaks (i.e., <br> in a block context; `LineBreakNode`)
- list-item markers (e.g., "1." in a numbered list)

Instead of font-size 14 and line-height 1.43x, from
TextTheme.bodyMedium, those now have font-size 17 and line-height
~1.29x (i.e., 22 / 17). Since the list-item markers change is
somewhat conspicuous, I filed #697 ("content: Markers on list items
are smaller than list-item text"), which this commit fixes.

Code blocks (and our simplified math blocks) set their own font
size, but they do inherit their line height. So those now also have
a line height of ~1.29x instead of 1.43x. As it happens, web sets a
line height of 1.4x for code blocks, which we should probably follow
(intentionally). I'll make that adjustment next, but now hopefully
this is a helpful structure for our content implementations.

Fixes: #697

Author: chrisbobbe

lib/widgets/content.dart

@@ -23,7 +23,14 @@ import 'text.dart';
 /// The font size for message content in a plain unstyled paragraph.
 const double kBaseFontSize = 17;
 
-final baseContentTextStyle = TextStyle(color: const HSLColor.fromAHSL(1, 0, 0, 0.15).toColor());
+/// The [TextStyle] we use for plain, unstyled paragraphs.
+///
+/// Also the base style that all other text content should inherit from.
+final plainParagraphContentTextStyle = TextStyle(
+  color: const HSLColor.fromAHSL(1, 0, 0, 0.15).toColor(),
+  fontSize: kBaseFontSize,
+  height: (22 / kBaseFontSize),
+);
 
 /// The entire content of a message, aka its body.
 ///
@@ -39,7 +46,7 @@ class MessageContent extends StatelessWidget {
   Widget build(BuildContext context) {
     return InheritedMessage(message: message,
       child: DefaultTextStyle.merge(
-        style: baseContentTextStyle,
+        style: plainParagraphContentTextStyle,
         child: BlockContentList(nodes: content.nodes)));
   }
 }
@@ -138,11 +145,6 @@ class Paragraph extends StatelessWidget {
 
   final ParagraphNode node;
 
-  static const textStyle = TextStyle(
-    fontSize: kBaseFontSize,
-    height: (22 / kBaseFontSize),
-  );
-
   @override
   Widget build(BuildContext context) {
     // Empty paragraph winds up with zero height.
@@ -151,7 +153,7 @@ class Paragraph extends StatelessWidget {
 
     final text = _buildBlockInlineContainer(
       node: node,
-      style: textStyle,
+      style: DefaultTextStyle.of(context).style,
     );
 
     // If the paragraph didn't actually have a `p` element in the HTML,

lib/widgets/profile.dart

@@ -218,7 +218,7 @@ class _LinkWidget extends StatelessWidget {
   Widget build(BuildContext context) {
     final linkNode = LinkNode(url: url, nodes: [TextNode(text)]);
     final paragraph = DefaultTextStyle.merge(
-      style: baseContentTextStyle,
+      style: plainParagraphContentTextStyle,
       child: Paragraph(node: ParagraphNode(nodes: [linkNode], links: [linkNode])));
     return Padding(
       padding: const EdgeInsets.symmetric(horizontal: 8),

test/widgets/content_test.dart

@@ -94,7 +94,7 @@ void main() {
 
   Widget plainContent(String html) {
     return DefaultTextStyle.merge(
-      style: TextStyle(color: const HSLColor.fromAHSL(1, 0, 0, 0.15).toColor()),
+      style: plainParagraphContentTextStyle,
       child: BlockContentList(nodes: parseContent(html).nodes));
   }
 
@@ -540,7 +540,7 @@ void main() {
     }, variant: const TargetPlatformVariant({TargetPlatform.android, TargetPlatform.iOS}));
 
     testWidgets('multiple links in paragraph', (tester) async {
-      final fontSize = Paragraph.textStyle.fontSize!;
+      final fontSize = plainParagraphContentTextStyle.fontSize!;
 
       await prepare(tester,
         '<p><a href="https://a/">foo</a> bar <a href="https://b/">baz</a></p>');
@@ -568,7 +568,7 @@ void main() {
     });
 
     testWidgets('link containing other spans', (tester) async {
-      final fontSize = Paragraph.textStyle.fontSize!;
+      final fontSize = plainParagraphContentTextStyle.fontSize!;
 
       await prepare(tester,
         '<p><a href="https://a/">two <strong><em><code>words</code></em></strong></a></p>');