diff --git a/assets/fonts/fallback/NotoEmoji-Regular.ttf b/assets/fonts/fallback/NotoEmoji-Regular.ttf new file mode 100644 index 000000000..69f381175 Binary files /dev/null and b/assets/fonts/fallback/NotoEmoji-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSans-Regular.ttf b/assets/fonts/fallback/NotoSans-Regular.ttf new file mode 100644 index 000000000..fa4cff505 Binary files /dev/null and b/assets/fonts/fallback/NotoSans-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansArabic-Regular.ttf b/assets/fonts/fallback/NotoSansArabic-Regular.ttf new file mode 100644 index 000000000..79359c460 Binary files /dev/null and b/assets/fonts/fallback/NotoSansArabic-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansEgyptianHieroglyphs-Regular.ttf b/assets/fonts/fallback/NotoSansEgyptianHieroglyphs-Regular.ttf new file mode 100644 index 000000000..9306d7ec0 Binary files /dev/null and b/assets/fonts/fallback/NotoSansEgyptianHieroglyphs-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansKR-Regular.ttf b/assets/fonts/fallback/NotoSansKR-Regular.ttf new file mode 100644 index 000000000..1b14d3247 Binary files /dev/null and b/assets/fonts/fallback/NotoSansKR-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansMath-Regular.ttf b/assets/fonts/fallback/NotoSansMath-Regular.ttf new file mode 100644 index 000000000..b257fa72e Binary files /dev/null and b/assets/fonts/fallback/NotoSansMath-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansSC-Regular.ttf b/assets/fonts/fallback/NotoSansSC-Regular.ttf new file mode 100644 index 000000000..4d4cadb98 Binary files /dev/null and b/assets/fonts/fallback/NotoSansSC-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansSymbols-Regular.ttf b/assets/fonts/fallback/NotoSansSymbols-Regular.ttf new file mode 100644 index 000000000..6ab0ca088 Binary files /dev/null and b/assets/fonts/fallback/NotoSansSymbols-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansSymbols2-Regular.ttf b/assets/fonts/fallback/NotoSansSymbols2-Regular.ttf new file mode 100644 index 000000000..90581c1e3 Binary files /dev/null and b/assets/fonts/fallback/NotoSansSymbols2-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansTamil-Regular.ttf b/assets/fonts/fallback/NotoSansTamil-Regular.ttf new file mode 100644 index 000000000..3c145a290 Binary files /dev/null and b/assets/fonts/fallback/NotoSansTamil-Regular.ttf differ diff --git a/assets/fonts/fallback/NotoSansThai-Regular.ttf b/assets/fonts/fallback/NotoSansThai-Regular.ttf new file mode 100644 index 000000000..638e709b1 Binary files /dev/null and b/assets/fonts/fallback/NotoSansThai-Regular.ttf differ diff --git a/assets/fonts/fallback/Roboto-Regular.ttf b/assets/fonts/fallback/Roboto-Regular.ttf new file mode 100644 index 000000000..2b6392ffe Binary files /dev/null and b/assets/fonts/fallback/Roboto-Regular.ttf differ diff --git a/core/lib/presentation/constants/constants_ui.dart b/core/lib/presentation/constants/constants_ui.dart index db77e2f64..7eae78c6c 100644 --- a/core/lib/presentation/constants/constants_ui.dart +++ b/core/lib/presentation/constants/constants_ui.dart @@ -1,5 +1,27 @@ +import 'package:core/utils/platform_info.dart'; + class ConstantsUI { static const String fontApp = 'Inter'; + static final List? fontFamilyFallback = PlatformInfo.isMobile + ? null + : webFontFamilyFallback; + + static const List webFontFamilyFallback = [ + 'Roboto', // Default Flutter font – Latin, Cyrillic, Diacritics + 'NotoSans', // Latin, Cyrillic – supports European languages + 'NotoSansArabic', // Arabic script + 'NotoSansTamil', // Tamil script + 'NotoSansThai', // Thai script + 'NotoSansKR', // Korean + 'NotoSansSC', // Simplified Chinese (zh_Hans) + 'NotoSansMath', // Math symbols (∑, ∫, √, etc.) + 'NotoSansEgyptianHieroglyphs', // Egyptian Hieroglyphs (𓀀) + 'NotoEmoji', // Monochrome emoji + 'NotoSansSymbols', // Miscellaneous symbols and arrows + 'NotoSansSymbols2', // Extended symbol support + 'sans-serif', // Generic fallback for any platform + ]; + static const double htmlContentMaxHeight = 22000.0; static const double composerHtmlContentMaxHeight = 20000.0; static const double htmlContentMinWidth = 300; diff --git a/core/lib/presentation/utils/theme_utils.dart b/core/lib/presentation/utils/theme_utils.dart index a2a8d7d0d..db0b6bf7a 100644 --- a/core/lib/presentation/utils/theme_utils.dart +++ b/core/lib/presentation/utils/theme_utils.dart @@ -10,6 +10,7 @@ class ThemeUtils { return ThemeData( scaffoldBackgroundColor: Colors.white, fontFamily: ConstantsUI.fontApp, + fontFamilyFallback: ConstantsUI.fontFamilyFallback, appBarTheme: _appBarTheme, textTheme: _textTheme, hoverColor: Theme.of(context).colorScheme.outline.withValues(alpha: 0.08), @@ -23,97 +24,80 @@ class ThemeUtils { ); } - static TextTheme get _textTheme { - return const TextTheme( - bodyLarge: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w500, - letterSpacing: -0.15, - fontSize: 17, - height: 24 / 17, - ), - bodyMedium: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w500, - letterSpacing: 0.25, - ), - bodySmall: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w400, - letterSpacing: 0.0, - fontSize: 13, - height: 16 / 13 - ), - labelLarge: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w500, - letterSpacing: 0.1, - ), - labelSmall: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w500, - letterSpacing: 0.5, - ), - displayLarge: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w700, - ), - displayMedium: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w600, - letterSpacing: 0.4, - ), - displaySmall: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w600, - letterSpacing: 0.4, - ), - headlineMedium: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w600, - ), - headlineSmall: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w600, - fontSize: 24, - height: 32 / 24, - letterSpacing: 0.0, - ), - headlineLarge: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w600, - fontSize: 32, - ), - titleLarge: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w600, - letterSpacing: 0.0, - fontSize: 22, - height: 28 / 22, - ), - titleMedium: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w500, - letterSpacing: 0.15, - fontSize: 16, - height: 24 / 16, - ), - titleSmall: TextStyle( - fontFamily: ConstantsUI.fontApp, - fontWeight: FontWeight.w500, - letterSpacing: 0.1, - fontSize: 14, - height: 20 / 14, - ), - ); - } + static const TextTheme _textTheme = TextTheme( + bodyLarge: TextStyle( + fontWeight: FontWeight.w500, + letterSpacing: -0.15, + fontSize: 17, + height: 24 / 17, + ), + bodyMedium: TextStyle( + fontWeight: FontWeight.w500, + letterSpacing: 0.25, + ), + bodySmall: TextStyle( + fontWeight: FontWeight.w400, + letterSpacing: 0.0, + fontSize: 13, + height: 16 / 13 + ), + labelLarge: TextStyle( + fontWeight: FontWeight.w500, + letterSpacing: 0.1, + ), + labelSmall: TextStyle( + fontWeight: FontWeight.w500, + letterSpacing: 0.5, + ), + displayLarge: TextStyle( + fontWeight: FontWeight.w700, + ), + displayMedium: TextStyle( + fontWeight: FontWeight.w600, + letterSpacing: 0.4, + ), + displaySmall: TextStyle( + fontWeight: FontWeight.w600, + letterSpacing: 0.4, + ), + headlineMedium: TextStyle( + fontWeight: FontWeight.w600, + ), + headlineSmall: TextStyle( + fontWeight: FontWeight.w600, + fontSize: 24, + height: 32 / 24, + letterSpacing: 0.0, + ), + headlineLarge: TextStyle( + fontWeight: FontWeight.w600, + fontSize: 32, + ), + titleLarge: TextStyle( + fontWeight: FontWeight.w600, + letterSpacing: 0.0, + fontSize: 22, + height: 28 / 22, + ), + titleMedium: TextStyle( + fontWeight: FontWeight.w500, + letterSpacing: 0.15, + fontSize: 16, + height: 24 / 16, + ), + titleSmall: TextStyle( + fontWeight: FontWeight.w500, + letterSpacing: 0.1, + fontSize: 14, + height: 20 / 14, + ), + ); static TextStyle textStyleBodyBody1({ Color? color, FontWeight? fontWeight, double? fontSize, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w500, letterSpacing: 0.0, fontSize: fontSize ?? 16, @@ -125,8 +109,7 @@ class ThemeUtils { Color? color, Color? backgroundColor, FontWeight? fontWeight, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w400, letterSpacing: 0.0, fontSize: 15, @@ -138,8 +121,7 @@ class ThemeUtils { static TextStyle textStyleBodyBody3({ Color? color, FontWeight? fontWeight, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w400, letterSpacing: 0.0, fontSize: 14, @@ -151,8 +133,7 @@ class ThemeUtils { Color? color, Color? backgroundColor, FontWeight? fontWeight, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w600, letterSpacing: 0.0, fontSize: 15, @@ -164,8 +145,7 @@ class ThemeUtils { static TextStyle textStyleHeadingH6({ Color? color, FontWeight? fontWeight, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w700, letterSpacing: 0.0, fontSize: 20, @@ -176,8 +156,7 @@ class ThemeUtils { static TextStyle textStyleHeadingH5({ Color? color, FontWeight? fontWeight, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w500, letterSpacing: 0.0, fontSize: 24, @@ -188,8 +167,7 @@ class ThemeUtils { static TextStyle textStyleHeadingH4({ Color? color, FontWeight? fontWeight, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w500, letterSpacing: 0.0, fontSize: 32, @@ -200,8 +178,7 @@ class ThemeUtils { static TextStyle textStyleHeadingHeadingSmall({ Color? color, FontWeight? fontWeight, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: fontWeight ?? FontWeight.w500, letterSpacing: 0.0, fontSize: 17, @@ -209,8 +186,7 @@ class ThemeUtils { color: color, ); - static const textStyleM3HeadlineSmall = TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleM3HeadlineSmall = defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w600, letterSpacing: 0.0, fontSize: 24, @@ -221,8 +197,7 @@ class ThemeUtils { static TextStyle textStyleInter700({ Color? color, double? fontSize, - }) => TextStyle( - fontFamily: ConstantsUI.fontApp, + }) => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w700, letterSpacing: 0.0, fontSize: fontSize ?? 15, @@ -230,8 +205,7 @@ class ThemeUtils { color: color ?? Colors.black, ); - static TextStyle textStyleInter500() => const TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleInter500() => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w500, letterSpacing: 0.0, fontSize: 14, @@ -239,8 +213,7 @@ class ThemeUtils { color: Colors.black, ); - static const TextStyle textStyleInter400 = TextStyle( - fontFamily: ConstantsUI.fontApp, + static final TextStyle textStyleInter400 = defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.normal, letterSpacing: -0.13, fontSize: 13, @@ -248,8 +221,7 @@ class ThemeUtils { color: Colors.black, ); - static TextStyle textStyleM3LabelLarge({Color? color}) => TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleM3LabelLarge({Color? color}) => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w500, letterSpacing: 0.1, fontSize: 14, @@ -257,8 +229,7 @@ class ThemeUtils { color: color ?? AppColor.primaryMain, ); - static TextStyle get textStyleM3LabelSmall => const TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle get textStyleM3LabelSmall => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w500, letterSpacing: 0.5, fontSize: 11, @@ -266,8 +237,7 @@ class ThemeUtils { color: AppColor.m3Tertiary, ); - static TextStyle get textStyleM3TitleSmall => const TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle get textStyleM3TitleSmall => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w500, letterSpacing: 0.1, fontSize: 14, @@ -275,8 +245,7 @@ class ThemeUtils { color: AppColor.m3Tertiary20, ); - static const TextStyle textStyleM3BodyMedium1 = TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleM3BodyMedium1 = defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w400, letterSpacing: -0.15, fontSize: 16, @@ -284,8 +253,7 @@ class ThemeUtils { color: AppColor.textPrimary, ); - static const TextStyle textStyleM3BodyMedium3 = TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleM3BodyMedium3 = defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w400, letterSpacing: 0.25, fontSize: 14, @@ -293,8 +261,7 @@ class ThemeUtils { color: AppColor.m3SurfaceBackground, ); - static final TextStyle textStyleM3BodyMedium = TextStyle( - fontFamily: ConstantsUI.fontApp, + static final TextStyle textStyleM3BodyMedium = defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w500, letterSpacing: 0.25, fontSize: 14, @@ -302,8 +269,7 @@ class ThemeUtils { color: AppColor.textSecondary.withValues(alpha: 0.48), ); - static const TextStyle textStyleM3BodyLarge = TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleM3BodyLarge = defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w500, letterSpacing: -0.15, fontSize: 17, @@ -311,8 +277,7 @@ class ThemeUtils { color: AppColor.m3SurfaceBackground, ); - static TextStyle textStyleAppShortcut() => const TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleAppShortcut() => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.normal, letterSpacing: 0.0, fontSize: 12, @@ -320,8 +285,7 @@ class ThemeUtils { color: AppColor.textPrimary, ); - static TextStyle textStyleContentCaption() => const TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleContentCaption() => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.normal, letterSpacing: 0, fontSize: 11, @@ -329,8 +293,7 @@ class ThemeUtils { color: AppColor.steelGray400, ); - static TextStyle textStyleInter600() => TextStyle( - fontFamily: ConstantsUI.fontApp, + static TextStyle textStyleInter600() => defaultTextStyleInterFont.copyWith( fontWeight: FontWeight.w600, letterSpacing: 0.0, fontSize: 24, @@ -338,8 +301,9 @@ class ThemeUtils { color: AppColor.gray424244.withValues(alpha: 0.9), ); - static const TextStyle defaultTextStyleInterFont = TextStyle( + static TextStyle defaultTextStyleInterFont = TextStyle( fontFamily: ConstantsUI.fontApp, + fontFamilyFallback: ConstantsUI.fontFamilyFallback, ); static TextSelectionThemeData get _textSelectionTheme { @@ -350,26 +314,22 @@ class ThemeUtils { ); } - static AppBarTheme get _appBarTheme { - return AppBarTheme( - color: Colors.white, - elevation: 0, - systemOverlayStyle: SystemUiOverlayStyle.light, - iconTheme: const IconThemeData(color: Colors.black), - titleTextStyle: defaultTextStyleInterFont.copyWith( - color: const Color(0XFF8B8B8B), - fontSize: 18, - ), - toolbarTextStyle: defaultTextStyleInterFont, - ); - } + static final AppBarTheme _appBarTheme = AppBarTheme( + color: Colors.white, + elevation: 0, + systemOverlayStyle: SystemUiOverlayStyle.light, + iconTheme: const IconThemeData(color: Colors.black), + titleTextStyle: defaultTextStyleInterFont.copyWith( + color: const Color(0XFF8B8B8B), + fontSize: 18, + ), + toolbarTextStyle: defaultTextStyleInterFont, + ); - static DividerThemeData get _dividerTheme { - return const DividerThemeData( - color: AppColor.colorDivider, - space: 0 - ); - } + static const DividerThemeData _dividerTheme = DividerThemeData( + color: AppColor.colorDivider, + space: 0 + ); static void setSystemLightUIStyle() { SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle( diff --git a/core/lib/presentation/views/html_viewer/html_content_viewer_on_web_widget.dart b/core/lib/presentation/views/html_viewer/html_content_viewer_on_web_widget.dart index 1783b4f40..84ee937ac 100644 --- a/core/lib/presentation/views/html_viewer/html_content_viewer_on_web_widget.dart +++ b/core/lib/presentation/views/html_viewer/html_content_viewer_on_web_widget.dart @@ -22,7 +22,7 @@ class HtmlContentViewerOnWeb extends StatefulWidget { final double heightContent; final TextDirection? direction; final double? contentPadding; - final bool useDefaultFont; + final bool useDefaultFontStyle; /// Handler for mailto: links final OnMailtoClicked? mailtoDelegate; @@ -49,7 +49,7 @@ class HtmlContentViewerOnWeb extends StatefulWidget { required this.widthContent, this.heightContent = 200, this.allowResizeToDocumentSize = true, - this.useDefaultFont = false, + this.useDefaultFontStyle = false, this.mailtoDelegate, this.direction, this.onClickHyperLinkAction, @@ -360,7 +360,7 @@ class _HtmlContentViewerOnWebState extends State javaScripts: combinedScripts, direction: widget.direction, contentPadding: widget.contentPadding, - useDefaultFont: widget.useDefaultFont, + useDefaultFontStyle: widget.useDefaultFontStyle, ); return htmlTemplate; diff --git a/core/lib/presentation/views/html_viewer/html_content_viewer_widget.dart b/core/lib/presentation/views/html_viewer/html_content_viewer_widget.dart index a78e8b89c..181f0c3f5 100644 --- a/core/lib/presentation/views/html_viewer/html_content_viewer_widget.dart +++ b/core/lib/presentation/views/html_viewer/html_content_viewer_widget.dart @@ -29,7 +29,7 @@ class HtmlContentViewer extends StatefulWidget { final TextDirection? direction; final bool keepWidthWhileLoading; final double? contentPadding; - final bool useDefaultFont; + final bool useDefaultFontStyle; final double? maxHtmlContentHeight; final double htmlContentMinHeight; final double offsetHtmlContentHeight; @@ -56,7 +56,7 @@ class HtmlContentViewer extends StatefulWidget { this.enableQuoteToggle = false, this.keepWidthWhileLoading = false, this.contentPadding, - this.useDefaultFont = false, + this.useDefaultFontStyle = false, this.disableScrolling = false, this.maxViewHeight, this.maxHtmlContentHeight, @@ -150,7 +150,7 @@ class HtmlContentViewState extends State with AutomaticKeepAl javaScripts: combinedScripts, styleCSS: combinedCss, contentPadding: widget.contentPadding, - useDefaultFont: widget.useDefaultFont, + useDefaultFontStyle: widget.useDefaultFontStyle, ); } diff --git a/core/lib/presentation/views/html_viewer/ios_html_content_viewer_widget.dart b/core/lib/presentation/views/html_viewer/ios_html_content_viewer_widget.dart index 2880ab5cf..126c4ed1a 100644 --- a/core/lib/presentation/views/html_viewer/ios_html_content_viewer_widget.dart +++ b/core/lib/presentation/views/html_viewer/ios_html_content_viewer_widget.dart @@ -15,7 +15,7 @@ class IosHtmlContentViewerWidget extends StatefulWidget { final String contentHtml; final TextDirection? direction; - final bool useDefaultFont; + final bool useDefaultFontStyle; final OnMailtoDelegateAction? onMailtoDelegateAction; final OnPreviewEMLDelegateAction? onPreviewEMLDelegateAction; final OnDownloadAttachmentDelegateAction? onDownloadAttachmentDelegateAction; @@ -24,7 +24,7 @@ class IosHtmlContentViewerWidget extends StatefulWidget { Key? key, required this.contentHtml, this.direction, - this.useDefaultFont = false, + this.useDefaultFontStyle = true, this.onMailtoDelegateAction, this.onPreviewEMLDelegateAction, this.onDownloadAttachmentDelegateAction, @@ -53,7 +53,7 @@ class _IosHtmlContentViewerWidgetState extends State content: widget.contentHtml, direction: widget.direction, javaScripts: HtmlInteraction.scriptsHandleLazyLoadingBackgroundImage, - useDefaultFont: widget.useDefaultFont, + useDefaultFontStyle: widget.useDefaultFontStyle, )); } diff --git a/core/lib/utils/html/html_template.dart b/core/lib/utils/html/html_template.dart index e0c8e4035..ce0574d67 100644 --- a/core/lib/utils/html/html_template.dart +++ b/core/lib/utils/html/html_template.dart @@ -1,6 +1,7 @@ +import 'package:flutter/material.dart'; + class HtmlTemplate { - static const String fontLink = ''; static const String nameClassToolTip = 'tmail-tooltip'; static const String tooltipLinkCss = ''' .$nameClassToolTip .tooltiptext { @@ -66,10 +67,54 @@ class HtmlTemplate { '''; + static const String fontFaceStyle = ''' + @font-face { + font-family: 'Inter'; + src: url("/assets/fonts/Inter/Inter-Regular.ttf") format("truetype"); + font-weight: 400; + font-style: normal; + } + + @font-face { + font-family: 'Inter'; + src: url("/assets/fonts/Inter/Inter-Medium.ttf") format("truetype"); + font-weight: 500; + font-style: medium; + } + + @font-face { + font-family: 'Inter'; + src: url("/assets/fonts/Inter/Inter-SemiBold.ttf") format("truetype"); + font-weight: 600; + font-style: semi-bold; + } + + @font-face { + font-family: 'Inter'; + src: url("/assets/fonts/Inter/Inter-Bold.ttf") format("truetype"); + font-weight: 700; + font-style: bold; + } + + body { + font-family: 'Inter', sans-serif; + } + '''; + + static const String defaultFontStyle = ''' + body { + font-weight: 400; + font-size: 16px; + line-height: 24px; + letter-spacing: -0.01em; /* -1% */ + } + '''; + static const String previewEMLFileCssStyle = ''' '''; + static String mobileCustomInternalStyleCSS({ + bool useDefaultFontStyle = false, + TextDirection direction = TextDirection.ltr, + }) => ''' + ${HtmlTemplate.fontFaceStyle} + + ${useDefaultFontStyle ? HtmlTemplate.defaultFontStyle : ''} + + #editor { + direction: ${direction.name}; + } + + #editor .tmail-signature { + text-align: ${direction == TextDirection.rtl ? 'right' : 'left'}; + } + '''; + static const String disableScrollingStyleCSS = ''' html, body { overflow: hidden; diff --git a/core/lib/utils/html/html_utils.dart b/core/lib/utils/html/html_utils.dart index 7a67a44aa..e6afbdb5e 100644 --- a/core/lib/utils/html/html_utils.dart +++ b/core/lib/utils/html/html_utils.dart @@ -1,6 +1,7 @@ import 'dart:convert'; import 'dart:math'; +import 'package:core/utils/html/html_template.dart'; import 'package:html_unescape/html_unescape.dart'; import 'js_interop_stub.dart' if (dart.library.html) 'dart:js_interop'; @@ -9,7 +10,6 @@ import 'dart:typed_data'; import 'package:core/data/constants/constant.dart'; import 'package:core/presentation/extensions/html_extension.dart'; import 'package:core/utils/app_logger.dart'; -import 'package:core/utils/platform_info.dart'; import 'package:flutter/material.dart'; import 'package:universal_html/html.dart' as html; @@ -41,72 +41,43 @@ class HtmlUtils { editor.parentNode.replaceChild(newEditor, editor);''', name: 'unregisterDropListener'); - static String customCssStyleHtmlEditor({ + static String customInlineBodyCssStyleHtmlEditor({ TextDirection direction = TextDirection.ltr, - bool useDefaultFont = false, double? horizontalPadding, }) { - if (PlatformInfo.isWeb) { - return ''' - - '''; - } else if (PlatformInfo.isMobile) { - return ''' - ${useDefaultFont ? ''' - body { - font-family: Arial, 'Inter', sans-serif; - font-weight: 500; - font-size: 16px; - line-height: 24px; - } - ''' : ''} - - #editor { - direction: ${direction.name}; - } - - #editor .tmail-signature { - text-align: ${direction == TextDirection.rtl ? 'right' : 'left'}; - } - '''; - } else { - return ''; - } + + '''; } static String validateHtmlImageResourceMimeType(String mimeType) { @@ -134,7 +105,7 @@ class HtmlUtils { String? styleCSS, String? javaScripts, bool hideScrollBar = true, - bool useDefaultFont = false, + bool useDefaultFontStyle = false, TextDirection? direction, double? contentPadding, }) { @@ -144,18 +115,11 @@ class HtmlUtils { - ${useDefaultFont && PlatformInfo.isMobile - ? '' - : ''}