diff --git a/frontend/app_flowy/packages/appflowy_editor_plugins/assets/images/delete.svg b/frontend/app_flowy/packages/appflowy_editor_plugins/assets/images/delete.svg
new file mode 100644
index 0000000000..5a3d972872
--- /dev/null
+++ b/frontend/app_flowy/packages/appflowy_editor_plugins/assets/images/delete.svg
@@ -0,0 +1,6 @@
+
diff --git a/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/code_block/code_block_node_widget.dart b/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/code_block/code_block_node_widget.dart
index 73676ee95d..bcc30e0c3b 100644
--- a/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/code_block/code_block_node_widget.dart
+++ b/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/code_block/code_block_node_widget.dart
@@ -1,4 +1,5 @@
import 'package:appflowy_editor/appflowy_editor.dart';
+import 'package:appflowy_editor_plugins/src/infra/svg.dart';
import 'package:flutter/material.dart';
import 'package:highlight/highlight.dart' as highlight;
import 'package:highlight/languages/all.dart';
@@ -141,10 +142,11 @@ class __CodeBlockNodeWidgeState extends State<_CodeBlockNodeWidge>
top: -5,
right: -5,
child: IconButton(
- icon: Icon(
- Icons.delete_forever_outlined,
+ icon: Svg(
+ name: 'delete',
color: widget.editorState.editorStyle.selectionMenuItemIconColor,
- size: 16,
+ width: 16,
+ height: 16,
),
onPressed: () {
final transaction = widget.editorState.transaction
diff --git a/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/infra/svg.dart b/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/infra/svg.dart
new file mode 100644
index 0000000000..a08a37026c
--- /dev/null
+++ b/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/infra/svg.dart
@@ -0,0 +1,54 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/svg.dart';
+
+class Svg extends StatelessWidget {
+ const Svg({
+ Key? key,
+ this.name,
+ this.width,
+ this.height,
+ this.color,
+ this.number,
+ this.padding,
+ }) : super(key: key);
+
+ final String? name;
+ final double? width;
+ final double? height;
+ final Color? color;
+ final int? number;
+ final EdgeInsets? padding;
+
+ final _defaultWidth = 20.0;
+ final _defaultHeight = 20.0;
+
+ @override
+ Widget build(BuildContext context) {
+ return Padding(
+ padding: padding ?? const EdgeInsets.all(0),
+ child: _buildSvg(),
+ );
+ }
+
+ Widget _buildSvg() {
+ if (name != null) {
+ return SvgPicture.asset(
+ 'assets/images/$name.svg',
+ color: color,
+ fit: BoxFit.fill,
+ height: height,
+ width: width,
+ package: 'appflowy_editor_plugins',
+ );
+ } else if (number != null) {
+ final numberText =
+ '';
+ return SvgPicture.string(
+ numberText,
+ width: width ?? _defaultWidth,
+ height: height ?? _defaultHeight,
+ );
+ }
+ return Container();
+ }
+}
diff --git a/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/math_ equation/math_equation_node_widget.dart b/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/math_ equation/math_equation_node_widget.dart
index 76121a1ca9..6892d38ba9 100644
--- a/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/math_ equation/math_equation_node_widget.dart
+++ b/frontend/app_flowy/packages/appflowy_editor_plugins/lib/src/math_ equation/math_equation_node_widget.dart
@@ -1,4 +1,5 @@
import 'package:appflowy_editor/appflowy_editor.dart';
+import 'package:appflowy_editor_plugins/src/infra/svg.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_math_fork/flutter_math.dart';
@@ -141,10 +142,11 @@ class _MathEquationNodeWidgetState extends State<_MathEquationNodeWidget> {
top: -5,
right: -5,
child: IconButton(
- icon: Icon(
- Icons.delete_forever_outlined,
+ icon: Svg(
+ name: 'delete',
color: widget.editorState.editorStyle.selectionMenuItemIconColor,
- size: 16,
+ width: 16,
+ height: 16,
),
onPressed: () {
final transaction = widget.editorState.transaction
diff --git a/frontend/app_flowy/packages/appflowy_editor_plugins/pubspec.yaml b/frontend/app_flowy/packages/appflowy_editor_plugins/pubspec.yaml
index ccd37fb96f..a68a92818c 100644
--- a/frontend/app_flowy/packages/appflowy_editor_plugins/pubspec.yaml
+++ b/frontend/app_flowy/packages/appflowy_editor_plugins/pubspec.yaml
@@ -12,13 +12,14 @@ environment:
dependencies:
flutter:
sdk: flutter
- appflowy_editor:
+ appflowy_editor:
path: ../appflowy_editor
- flowy_infra_ui:
+ flowy_infra_ui:
path: ../flowy_infra_ui
flutter_math_fork: ^0.6.3+1
highlight: ^0.7.0
shared_preferences: ^2.0.15
+ flutter_svg: ^1.1.1+1
dev_dependencies:
flutter_test:
@@ -32,8 +33,8 @@ dev_dependencies:
flutter:
# To add assets to your package, add an assets section, like this:
- # assets:
- # - images/a_dot_burr.jpeg
+ assets:
+ - assets/images/
# - images/a_dot_ham.jpeg
#
# For details regarding assets in packages, see