fix: numbered list misalignment (#7066)

* fix: numbered list misalignment * chore: fixed width numbers
AppFlowy-IO · Dec 27, 2024 · fd1e36b · fd1e36b
1 parent 7db11c7
commit fd1e36b
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 16 deletions.
diff --git a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_editor_style.dart b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/chat_editor_style.dart
@@ -49,7 +49,7 @@ class ChatEditorStyleCustomizer extends EditorStyleCustomizer {
           DefaultAppearanceSettings.getDefaultSelectionColor(context),
       defaultTextDirection: appearance.defaultTextDirection,
       textStyleConfiguration: TextStyleConfiguration(
-        lineHeight: 1.4,
+        lineHeight: 20 / 14,
         applyHeightToFirstAscent: true,
         applyHeightToLastDescent: true,
         text: baseTextStyle(fontFamily).copyWith(

diff --git a/...er/lib/plugins/document/presentation/editor_plugins/numbered_list/numbered_list_icon.dart b/...er/lib/plugins/document/presentation/editor_plugins/numbered_list/numbered_list_icon.dart
@@ -19,26 +19,29 @@ class NumberedListIcon extends StatelessWidget {
   Widget build(BuildContext context) {
     final textStyleConfiguration =
         context.read<EditorState>().editorStyle.textStyleConfiguration;
-    final fontSize = textStyleConfiguration.text.fontSize ?? 16.0;
     final height =
         textStyleConfiguration.text.height ?? textStyleConfiguration.lineHeight;
     final combinedTextStyle = textStyle?.combine(textStyleConfiguration.text) ??
         textStyleConfiguration.text;
-    final size = fontSize * height;
-    return Container(
-      constraints: BoxConstraints(
-        minWidth: size,
-        minHeight: size,
-      ),
-      margin: const EdgeInsets.only(top: 0.5, right: 8.0),
-      alignment: Alignment.center,
-      child: Center(
-        child: Text(
-          node.levelString,
-          style: combinedTextStyle,
-          strutStyle: StrutStyle.fromTextStyle(combinedTextStyle),
-          textDirection: textDirection,
+    final adjustedTextStyle = combinedTextStyle.copyWith(
+      height: height,
+      fontFeatures: [const FontFeature.tabularFigures()],
+    );
+
+    return Padding(
+      padding: const EdgeInsets.only(right: 8.0),
+      child: Text(
+        node.levelString,
+        style: adjustedTextStyle,
+        strutStyle: StrutStyle.fromTextStyle(combinedTextStyle),
+        textHeightBehavior: TextHeightBehavior(
+          applyHeightToFirstAscent:
+              textStyleConfiguration.applyHeightToFirstAscent,
+          applyHeightToLastDescent:
+              textStyleConfiguration.applyHeightToLastDescent,
+          leadingDistribution: textStyleConfiguration.leadingDistribution,
         ),
+        textDirection: textDirection,
       ),
     );
   }