refactor: create SendPageTheme

lib/src/screens/buy/pre_order_page.dart

@@ -5,6 +5,7 @@ import 'package:cake_wallet/entities/fiat_currency.dart';
 import 'package:cake_wallet/src/widgets/picker.dart';
 import 'package:cake_wallet/themes/extensions/exchange_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/keyboard_theme.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 import 'package:cw_core/wallet_type.dart';
 import 'package:cake_wallet/src/screens/buy/widgets/buy_list_item.dart';
 import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
@@ -103,10 +104,8 @@ class PreOrderPage extends BasePage {
                           bottomLeft: Radius.circular(24),
                           bottomRight: Radius.circular(24)),
                       gradient: LinearGradient(colors: [
-                        Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+                        Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-                        Theme.of(context)
+                        Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
-                            .primaryTextTheme!.titleMedium!
-                            .decorationColor!,
                       ], begin: Alignment.topLeft, end: Alignment.bottomRight),
                     ),
                   child: Padding(
@@ -165,7 +164,7 @@ class PreOrderPage extends BasePage {
                           borderWidth: 0.5,
                           textStyle: TextStyle(fontSize: 36, fontWeight: FontWeight.w500, color: Colors.white),
                           placeholderTextStyle: TextStyle(
-                            color: Theme.of(context).primaryTextTheme!.headlineSmall!.decorationColor!,
+                            color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor,
                             fontWeight: FontWeight.w500,
                             fontSize: 36,
                           ),

lib/src/screens/exchange/widgets/exchange_card.dart

@@ -13,6 +13,7 @@ import 'package:cw_core/crypto_currency.dart';
 import 'package:cake_wallet/src/widgets/address_text_field.dart';
 import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
 import 'package:cake_wallet/src/screens/exchange/widgets/currency_picker.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class ExchangeCard extends StatefulWidget {
   ExchangeCard(
@@ -161,7 +162,7 @@ class ExchangeCardState extends State<ExchangeCard> {
     final copyImage = Image.asset('assets/images/copy_content.png',
         height: 16,
         width: 16,
-        color: Theme.of(context).primaryTextTheme!.displaySmall!.color!);
+        color: Theme.of(context).extension<SendPageTheme>()!.estimatedFeeColor);
 
     return Container(
       width: double.infinity,
@@ -212,10 +213,7 @@ class ExchangeCardState extends State<ExchangeCard> {
                     height: 32,
                     decoration: BoxDecoration(
                         color: widget.addressButtonsColor ??
-                            Theme.of(context)
+                            Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
-                                .primaryTextTheme!
-                                .headlineMedium!
-                                .color!,
                         borderRadius:
                         BorderRadius.all(Radius.circular(6))),
                     child: Center(
@@ -225,10 +223,7 @@ class ExchangeCardState extends State<ExchangeCard> {
                             style: TextStyle(
                                 fontSize: 12,
                                 fontWeight: FontWeight.bold,
-                                color: Theme.of(context)
+                                color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor)),
-                                    .primaryTextTheme!
-                                    .headlineMedium!
-                                    .decorationColor!)),
                       ),
                     ),
                   ),
@@ -280,10 +275,7 @@ class ExchangeCardState extends State<ExchangeCard> {
                           height: 32,
                           width: 32,
                           decoration: BoxDecoration(
-                              color: Theme.of(context)
+                              color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
-                                  .primaryTextTheme!
-                                  .headlineMedium!
-                                  .color!,
                               borderRadius:
                               BorderRadius.all(Radius.circular(6))),
                           child: InkWell(
@@ -294,10 +286,7 @@ class ExchangeCardState extends State<ExchangeCard> {
                                   style: TextStyle(
                                       fontSize: 12,
                                       fontWeight: FontWeight.bold,
-                                      color: Theme.of(context)
+                                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor)),
-                                          .primaryTextTheme!
-                                          .headlineMedium!
-                                          .decorationColor!)),
                             ),
                           ),
                         )
@@ -308,10 +297,7 @@ class ExchangeCardState extends State<ExchangeCard> {
             )),
         Divider(
             height: 1,
-            color: Theme.of(context)
+            color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor),
-                .primaryTextTheme!
-                .headlineSmall!
-                .decorationColor!),
         Padding(
           padding: EdgeInsets.only(top: 5),
           child: Container(
@@ -458,10 +444,7 @@ class ExchangeCardState extends State<ExchangeCard> {
                                                                   6))),
                                                   child: Image.asset(
                                                     'assets/images/open_book.png',
-                                                    color: Theme.of(context)
+                                                    color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                                                        .primaryTextTheme!
-                                                        .headlineMedium!
-                                                        .decorationColor!,
                                                   )),
                                             )),
                                       ),

lib/src/screens/ionia/cards/ionia_account_page.dart

@@ -8,6 +8,7 @@ import 'package:cake_wallet/typography.dart';
 import 'package:cake_wallet/view_model/ionia/ionia_account_view_model.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class IoniaAccountPage extends BasePage {
   IoniaAccountPage(this.ioniaAccountViewModel);
