TF-736 Display header style button on composer web

core/lib/presentation/extensions/color_extension.dart

@@ -123,6 +123,9 @@ extension AppColor on Color {
   static const colorBackgroundTagFilter = Color(0x6D7885);
   static const colorDefaultRichTextButton = Color(0xFF99A2AD);
   static const colorFocusRichTextButton = Color(0x146D7885);
+  static const colorStyleBlockQuote = Color(0xFFEEEEEE);
+  static const colorBorderStyleCode = Color(0xFFCCCCCC);
+  static const colorBackgroundStyleCode = Color(0xFFF5F5F5);
 
   static const mapGradientColor = [
     [Color(0xFF21D4FD), Color(0xFFB721FF)],

core/lib/presentation/utils/html_transformer/html_template.dart

@@ -62,4 +62,30 @@ String generateHtml(String content, {
     </body>
     </html> 
   ''';
-}
+}
+
+final bodyCssStyleForEditor = '''
+  <style>
+      blockquote {
+        margin-left: 8px;
+        margin-right: 8px;
+        padding-left: 12px;
+        padding-right: 12px;
+        border-left: 5px solid #eee;
+      }
+      pre {
+        display: block;
+        padding: 10px;
+        margin: 0 0 10px;
+        font-size: 13px;
+        line-height: 1.5;
+        color: #333;
+        word-break: break-all;
+        word-wrap: break-word;
+        background-color: #f5f5f5;
+        border: 1px solid #ccc;
+        border-radius: 4px;
+        overflow: auto;
+      }
+  </style>
+''';