@@ -164,8 +165,8 @@ class _GradiantContainer extends StatelessWidget {
         borderRadius: BorderRadius.circular(15),
         gradient: LinearGradient(
           colors: [
-            Theme.of(context).primaryTextTheme!.titleMedium!.decorationColor!,
+            Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
-            Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+            Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
           ],
           begin: Alignment.topRight,
           end: Alignment.bottomLeft,

lib/src/screens/ionia/cards/ionia_buy_card_detail_page.dart

@@ -19,6 +19,7 @@ import 'package:flutter_mobx/flutter_mobx.dart';
 import 'package:mobx/mobx.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
 import 'package:cake_wallet/src/screens/send/widgets/confirm_sending_alert.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class IoniaBuyGiftCardDetailPage extends BasePage {
   IoniaBuyGiftCardDetailPage(this.ioniaPurchaseViewModel);
@@ -97,8 +98,8 @@ class IoniaBuyGiftCardDetailPage extends BasePage {
                   borderRadius: BorderRadius.circular(20),
                   gradient: LinearGradient(
                     colors: [
-                      Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+                      Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-                      Theme.of(context).primaryTextTheme!.titleMedium!.decorationColor!,
+                      Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
                     ],
                     begin: Alignment.topLeft,
                     end: Alignment.bottomRight,
@@ -460,8 +461,8 @@ class TipButton extends StatelessWidget {
           gradient: isSelected
               ? LinearGradient(
                   colors: [
-                    Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+                    Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-                    Theme.of(context).primaryTextTheme!.titleMedium!.decorationColor!,
+                    Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
                   ],
                   begin: Alignment.topLeft,
                   end: Alignment.bottomRight,

lib/src/screens/ionia/cards/ionia_buy_gift_card.dart

@@ -14,6 +14,7 @@ import 'package:flutter/services.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
 import 'package:keyboard_actions/keyboard_actions.dart';
 import 'package:cake_wallet/generated/i18n.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class IoniaBuyGiftCardPage extends BasePage {
   IoniaBuyGiftCardPage(
@@ -73,11 +74,8 @@ class IoniaBuyGiftCardPage extends BasePage {
                     bottomRight: Radius.circular(24),
                   ),
                   gradient: LinearGradient(colors: [
-                    Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+                    Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-                    Theme.of(context)
+                    Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
-                        .primaryTextTheme!
-                        .titleMedium!
-                        .decorationColor!,
                   ], begin: Alignment.topLeft, end: Alignment.bottomRight),
                 ),
                 child: Column(
@@ -99,10 +97,7 @@ class IoniaBuyGiftCardPage extends BasePage {
                         ],
                         hintText: '1000',
                         placeholderTextStyle: TextStyle(
-                          color: Theme.of(context)
+                          color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                              .primaryTextTheme!
-                              .headlineSmall!
-                              .color!,
                           fontWeight: FontWeight.w600,
                           fontSize: 36,
                         ),
@@ -122,10 +117,7 @@ class IoniaBuyGiftCardPage extends BasePage {
                       ),
                     ),
                     Divider(
-                      color: Theme.of(context)
+                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                          .primaryTextTheme!
-                          .headlineSmall!
-                          .color!,
                       height: 1,
                     ),
                     SizedBox(height: 8),
@@ -136,19 +128,13 @@ class IoniaBuyGiftCardPage extends BasePage {
                         Text(
                           S.of(context).min_amount(merchant.minimumCardPurchase.toStringAsFixed(2)),
                           style: TextStyle(
-                            color: Theme.of(context)
+                            color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                .primaryTextTheme!
-                                .headlineSmall!
-                                .color!,
                           ),
                         ),
                         Text(
                           S.of(context).max_amount(merchant.maximumCardPurchase.toStringAsFixed(2)),
                           style: TextStyle(
-                            color: Theme.of(context)
+                            color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                .primaryTextTheme!
-                                .headlineSmall!
-                                .color!,
                           ),
                         ),
                       ],

lib/src/screens/ionia/cards/ionia_custom_redeem_page.dart

@@ -13,6 +13,7 @@ import 'package:flutter/services.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
 import 'package:keyboard_actions/keyboard_actions.dart';
 import 'package:cake_wallet/generated/i18n.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class IoniaCustomRedeemPage extends BasePage {
   IoniaCustomRedeemPage(
@@ -71,11 +72,8 @@ class IoniaCustomRedeemPage extends BasePage {
                   borderRadius: BorderRadius.only(
                       bottomLeft: Radius.circular(24), bottomRight: Radius.circular(24)),
                   gradient: LinearGradient(colors: [
-                    Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+                    Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-                    Theme.of(context)
+                    Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
-                        .primaryTextTheme!
-                        .titleMedium!
-                        .decorationColor!,
                   ], begin: Alignment.topLeft, end: Alignment.bottomRight),
                 ),
                 child: Column(
@@ -90,17 +88,11 @@ class IoniaCustomRedeemPage extends BasePage {
                       inputFormatters: [FilteringTextInputFormatter.deny(RegExp('[\-|\ ]'))],
                       hintText: '1000',
                       placeholderTextStyle: TextStyle(
-                        color: Theme.of(context)
+                        color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                            .primaryTextTheme!
-                            .headlineSmall!
-                            .color!,
                         fontWeight: FontWeight.w500,
                         fontSize: 36,
                       ),
-                      borderColor: Theme.of(context)
+                      borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                          .primaryTextTheme!
-                          .headlineSmall!
-                          .color!,
                       textColor: Colors.white,
                       textStyle: TextStyle(
                         color: Colors.white,
@@ -131,10 +123,7 @@ class IoniaCustomRedeemPage extends BasePage {
                               child: Text(
                                 '\$${giftCard.remainingAmount} - \$${ioniaCustomRedeemViewModel.amount} = \$${ioniaCustomRedeemViewModel.formattedRemaining} ${S.of(context).remaining}',
                                 style: TextStyle(
-                                  color: Theme.of(context)
+                                  color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                      .primaryTextTheme!
-                                      .headlineSmall!
-                                      .color!,
                                 ),
                               ),
                             )

lib/src/screens/ionia/cards/ionia_custom_tip_page.dart

@@ -13,6 +13,7 @@ import 'package:flutter/services.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
 import 'package:keyboard_actions/keyboard_actions.dart';
 import 'package:cake_wallet/generated/i18n.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class IoniaCustomTipPage extends BasePage {
   IoniaCustomTipPage(
@@ -71,11 +72,8 @@ class IoniaCustomTipPage extends BasePage {
                 decoration: BoxDecoration(
                   borderRadius: BorderRadius.only(bottomLeft: Radius.circular(24), bottomRight: Radius.circular(24)),
                   gradient: LinearGradient(colors: [
-                    Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+                    Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-                    Theme.of(context)
+                    Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
-                        .primaryTextTheme!
-                        .titleMedium!
-                        .decorationColor!,
                   ], begin: Alignment.topLeft, end: Alignment.bottomRight),
                 ),
                 child: Column(
@@ -90,17 +88,11 @@ class IoniaCustomTipPage extends BasePage {
                       inputFormatters: [FilteringTextInputFormatter.deny(RegExp('[\-|\ ]'))],
                       hintText: '1000',
                       placeholderTextStyle: TextStyle(
-                        color: Theme.of(context)
+                        color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                            .primaryTextTheme!
-                            .headlineSmall!
-                            .color!,
                         fontWeight: FontWeight.w500,
                         fontSize: 36,
                       ),
-                      borderColor: Theme.of(context)
+                      borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                          .primaryTextTheme!
-                          .headlineSmall!
-                          .color!,
                       textColor: Colors.white,
                       textStyle: TextStyle(
                         color: Colors.white,
@@ -135,10 +127,7 @@ class IoniaCustomTipPage extends BasePage {
                         text: TextSpan(
                           text: '\$${_amountController.text}',
                           style: TextStyle(
-                            color: Theme.of(context)
+                            color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                .primaryTextTheme!
-                                .headlineSmall!
-                                .color!,
                           ),
                           children: [
                             TextSpan(text: ' ${S.of(context).is_percentage} '),

lib/src/screens/ionia/cards/ionia_debit_card_page.dart

@@ -13,6 +13,7 @@ import 'package:cake_wallet/view_model/ionia/ionia_gift_cards_list_view_model.da
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class IoniaDebitCardPage extends BasePage {
   final IoniaGiftCardsListViewModel _cardsListViewModel;
@@ -275,8 +276,8 @@ class _IoniaDebitCardState extends State<_IoniaDebitCard> {
         borderRadius: BorderRadius.circular(24),
         gradient: LinearGradient(
           colors: [
-            Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+            Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-            Theme.of(context).primaryTextTheme!.titleMedium!.decorationColor!,
+            Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
           ],
           begin: Alignment.topLeft,
           end: Alignment.bottomRight,

lib/src/screens/new_wallet/new_wallet_page.dart

@@ -18,6 +18,7 @@ import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
 import 'package:cake_wallet/core/execution_state.dart';
 import 'package:cake_wallet/view_model/wallet_new_vm.dart';
 import 'package:cake_wallet/themes/extensions/new_wallet_theme.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class NewWalletPage extends BasePage {
   NewWalletPage(this._walletNewVM);
@@ -161,10 +162,7 @@ class _WalletNameFormState extends State<WalletNameForm> {
                                     height: 34,
                                     child: Image.asset(
                                       'assets/images/refresh_icon.png',
-                                      color: Theme.of(context)
+                                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                                          .primaryTextTheme!
-                                          .headlineMedium!
-                                          .decorationColor!,
                                     ),
                                   ),
                                 ),

lib/src/screens/receive/widgets/anonpay_currency_input_field.dart

@@ -4,6 +4,7 @@ import 'package:cake_wallet/themes/extensions/exchange_page_theme.dart';
 import 'package:cw_core/currency.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class AnonpayCurrencyInputField extends StatelessWidget {
   const AnonpayCurrencyInputField(
@@ -66,10 +67,7 @@ class AnonpayCurrencyInputField extends StatelessWidget {
                           child: Container(
                             height: 32,
                             decoration: BoxDecoration(
-                                color: Theme.of(context)
+                                color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
-                                    .primaryTextTheme!
-                                    .headlineMedium!
-                                    .color!,
                                 borderRadius: BorderRadius.all(Radius.circular(6))),
                             child: Center(
                               child: Padding(
@@ -79,10 +77,7 @@ class AnonpayCurrencyInputField extends StatelessWidget {
                                   style: TextStyle(
                                     fontSize: 12,
                                     fontWeight: FontWeight.bold,
-                                    color: Theme.of(context)
+                                    color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                                        .primaryTextTheme!
-                                        .headlineMedium!
-                                        .decorationColor!,
                                   ),
                                 ),
                               ),

lib/src/screens/receive/widgets/currency_input_field.dart

@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:cake_wallet/themes/extensions/dashboard_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/picker_theme.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class CurrencyInputField extends StatelessWidget {
   const CurrencyInputField({
@@ -48,7 +49,7 @@ class CurrencyInputField extends StatelessWidget {
               placeholderTextStyle: isLight
                   ? null
                   : TextStyle(
-                      color: Theme.of(context).primaryTextTheme!.headlineSmall!.color!,
+                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
                       fontWeight: FontWeight.w600,
                     ),
               borderColor: Theme.of(context).extension<PickerTheme>()!.dividerColor,
@@ -85,7 +86,7 @@ class CurrencyInputField extends StatelessWidget {
                               padding: const EdgeInsets.only(right: 3.0),
                               child: Container(
                                 decoration: BoxDecoration(
-                                  color: Theme.of(context).primaryTextTheme!.headlineMedium!.color!,
+                                  color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
                                   borderRadius: BorderRadius.all(
                                     Radius.circular(6),
                                   ),
@@ -96,10 +97,7 @@ class CurrencyInputField extends StatelessWidget {
                                     style: TextStyle(
                                       fontSize: 12,
                                       fontWeight: FontWeight.bold,
-                                      color: Theme.of(context)
+                                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                                          .primaryTextTheme!
-                                          .headlineMedium!
-                                          .decorationColor!,
                                     ),
                                   ),
                                 ),

lib/src/screens/restore/wallet_restore_from_keys_form.dart

@@ -10,6 +10,7 @@ import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/core/wallet_name_validator.dart';
 import 'package:cake_wallet/entities/generate_name.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class WalletRestoreFromKeysFrom extends StatefulWidget {
   WalletRestoreFromKeysFrom({
@@ -89,10 +90,7 @@ class WalletRestoreFromKeysFromState extends State<WalletRestoreFromKeysFrom> {
                       height: 34,
                       child: Image.asset(
                         'assets/images/refresh_icon.png',
-                        color: Theme.of(context)
+                        color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                            .primaryTextTheme!
-                            .headlineMedium!
-                            .decorationColor!,
                       ),
                     ),
                   ),

lib/src/screens/restore/wallet_restore_from_seed_form.dart

@@ -11,6 +11,7 @@ import 'package:cake_wallet/src/widgets/blockchain_height_widget.dart';
 import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/core/wallet_name_validator.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class WalletRestoreFromSeedForm extends StatefulWidget {
   WalletRestoreFromSeedForm(
@@ -93,10 +94,7 @@ class WalletRestoreFromSeedFormState extends State<WalletRestoreFromSeedForm> {
                     height: 34,
                     child: Image.asset(
                       'assets/images/refresh_icon.png',
-                      color: Theme.of(context)
+                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                          .primaryTextTheme!
-                          .headlineMedium!
-                          .decorationColor!,
                     ),
                   ),
                 ),

lib/src/screens/send/send_template_page.dart

@@ -15,6 +15,7 @@ import 'package:cake_wallet/src/widgets/keyboard_done_button.dart';
 import 'package:cake_wallet/src/widgets/primary_button.dart';
 import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
 import 'package:cake_wallet/src/screens/send/widgets/prefix_currency_icon_widget.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class SendTemplatePage extends BasePage {
   SendTemplatePage({required this.sendTemplateViewModel}) {
@@ -75,11 +76,8 @@ class SendTemplatePage extends BasePage {
                   bottomRight: Radius.circular(24),
                 ),
                 gradient: LinearGradient(colors: [
-                  Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+                  Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-                  Theme.of(context)
+                  Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
-                      .primaryTextTheme!
-                      .titleMedium!
-                      .decorationColor!,
                 ], begin: Alignment.topLeft, end: Alignment.bottomRight),
               ),
               child: Form(
@@ -93,19 +91,13 @@ class SendTemplatePage extends BasePage {
                           BaseTextFormField(
                             controller: _nameController,
                             hintText: S.of(context).send_name,
-                            borderColor: Theme.of(context)
+                            borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                .primaryTextTheme!
-                                .headlineSmall!
-                                .color!,
                             textStyle: TextStyle(
                                 fontSize: 14,
                                 fontWeight: FontWeight.w500,
                                 color: Colors.white),
                             placeholderTextStyle: TextStyle(
-                                color: Theme.of(context)
+                                color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor,
-                                    .primaryTextTheme!
-                                    .headlineSmall!
-                                    .decorationColor!,
                                 fontWeight: FontWeight.w500,
                                 fontSize: 14),
                             validator: sendTemplateViewModel.templateValidator,
@@ -124,14 +116,8 @@ class SendTemplatePage extends BasePage {
                                 AddressTextFieldOption.qrCode,
                                 AddressTextFieldOption.addressBook
                               ],
-                              buttonColor: Theme.of(context)
+                              buttonColor: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
-                                  .primaryTextTheme!
+                              borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                  .headlineMedium!
-                                  .color!,
-                              borderColor: Theme.of(context)
-                                  .primaryTextTheme!
-                                  .headlineSmall!
-                                  .color!,
                               textStyle: TextStyle(
                                   fontSize: 14,
                                   fontWeight: FontWeight.w500,
@@ -139,10 +125,7 @@ class SendTemplatePage extends BasePage {
                               hintStyle: TextStyle(
                                   fontSize: 14,
                                   fontWeight: FontWeight.w500,
-                                  color: Theme.of(context)
+                                  color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor),
-                                      .primaryTextTheme!
-                                      .headlineSmall!
-                                      .decorationColor!),
                             ),
                           ),
                           Padding(
@@ -171,19 +154,13 @@ class SendTemplatePage extends BasePage {
                                             .isCurrencySelected,
                                       )),
                                   hintText: '0.0000',
-                                  borderColor: Theme.of(context)
+                                  borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                      .primaryTextTheme!
-                                      .headlineSmall!
-                                      .color!,
                                   textStyle: TextStyle(
                                       fontSize: 14,
                                       fontWeight: FontWeight.w500,
                                       color: Colors.white),
                                   placeholderTextStyle: TextStyle(
-                                      color: Theme.of(context)
+                                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor,
-                                          .primaryTextTheme!
-                                          .headlineSmall!
-                                          .decorationColor!,
                                       fontWeight: FontWeight.w500,
                                       fontSize: 14),
                                   validator:
@@ -213,19 +190,13 @@ class SendTemplatePage extends BasePage {
                                           .isFiatSelected,
                                     )),
                                 hintText: '0.00',
-                                borderColor: Theme.of(context)
+                                borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                                    .primaryTextTheme!
-                                    .headlineSmall!
-                                    .color!,
                                 textStyle: TextStyle(
                                     fontSize: 14,
                                     fontWeight: FontWeight.w500,
                                     color: Colors.white),
                                 placeholderTextStyle: TextStyle(
-                                    color: Theme.of(context)
+                                    color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor,
-                                        .primaryTextTheme!
-                                        .headlineSmall!
-                                        .decorationColor!,
                                     fontWeight: FontWeight.w500,
                                     fontSize: 14),
                               ))),

lib/src/screens/send/widgets/send_card.dart

@@ -18,6 +18,7 @@ import 'package:cake_wallet/utils/show_pop_up.dart';
 import 'package:cake_wallet/src/widgets/address_text_field.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class SendCard extends StatefulWidget {
   SendCard({
@@ -125,11 +126,8 @@ class SendCardState extends State<SendCard>
                 bottomLeft: Radius.circular(24),
                 bottomRight: Radius.circular(24)),
             gradient: LinearGradient(colors: [
-              Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+              Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-              Theme.of(context)
+              Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
-                  .primaryTextTheme!
-                  .titleMedium!
-                  .decorationColor!,
             ], begin: Alignment.topLeft, end: Alignment.bottomRight),
           ) : null,
           child: Padding(
@@ -162,14 +160,8 @@ class SendCardState extends State<SendCard>
                           AddressTextFieldOption.qrCode,
                           AddressTextFieldOption.addressBook
                         ],
-                        buttonColor: Theme.of(context)
+                        buttonColor: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
-                            .primaryTextTheme!
+                        borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                            .headlineMedium!
-                            .color!,
-                        borderColor: Theme.of(context)
-                            .primaryTextTheme!
-                            .headlineSmall!
-                            .color!,
                         textStyle: TextStyle(
                             fontSize: 14,
                             fontWeight: FontWeight.w500,
@@ -177,10 +169,7 @@ class SendCardState extends State<SendCard>
                         hintStyle: TextStyle(
                             fontSize: 14,
                             fontWeight: FontWeight.w500,
-                            color: Theme.of(context)
+                            color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor),
-                                .primaryTextTheme!
-                                .headlineSmall!
-                                .decorationColor!),
                         onPushPasteButton: (context) async {
                           output.resetParsedAddress();
                           await output.fetchParsedAddress(context);
@@ -198,10 +187,7 @@ class SendCardState extends State<SendCard>
                       child: BaseTextFormField(
                         controller: extractedAddressController,
                         readOnly: true,
-                        borderColor: Theme.of(context)
+                        borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                            .primaryTextTheme!
-                            .headlineSmall!
-                            .color!,
                         textStyle: TextStyle(
                             fontSize: 14,
                             fontWeight: FontWeight.w500,
@@ -230,10 +216,7 @@ class SendCardState extends State<SendCard>
                                         child: Container(
                                           height: 32,
                                           decoration: BoxDecoration(
-                                              color: Theme.of(context)
+                                              color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
-                                                  .primaryTextTheme!
-                                                  .headlineMedium!
-                                                  .color!,
                                               borderRadius:
                                               BorderRadius.all(Radius.circular(6))),
                                           child: Center(
@@ -243,10 +226,7 @@ class SendCardState extends State<SendCard>
                                                   style: TextStyle(
                                                       fontSize: 12,
                                                       fontWeight: FontWeight.bold,
-                                                      color: Theme.of(context)
+                                                      color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor)),
-                                                          .primaryTextTheme!
-                                                          .headlineMedium!
-                                                          .decorationColor!)),
                                             ),
                                           ),
                                         ),
@@ -284,10 +264,7 @@ class SendCardState extends State<SendCard>
                                                 fontWeight: FontWeight.w500,
                                                 color: Colors.white),
                                             placeholderTextStyle: TextStyle(
-                                                color: Theme.of(context)
+                                                color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor,
-                                                    .primaryTextTheme!
-                                                    .headlineSmall!
-                                                    .decorationColor!,
                                                 fontWeight: FontWeight.w500,
                                                 fontSize: 14),
                                             validator: output.sendAll
@@ -305,10 +282,7 @@ class SendCardState extends State<SendCard>
                                                         output.setSendAll(),
                                                     child: Container(
                                                       decoration: BoxDecoration(
-                                                          color: Theme.of(context)
+                                                          color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonColor,
-                                                              .primaryTextTheme!
-                                                              .headlineMedium!
-                                                              .color!,
                                                           borderRadius:
                                                           BorderRadius.all(
                                                               Radius.circular(6))),
@@ -322,19 +296,13 @@ class SendCardState extends State<SendCard>
                                                                   fontWeight:
                                                                   FontWeight.bold,
                                                                   color:
-                                                                  Theme.of(context)
+                                                                  Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor))),
-                                                                      .primaryTextTheme!
-                                                                      .headlineMedium!
-                                                                      .decorationColor!))),
                                                     ))))]),
                                 ),
                               ],
                             )
                         )),
-                    Divider(height: 1,color: Theme.of(context)
+                    Divider(height: 1,color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor),
-                        .primaryTextTheme!
-                        .headlineSmall!
-                        .decorationColor!),
                     Observer(
                         builder: (_) => Padding(
                           padding: EdgeInsets.only(top: 10),
@@ -350,20 +318,14 @@ class SendCardState extends State<SendCard>
                                     style: TextStyle(
                                         fontSize: 12,
                                         fontWeight: FontWeight.w600,
-                                        color: Theme.of(context)
+                                        color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor),
-                                            .primaryTextTheme!
-                                            .headlineSmall!
-                                            .decorationColor!),
                                   )),
                               Text(
                                 sendViewModel.balance,
                                 style: TextStyle(
                                     fontSize: 12,
                                     fontWeight: FontWeight.w600,
-                                    color: Theme.of(context)
+                                    color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor),
-                                        .primaryTextTheme!
-                                        .headlineSmall!
-                                        .decorationColor!),
                               )
                             ],
                           ),
@@ -391,17 +353,13 @@ class SendCardState extends State<SendCard>
                                 )),
                           ),
                           hintText: '0.00',
-                          borderColor: Theme.of(context)
+                          borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                              .primaryTextTheme!
-                              .headlineSmall!
-                              .color!,
                           textStyle: TextStyle(
                               fontSize: 14,
                               fontWeight: FontWeight.w500,
                               color: Colors.white),
                           placeholderTextStyle: TextStyle(
-                              color: Theme.of(context)
+                              color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor,
-                                  .primaryTextTheme!.headlineSmall!.decorationColor!,
                               fontWeight: FontWeight.w500,
                               fontSize: 14),
                         )),
@@ -411,10 +369,7 @@ class SendCardState extends State<SendCard>
                         controller: noteController,
                         keyboardType: TextInputType.multiline,
                         maxLines: null,
-                        borderColor: Theme.of(context)
+                        borderColor: Theme.of(context).extension<SendPageTheme>()!.textFieldBorderColor,
-                            .primaryTextTheme!
-                            .headlineSmall!
-                            .color!,
                         textStyle: TextStyle(
                             fontSize: 14,
                             fontWeight: FontWeight.w500,
@@ -423,10 +378,7 @@ class SendCardState extends State<SendCard>
                         placeholderTextStyle: TextStyle(
                             fontSize: 14,
                             fontWeight: FontWeight.w500,
-                            color: Theme.of(context)
+                            color: Theme.of(context).extension<SendPageTheme>()!.textFieldHintColor),
-                                .primaryTextTheme!
-                                .headlineSmall!
-                                .decorationColor!),
                       ),
                     ),
                     Observer(
@@ -448,7 +400,7 @@ class SendCardState extends State<SendCard>
                                         fontSize: 12,
                                         fontWeight:
                                         FontWeight.w500,
-                                        //color: Theme.of(context).primaryTextTheme!.displaySmall!.color!,
+                                        //color: Theme.of(context).extension<SendPageTheme>()!.estimatedFeeColor,
                                         color: Colors.white)),
                                 Container(
                                   child: Row(
@@ -469,7 +421,7 @@ class SendCardState extends State<SendCard>
                                                   fontSize: 12,
                                                   fontWeight:
                                                   FontWeight.w600,
-                                                  //color: Theme.of(context).primaryTextTheme!.displaySmall!.color!,
+                                                  //color: Theme.of(context).extension<SendPageTheme>()!.estimatedFeeColor,
                                                   color:
                                                   Colors.white)),
                                           Padding(
@@ -487,10 +439,7 @@ class SendCardState extends State<SendCard>
                                                       fontWeight:
                                                       FontWeight.w600,
                                                       color: Theme
-                                                          .of(context)
+                                                          .of(context).extension<SendPageTheme>()!.textFieldHintColor))
-                                                          .primaryTextTheme!
-                                                          .headlineSmall!
-                                                          .decorationColor!))
                                           ),
                                         ],
                                       ),

lib/src/widgets/add_template_button.dart

@@ -2,6 +2,7 @@ import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/utils/responsive_layout_util.dart';
 import 'package:dotted_border/dotted_border.dart';
 import 'package:flutter/material.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class AddTemplateButton extends StatelessWidget {
   final Function() onTap;
@@ -20,7 +21,7 @@ class AddTemplateButton extends StatelessWidget {
           borderType: BorderType.RRect,
           dashPattern: [6, 4],
           color:
-              Theme.of(context).primaryTextTheme!.displaySmall!.decorationColor!,
+              Theme.of(context).extension<SendPageTheme>()!.templateDottedBorderColor,
           strokeWidth: 2,
           radius: Radius.circular(20),
           child: Container(
@@ -35,20 +36,14 @@ class AddTemplateButton extends StatelessWidget {
             child: currentTemplatesLength >= 1
                 ? Icon(
                     Icons.add,
-                    color: Theme.of(context)
+                    color: Theme.of(context).extension<SendPageTheme>()!.templateNewTextColor,
-                        .primaryTextTheme!
-                        .displayMedium!
-                        .color!,
                   )
                 : Text(
                     S.of(context).new_template,
                     style: TextStyle(
                       fontSize: 14,
                       fontWeight: FontWeight.w600,
-                      color: Theme.of(context)
+                      color: Theme.of(context).extension<SendPageTheme>()!.templateNewTextColor,
-                          .primaryTextTheme!
-                          .displayMedium!
-                          .color!,
                     ),
                   ),
           ),

lib/src/widgets/address_text_field.dart

@@ -8,6 +8,7 @@ import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/entities/qr_scanner.dart';
 import 'package:cake_wallet/entities/contact_base.dart';
 import 'package:cw_core/crypto_currency.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 enum AddressTextFieldOption { paste, qrCode, addressBook }
 
@@ -126,10 +127,7 @@ class AddressTextField extends StatelessWidget {
                               child: Image.asset(
                                 'assets/images/paste_ios.png',
                                 color: iconColor ??
-                                    Theme.of(context)
+                                    Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                                        .primaryTextTheme!
-                                        .headlineMedium!
-                                        .decorationColor!,
                               )),
                         )),
                   ],
@@ -151,9 +149,7 @@ class AddressTextField extends StatelessWidget {
                               child: Image.asset(
                                 'assets/images/qr_code_icon.png',
                                 color: iconColor ??
-                                    Theme.of(context)
+                                    Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                                        .primaryTextTheme!.headlineMedium!
-                                        .decorationColor!,
                               )),
                         ))
                   ] else SizedBox(width: 5),
@@ -176,10 +172,7 @@ class AddressTextField extends StatelessWidget {
                               child: Image.asset(
                                 'assets/images/open_book.png',
                                 color: iconColor ??
-                                    Theme.of(context)
+                                    Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor,
-                                        .primaryTextTheme!
-                                        .headlineMedium!
-                                        .decorationColor!,
                               )),
                         ))
                   ]

lib/src/widgets/seed_widget.dart

@@ -10,6 +10,7 @@ import 'package:cake_wallet/src/widgets/primary_button.dart';
 import 'package:cake_wallet/entities/mnemonic_item.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:flutter/widgets.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class SeedWidget extends StatefulWidget {
   SeedWidget({
@@ -128,10 +129,7 @@ class SeedWidgetState extends State<SeedWidget> {
                               borderRadius:
                                   BorderRadius.all(Radius.circular(6))),
                           child: Image.asset('assets/images/paste_ios.png',
-                              color: Theme.of(context)
+                              color: Theme.of(context).extension<SendPageTheme>()!.textFieldButtonIconColor)),
-                                  .primaryTextTheme!
-                                  .headlineMedium!
-                                  .decorationColor!)),
                     )))
           ]),
           Container(

lib/src/widgets/standard_checkbox.dart

@@ -1,6 +1,7 @@
 import 'dart:ui';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class StandardCheckbox extends StatelessWidget {
   StandardCheckbox(
@@ -21,8 +22,8 @@ class StandardCheckbox extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final baseGradient = LinearGradient(colors: [
-      Theme.of(context).primaryTextTheme!.titleMedium!.color!,
+      Theme.of(context).extension<SendPageTheme>()!.firstGradientColor,
-      Theme.of(context).primaryTextTheme!.titleMedium!.decorationColor!,
+      Theme.of(context).extension<SendPageTheme>()!.secondGradientColor,
     ], begin: Alignment.centerLeft, end: Alignment.centerRight);
 
     final boxBorder = Border.all(

lib/src/widgets/template_tile.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/palette.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 
 class TemplateTile extends StatefulWidget {
   TemplateTile({
@@ -105,7 +106,7 @@ class TemplateTileState extends State<TemplateTile> {
             child: Container(
               height: 40,
               padding: EdgeInsets.only(left: 24, right: 24),
-              color: Theme.of(context).primaryTextTheme!.displayMedium!.decorationColor!,
+              color: Theme.of(context).extension<SendPageTheme>()!.templateBackgroundColor,
               child: content,
             ),
           ),

lib/themes/bright_theme.dart

@@ -6,6 +6,7 @@ import 'package:cake_wallet/themes/extensions/indicator_dot_theme.dart';
 import 'package:cake_wallet/themes/extensions/menu_theme.dart';
 import 'package:cake_wallet/themes/extensions/new_wallet_theme.dart';
 import 'package:cake_wallet/themes/extensions/order_theme.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/sync_indicator_theme.dart';
 import 'package:cake_wallet/themes/extensions/wallet_list_theme.dart';
 import 'package:cake_wallet/themes/light_theme.dart';
@@ -78,6 +79,12 @@ class BrightTheme extends LightTheme {
   @override
   OrderTheme get orderTheme => OrderTheme(iconColor: Colors.white);
 
+  @override
+  SendPageTheme get sendPageTheme => super.sendPageTheme.copyWith(
+      templateBackgroundColor: Palette.shadowWhite,
+      templateDotterBorderColor: Palette.shadowWhite,
+      secondGradientColor: Palette.pinkFlamingo);
+
   @override
   ThemeData get themeData => super.themeData.copyWith(
       indicatorColor: Colors.white.withOpacity(0.5), // page indicator
@@ -142,42 +149,6 @@ class BrightTheme extends LightTheme {
             color: Palette.darkGray, // transaction/trade details titles
             decorationColor: Colors.white.withOpacity(0.5), // placeholder
           ),
-          // subhead -> titleMedium
-          titleMedium: TextStyle(
-              color: Palette.blueCraiola, // first gradient color (send page)
-              decorationColor:
-                  Palette.pinkFlamingo // second gradient color (send page)
-              ),
-          // headline -> headlineSmall
-          headlineSmall: TextStyle(
-            color: Colors.white
-                .withOpacity(0.5), // text field border color (send page)
-            decorationColor: Colors.white
-                .withOpacity(0.5), // text field hint color (send page)
-          ),
-          // display1 -> headlineMedium
-          headlineMedium: TextStyle(
-              color: Colors.white
-                  .withOpacity(0.2), // text field button color (send page)
-              decorationColor:
-                  Colors.white // text field button icon color (send page)
-              ),
-          // display2 -> displaySmall
-          displaySmall: TextStyle(
-              color: Colors.white.withOpacity(0.5), // estimated fee (send page)
-              decorationColor:
-                  Palette.shadowWhite // template dotted border (send page)
-              ),
-          // display3 -> displayMedium
-          displayMedium: TextStyle(
-              color: Palette.darkBlueCraiola, // template new text (send page)
-              decorationColor:
-                  Palette.shadowWhite // template background color (send page)
-              ),
-          // display4 -> displayLarge
-          displayLarge: TextStyle(
-            color: Palette.darkBlueCraiola, // template title (send page)
-          ),
         ),
       );
 }

lib/themes/dark_theme.dart

@@ -13,6 +13,7 @@ import 'package:cake_wallet/themes/extensions/new_wallet_theme.dart';
 import 'package:cake_wallet/themes/extensions/order_theme.dart';
 import 'package:cake_wallet/themes/extensions/picker_theme.dart';
 import 'package:cake_wallet/themes/extensions/pin_code_theme.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/support_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/sync_indicator_theme.dart';
 import 'package:cake_wallet/themes/extensions/wallet_list_theme.dart';
@@ -136,6 +137,20 @@ class DarkTheme extends ThemeBase {
   @override
   OrderTheme get orderTheme => OrderTheme(iconColor: Colors.white);
 
+  @override
+  SendPageTheme get sendPageTheme => SendPageTheme(
+      templateTitleColor: PaletteDark.cyanBlue,
+      templateBackgroundColor: PaletteDark.darkVioletBlue,
+      templateNewTextColor: PaletteDark.darkCyanBlue,
+      templateDottedBorderColor: PaletteDark.darkCyanBlue,
+      estimatedFeeColor: Colors.white,
+      textFieldButtonIconColor: PaletteDark.gray,
+      textFieldButtonColor: PaletteDark.buttonNightBlue,
+      textFieldHintColor: PaletteDark.darkCyanBlue,
+      textFieldBorderColor: PaletteDark.lightVioletBlue,
+      secondGradientColor: PaletteDark.darkNightBlue,
+      firstGradientColor: PaletteDark.darkNightBlue);
+
   @override
   ThemeData get themeData => super.themeData.copyWith(
       indicatorColor: PaletteDark.cyanBlue, // page indicator
@@ -202,43 +217,6 @@ class DarkTheme extends ThemeBase {
                 PaletteDark.lightBlueGrey, // transaction/trade details titles
             decorationColor: Colors.grey, // placeholder
           ),
-          // subhead -> titleMedium
-          titleMedium: TextStyle(
-              color:
-                  PaletteDark.darkNightBlue, // first gradient color (send page)
-              decorationColor:
-                  PaletteDark.darkNightBlue // second gradient color (send page)
-              ),
-          // headline -> headlineSmall
-          headlineSmall: TextStyle(
-            color: PaletteDark
-                .lightVioletBlue, // text field border color (send page)
-            decorationColor:
-                PaletteDark.darkCyanBlue, // text field hint color (send page)
-          ),
-          // display1 -> headlineMedium
-          headlineMedium: TextStyle(
-              color: PaletteDark
-                  .buttonNightBlue, // text field button color (send page)
-              decorationColor:
-                  PaletteDark.gray // text field button icon color (send page)
-              ),
-          // display2 -> displaySmall
-          displaySmall: TextStyle(
-              color: Colors.white, // estimated fee (send page)
-              decorationColor:
-                  PaletteDark.darkCyanBlue // template dotted border (send page)
-              ),
-          // display3 -> displayMedium
-          displayMedium: TextStyle(
-              color: PaletteDark.darkCyanBlue, // template new text (send page)
-              decorationColor: PaletteDark
-                  .darkVioletBlue // template background color (send page)
-              ),
-          // display4 -> displayLarge
-          displayLarge: TextStyle(
-              color: PaletteDark.cyanBlue, // template title (send page)
-              ),
       ),
       );
 }

lib/themes/extensions/send_page_theme.dart

@@ -0,0 +1,93 @@
+import 'package:flutter/material.dart';
+
+class SendPageTheme extends ThemeExtension<SendPageTheme> {
+  final Color templateTitleColor;
+  final Color templateBackgroundColor;
+  final Color templateNewTextColor;
+  final Color templateDottedBorderColor;
+  final Color estimatedFeeColor;
+  final Color textFieldButtonIconColor;
+  final Color textFieldButtonColor;
+  final Color textFieldHintColor;
+  final Color textFieldBorderColor;
+  final Color firstGradientColor;
+  final Color secondGradientColor;
+
+  SendPageTheme(
+      {required this.templateTitleColor,
+      required this.templateBackgroundColor,
+      required this.templateNewTextColor,
+      required this.templateDottedBorderColor,
+      required this.estimatedFeeColor,
+      required this.textFieldButtonIconColor,
+      required this.textFieldButtonColor,
+      required this.textFieldHintColor,
+      required this.textFieldBorderColor,
+      required this.firstGradientColor,
+      required this.secondGradientColor});
+
+  @override
+  SendPageTheme copyWith(
+          {Color? templateTitleColor,
+          Color? templateBackgroundColor,
+          Color? templateNewTextColor,
+          Color? templateDotterBorderColor,
+          Color? estimatedFeeColor,
+          Color? textFieldButtonIconColor,
+          Color? textFieldButtonColor,
+          Color? textFieldHintColor,
+          Color? textFieldBorderColor,
+          Color? firstGradientColor,
+          Color? secondGradientColor}) =>
+      SendPageTheme(
+          templateTitleColor: templateTitleColor ?? this.templateTitleColor,
+          templateBackgroundColor:
+              templateBackgroundColor ?? this.templateBackgroundColor,
+          templateNewTextColor:
+              templateNewTextColor ?? this.templateNewTextColor,
+          templateDottedBorderColor:
+              templateDotterBorderColor ?? this.templateDottedBorderColor,
+          estimatedFeeColor: estimatedFeeColor ?? this.estimatedFeeColor,
+          textFieldButtonIconColor:
+              textFieldButtonIconColor ?? this.textFieldButtonIconColor,
+          textFieldButtonColor:
+              textFieldButtonColor ?? this.textFieldButtonColor,
+          textFieldHintColor: textFieldHintColor ?? this.textFieldHintColor,
+          textFieldBorderColor:
+              textFieldBorderColor ?? this.textFieldBorderColor,
+          firstGradientColor: firstGradientColor ?? this.firstGradientColor,
+          secondGradientColor: secondGradientColor ?? this.secondGradientColor);
+
+  @override
+  SendPageTheme lerp(ThemeExtension<SendPageTheme>? other, double t) {
+    if (other is! SendPageTheme) {
+      return this;
+    }
+
+    return SendPageTheme(
+        templateTitleColor: Color.lerp(
+            templateTitleColor, other.templateTitleColor, t)!,
+        templateBackgroundColor: Color.lerp(
+            templateBackgroundColor, other.templateBackgroundColor, t)!,
+        templateNewTextColor:
+            Color.lerp(templateNewTextColor, other.templateNewTextColor, t)!,
+        templateDottedBorderColor: Color.lerp(
+            templateDottedBorderColor,
+            other.templateDottedBorderColor,
+            t)!,
+        estimatedFeeColor:
+            Color.lerp(estimatedFeeColor, other.estimatedFeeColor, t)!,
+        textFieldButtonIconColor: Color.lerp(
+            textFieldButtonIconColor, other.textFieldButtonIconColor, t)!,
+        textFieldButtonColor:
+            Color.lerp(textFieldButtonColor, other.textFieldButtonColor, t)!,
+        textFieldHintColor:
+            Color.lerp(textFieldHintColor, other.textFieldHintColor, t)!,
+        textFieldBorderColor:
+            Color.lerp(textFieldBorderColor, other.textFieldBorderColor, t)!,
+        firstGradientColor:
+            Color.lerp(firstGradientColor, other.firstGradientColor, t)!,
+        secondGradientColor:
+            Color.lerp(secondGradientColor, other.secondGradientColor, t)!);
+  }
+}

lib/themes/light_theme.dart

@@ -13,6 +13,7 @@ import 'package:cake_wallet/themes/extensions/new_wallet_theme.dart';
 import 'package:cake_wallet/themes/extensions/order_theme.dart';
 import 'package:cake_wallet/themes/extensions/picker_theme.dart';
 import 'package:cake_wallet/themes/extensions/pin_code_theme.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/support_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/sync_indicator_theme.dart';
 import 'package:cake_wallet/themes/extensions/wallet_list_theme.dart';
@@ -137,6 +138,20 @@ class LightTheme extends ThemeBase {
   @override
   OrderTheme get orderTheme => OrderTheme(iconColor: Colors.black);
 
+  @override
+  SendPageTheme get sendPageTheme => SendPageTheme(
+      templateTitleColor: Palette.darkBlueCraiola,
+      templateBackgroundColor: Palette.blueAlice,
+      templateNewTextColor: Palette.darkBlueCraiola,
+      templateDottedBorderColor: Palette.moderateLavender,
+      estimatedFeeColor: Colors.white.withOpacity(0.5),
+      textFieldButtonIconColor: Colors.white,
+      textFieldButtonColor: Colors.white.withOpacity(0.2),
+      textFieldHintColor: Colors.white.withOpacity(0.5),
+      textFieldBorderColor: Colors.white.withOpacity(0.5),
+      secondGradientColor: Palette.blueGreyCraiola,
+      firstGradientColor: Palette.blueCraiola);
+
   @override
   ThemeData get themeData => super.themeData.copyWith(
       indicatorColor:
@@ -204,42 +219,6 @@ class LightTheme extends ThemeBase {
             color: Palette.darkGray, // transaction/trade details titles
             decorationColor: PaletteDark.darkCyanBlue, // placeholder
           ),
-          // subhead -> titleMedium
-          titleMedium: TextStyle(
-              color: Palette.blueCraiola, // first gradient color (send page)
-              decorationColor:
-                  Palette.blueGreyCraiola // second gradient color (send page)
-              ),
-          // headline -> headlineSmall
-          headlineSmall: TextStyle(
-            color: Colors.white
-                .withOpacity(0.5), // text field border color (send page)
-            decorationColor: Colors.white
-                .withOpacity(0.5), // text field hint color (send page)
-          ),
-          // display1 -> headlineMedium
-          headlineMedium: TextStyle(
-              color: Colors.white
-                  .withOpacity(0.2), // text field button color (send page)
-              decorationColor:
-                  Colors.white // text field button icon color (send page)
-              ),
-          // display2 -> displaySmall
-          displaySmall: TextStyle(
-              color: Colors.white.withOpacity(0.5), // estimated fee (send page)
-              decorationColor:
-                  Palette.moderateLavender // template dotted border (send page)
-              ),
-          // display3 -> displayMedium
-          displayMedium: TextStyle(
-              color: Palette.darkBlueCraiola, // template new text (send page)
-              decorationColor:
-                  Palette.blueAlice // template background color (send page)
-              ),
-          // display4 -> displayLarge
-          displayLarge: TextStyle(
-              color: Palette.darkBlueCraiola, // template title (send page)
-              ),
       ),
       );
 }

lib/themes/theme_base.dart

@@ -12,6 +12,7 @@ import 'package:cake_wallet/themes/extensions/new_wallet_theme.dart';
 import 'package:cake_wallet/themes/extensions/order_theme.dart';
 import 'package:cake_wallet/themes/extensions/picker_theme.dart';
 import 'package:cake_wallet/themes/extensions/pin_code_theme.dart';
+import 'package:cake_wallet/themes/extensions/send_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/support_page_theme.dart';
 import 'package:cake_wallet/themes/extensions/sync_indicator_theme.dart';
 import 'package:cake_wallet/themes/extensions/wallet_list_theme.dart';
@@ -85,6 +86,8 @@ abstract class ThemeBase {
 
   OrderTheme get orderTheme;
 
+  SendPageTheme get sendPageTheme;
+
   ThemeData get themeData => generatedThemeData.copyWith(
       primaryColor: primaryColor,
       cardColor: containerColor,
@@ -107,6 +110,7 @@ abstract class ThemeBase {
         pickerTheme,
         alertTheme,
         orderTheme,
+        sendPageTheme,
       ],
       scrollbarTheme: ScrollbarThemeData(
           thumbColor: MaterialStateProperty.all(scrollbarTheme.thumbColor),