CAKE-28 | reworked exchange confirm page; applied light and dark themes to exchange confirm page, currency picker, picker, base alert dialog, alert with one action; applied maximum characters parameter to crypto currency text field in the exchange card

lib/palette.dart

@@ -31,6 +31,7 @@ class Palette {
   static const Color darkGray = Color.fromRGBO(122, 147, 186, 1.0);
   static const Color shadowWhite = Color.fromRGBO(242, 245, 255, 1.0);
   static const Color niagara = Color.fromRGBO(152, 172, 201, 1.0);
+  static const Color alizarinRed = Color.fromRGBO(233, 45, 45, 1.0);
 
   // FIXME: Rename.
   static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);
@@ -79,6 +80,7 @@ class PaletteDark {
   static const Color violetBlue = Color.fromRGBO(59, 72, 119, 1.0);
   static const Color distantBlue = Color.fromRGBO(72, 85, 131, 1.0);
   static const Color moderateVioletBlue = Color.fromRGBO(62, 73, 113, 1.0);
+  static const Color deepVioletBlue = Color.fromRGBO(52, 66, 104, 1.0);
 
   // FIXME: Rename.
   static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);

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

@@ -1,8 +1,10 @@
 import 'dart:ui';
+import 'package:cake_wallet/palette.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
+import 'package:cake_wallet/src/widgets/alert_background.dart';
+import 'package:cake_wallet/src/widgets/alert_close_button.dart';
 
 class CurrencyPicker extends StatelessWidget {
   CurrencyPicker({
@@ -16,19 +18,17 @@ class CurrencyPicker extends StatelessWidget {
   final List<CryptoCurrency> items;
   final String title;
   final Function(CryptoCurrency) onItemSelected;
+  final closeButton = Image.asset('assets/images/close.png',
+    color: Palette.darkBlueCraiola,
+  );
 
   @override
   Widget build(BuildContext context) {
-    return GestureDetector(
+    return AlertBackground(
-      onTap: () => Navigator.of(context).pop(),
+        child: Stack(
-      child: Container(
+          alignment: Alignment.center,
-        color: Colors.transparent,
+          children: <Widget>[
-        child: BackdropFilter(
+            Column(
-          filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
-          child: Container(
-            decoration: BoxDecoration(color: PaletteDark.darkNightBlue.withOpacity(0.75)),
-            child: Center(
-              child: Column(
               mainAxisSize: MainAxisSize.min,
               children: <Widget>[
                 Container(
@@ -38,6 +38,7 @@ class CurrencyPicker extends StatelessWidget {
                     textAlign: TextAlign.center,
                     style: TextStyle(
                         fontSize: 18,
+                        fontFamily: 'Poppins',
                         fontWeight: FontWeight.bold,
                         decoration: TextDecoration.none,
                         color: Colors.white
@@ -53,7 +54,7 @@ class CurrencyPicker extends StatelessWidget {
                       child: Container(
                         height: 400,
                         width: 300,
-                          color: Theme.of(context).dividerColor,
+                        color: Theme.of(context).accentTextTheme.title.backgroundColor,
                         child: GridView.count(
                             shrinkWrap: true,
                             crossAxisCount: 3,
@@ -65,7 +66,7 @@ class CurrencyPicker extends StatelessWidget {
 
                               if (index == 14) {
                                 return Container(
-                                    color: Theme.of(context).primaryTextTheme.display1.color,
+                                  color: Theme.of(context).accentTextTheme.title.color,
                                 );
                               }
 
@@ -73,10 +74,10 @@ class CurrencyPicker extends StatelessWidget {
                               final isItemSelected = index == selectedAtIndex;
 
                               final color = isItemSelected
-                                    ? Theme.of(context).accentTextTheme.subtitle.decorationColor
+                                  ? Theme.of(context).textTheme.body2.color
-                                    : Theme.of(context).primaryTextTheme.display1.color;
+                                  : Theme.of(context).accentTextTheme.title.color;
                               final textColor = isItemSelected
-                                    ? Colors.blue
+                                  ? Palette.blueCraiola
                                   : Theme.of(context).primaryTextTheme.title.color;
 
                               return GestureDetector(
@@ -94,7 +95,8 @@ class CurrencyPicker extends StatelessWidget {
                                       item.toString(),
                                       style: TextStyle(
                                           fontSize: 18,
-                                            fontWeight: FontWeight.bold,
+                                          fontFamily: 'Poppins',
+                                          fontWeight: FontWeight.w600,
                                           decoration: TextDecoration.none,
                                           color: textColor
                                       ),
@@ -110,10 +112,9 @@ class CurrencyPicker extends StatelessWidget {
                 )
               ],
             ),
+            AlertCloseButton(image: closeButton)
+          ],
         )
-          ),
-        ),
-      ),
     );
   }
 }

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

@@ -146,6 +146,7 @@ class ExchangeCardState extends State<ExchangeCard> {
                   keyboardType: TextInputType.numberWithOptions(
                       signed: false, decimal: true),
                   inputFormatters: [
+                    LengthLimitingTextInputFormatter(15),
                     BlacklistingTextInputFormatter(
                         RegExp('[\\-|\\ |\\,]'))
                   ],

lib/src/screens/exchange_trade/exchange_confirm_page.dart

@@ -6,6 +6,7 @@ import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/src/widgets/primary_button.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
 import 'package:cake_wallet/src/domain/exchange/trade.dart';
+import 'package:cake_wallet/palette.dart';
 
 class ExchangeConfirmPage extends BasePage {
   ExchangeConfirmPage({@required this.trade});
@@ -16,43 +17,92 @@ class ExchangeConfirmPage extends BasePage {
   String get title => S.current.copy_id;
 
   @override
-  Widget body(BuildContext context) {
+  Widget trailing(BuildContext context) {
-    final copyImage = Image.asset('assets/images/copy_content.png',
+    final questionImage = Image.asset('assets/images/question_mark.png',
         color: Theme.of(context).primaryTextTheme.title.color);
 
+    return SizedBox(
+      height: 20.0,
+      width: 20.0,
+      child: ButtonTheme(
+        minWidth: double.minPositive,
+        child: FlatButton(
+          highlightColor: Colors.transparent,
+          splashColor: Colors.transparent,
+          padding: EdgeInsets.all(0),
+          onPressed: () {},
+          child: questionImage),
+      ),
+    );
+  }
+
+  @override
+  Widget body(BuildContext context) {
     return Container(
-      padding: EdgeInsets.all(24),
+      padding: EdgeInsets.fromLTRB(24, 0, 24, 24),
       child: Column(
         children: <Widget>[
           Expanded(
-              child: Center(
               child: Column(
-                  mainAxisSize: MainAxisSize.min,
                 children: <Widget>[
-                    Text(
+                  Flexible(
+                    child: Center(
+                      child: Text(
                         S.of(context).exchange_result_write_down_trade_id,
                         textAlign: TextAlign.center,
                         style: TextStyle(
                           fontSize: 18.0,
-                          fontWeight: FontWeight.w600,
+                          fontWeight: FontWeight.w500,
                           color: Theme.of(context).primaryTextTheme.title.color),
                       ),
-                    Padding(
+                    )
-                      padding: EdgeInsets.only(top: 60),
+                  ),
-                      child: Text(
+                  Container(
+                    height: 178,
+                    decoration: BoxDecoration(
+                      borderRadius: BorderRadius.all(Radius.circular(30)),
+                      border: Border.all(
+                        width: 1,
+                        color: Theme.of(context).accentTextTheme.caption.color
+                      ),
+                      color: Theme.of(context).accentTextTheme.title.color
+                    ),
+                    child: Column(
+                      children: <Widget>[
+                        Expanded(
+                          child: Padding(
+                            padding: EdgeInsets.all(24),
+                            child: Column(
+                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                              crossAxisAlignment: CrossAxisAlignment.center,
+                              children: <Widget>[
+                                Text(
                                   S.of(context).trade_id,
-                        textAlign: TextAlign.center,
                                   style: TextStyle(
-                            fontSize: 16.0,
+                                    fontSize: 12.0,
-                            fontWeight: FontWeight.w600,
+                                    fontWeight: FontWeight.w500,
-                            color: Theme.of(context).primaryTextTheme.title.color),
+                                    color: Theme.of(context).primaryTextTheme.overline.color
                                   ),
                                 ),
+                                Text(
+                                  trade.id,
+                                  maxLines: 1,
+                                  overflow: TextOverflow.ellipsis,
+                                  style: TextStyle(
+                                    fontSize: 20,
+                                    fontWeight: FontWeight.w600,
+                                    color: Theme.of(context).primaryTextTheme.title.color
+                                  ),
+                                ),
+                              ],
+                            ),
+                          )
+                        ),
                         Padding(
-                      padding: EdgeInsets.only(top: 24),
+                          padding: EdgeInsets.fromLTRB(10, 0, 10, 10),
                           child: Builder(
-                        builder: (context) => GestureDetector(
+                            builder: (context) => PrimaryButton(
-                          onTap: () {
+                                onPressed: () {
                                   Clipboard.setData(ClipboardData(text: trade.id));
                                   Scaffold.of(context).showSnackBar(SnackBar(
                                     content: Text(
@@ -64,46 +114,26 @@ class ExchangeConfirmPage extends BasePage {
                                     duration: Duration(milliseconds: 1500),
                                   ));
                                 },
-                          child: Container(
+                                text: S.of(context).copy_id,
-                            height: 60,
+                                color: Theme.of(context).accentTextTheme.caption.backgroundColor,
-                            padding: EdgeInsets.only(left: 24, right: 24),
+                                textColor: Theme.of(context).primaryTextTheme.title.color
-                            decoration: BoxDecoration(
-                                borderRadius: BorderRadius.all(Radius.circular(30)),
-                                color: Theme.of(context).accentTextTheme.title.backgroundColor
-                            ),
-                            child: Row(
-                              mainAxisSize: MainAxisSize.max,
-                              children: <Widget>[
-                                Expanded(
-                                  child: Text(
-                                    trade.id,
-                                    maxLines: 1,
-                                    overflow: TextOverflow.ellipsis,
-                                    style: TextStyle(
-                                        fontSize: 18,
-                                        fontWeight: FontWeight.w600,
-                                        color: Theme.of(context).primaryTextTheme.title.color
                             ),
                           ),
-                                ),
-                                Padding(
-                                  padding: EdgeInsets.only(left: 12),
-                                  child: copyImage,
                         )
                       ],
                     ),
                   ),
-                        )
+                  Flexible(
+                    child: Offstage()
                   ),
-                    )
                 ],
+              )
           ),
-              )),
           PrimaryButton(
               onPressed: () => Navigator.of(context)
                   .pushReplacementNamed(Routes.exchangeTrade, arguments: trade),
               text: S.of(context).saved_the_trade_id,
-              color: Colors.green,
+              color: Palette.blueCraiola,
               textColor: Colors.white)
         ],
       ),

lib/src/screens/monero_accounts/monero_account_list_page.dart

@@ -27,7 +27,9 @@ class MoneroAccountListPage extends StatelessWidget {
   }
 
   final MoneroAccountListViewModel accountListViewModel;
-  final closeIcon = Image.asset('assets/images/close.png');
+  final closeIcon = Image.asset('assets/images/close.png',
+    color: Palette.darkBlueCraiola,
+  );
 
   ScrollController controller;
   double backgroundHeight;

lib/src/widgets/alert_with_one_action.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/src/widgets/base_alert_dialog.dart';
+import 'package:cake_wallet/palette.dart';
 
 class AlertWithOneAction extends BaseAlertDialog {
   AlertWithOneAction({
@@ -31,13 +32,7 @@ class AlertWithOneAction extends BaseAlertDialog {
       width: 300,
       height: 52,
       padding: EdgeInsets.only(left: 12, right: 12),
-      decoration: BoxDecoration(
+      color: Palette.blueCraiola,
-          borderRadius: BorderRadius.only(
-              bottomLeft: Radius.circular(24),
-              bottomRight: Radius.circular(24)
-          ),
-          color: Colors.white
-      ),
       child: ButtonTheme(
         minWidth: double.infinity,
         child: FlatButton(
@@ -50,7 +45,7 @@ class AlertWithOneAction extends BaseAlertDialog {
               style: TextStyle(
                 fontSize: 15,
                 fontWeight: FontWeight.w600,
-                color: Colors.blue,
+                color: Colors.white,
                 decoration: TextDecoration.none,
               ),
             )),

lib/src/widgets/base_alert_dialog.dart

@@ -17,6 +17,7 @@ class BaseAlertDialog extends StatelessWidget {
       textAlign: TextAlign.center,
       style: TextStyle(
         fontSize: 20,
+        fontFamily: 'Poppins',
         fontWeight: FontWeight.w600,
         color: Theme.of(context).primaryTextTheme.title.color,
         decoration: TextDecoration.none,
@@ -30,7 +31,7 @@ class BaseAlertDialog extends StatelessWidget {
       textAlign: TextAlign.center,
       style: TextStyle(
         fontSize: 16,
-        fontWeight: FontWeight.w600,
+        fontFamily: 'Poppins',
         color: Theme.of(context).primaryTextTheme.title.color,
         decoration: TextDecoration.none,
       ),
@@ -38,25 +39,14 @@ class BaseAlertDialog extends StatelessWidget {
   }
 
   Widget actionButtons(BuildContext context) {
-    return Container(
+    return Row(
-      width: 300,
-      height: 52,
-      decoration: BoxDecoration(
-        borderRadius: BorderRadius.only(
-          bottomLeft: Radius.circular(24),
-          bottomRight: Radius.circular(24)
-        ),
-        color: Colors.white
-      ),
-      child: Row(
       mainAxisSize: MainAxisSize.max,
       children: <Widget>[
         Flexible(
             child: Container(
+              height: 52,
               padding: EdgeInsets.only(left: 12, right: 12),
-              decoration: BoxDecoration(
+              color: Palette.blueCraiola,
-                borderRadius: BorderRadius.only(bottomLeft: Radius.circular(24)),
-              ),
               child: ButtonTheme(
                 minWidth: double.infinity,
                 child: FlatButton(
@@ -68,25 +58,20 @@ class BaseAlertDialog extends StatelessWidget {
                       textAlign: TextAlign.center,
                       style: TextStyle(
                         fontSize: 15,
+                        fontFamily: 'Poppins',
                         fontWeight: FontWeight.w600,
-                      color: Colors.blue,
+                        color: Colors.white,
                         decoration: TextDecoration.none,
                       ),
                     )),
               ),
             )
         ),
-          Container(
-            height: 52,
-            width: 1,
-            color: Colors.grey.withOpacity(0.2),
-          ),
         Flexible(
             child: Container(
+              height: 52,
               padding: EdgeInsets.only(left: 12, right: 12),
-              decoration: BoxDecoration(
+              color: Palette.alizarinRed,
-                borderRadius: BorderRadius.only(bottomRight: Radius.circular(24)),
-              ),
               child: ButtonTheme(
                 minWidth: double.infinity,
                 child: FlatButton(
@@ -98,8 +83,9 @@ class BaseAlertDialog extends StatelessWidget {
                       textAlign: TextAlign.center,
                       style: TextStyle(
                         fontSize: 15,
+                        fontFamily: 'Poppins',
                         fontWeight: FontWeight.w600,
-                        color: Colors.red,
+                        color: Colors.white,
                         decoration: TextDecoration.none,
                       ),
                     )),
@@ -107,7 +93,6 @@ class BaseAlertDialog extends StatelessWidget {
             )
         )
       ],
-      ),
     );
   }
 
@@ -126,40 +111,25 @@ class BaseAlertDialog extends StatelessWidget {
             child: Center(
               child: GestureDetector(
                 onTap: () => null,
+                child: ClipRRect(
+                  borderRadius: BorderRadius.all(Radius.circular(30)),
                   child: Container(
                     width: 300,
-                  height: 257,
+                    color: Theme.of(context).accentTextTheme.title.decorationColor,
-                  decoration: BoxDecoration(
-                    borderRadius: BorderRadius.all(Radius.circular(24)),
-                    color: Theme.of(context).accentTextTheme.title.backgroundColor
-                  ),
                     child: Column(
+                      mainAxisSize: MainAxisSize.min,
                       children: <Widget>[
                         Container(
-                        width: 300,
+                          padding: EdgeInsets.fromLTRB(24, 32, 24, 32),
-                        height: 77,
+                          child: Column(
-                        padding: EdgeInsets.only(left: 24, right: 24),
+                            crossAxisAlignment: CrossAxisAlignment.center,
-                        decoration: BoxDecoration(
+                            children: <Widget>[
-                          borderRadius: BorderRadius.only(
+                              title(context),
-                            topLeft: Radius.circular(24),
+                              Padding(
-                            topRight: Radius.circular(24)
+                                padding: EdgeInsets.only(top: 8),
-                          ),
-                        ),
-                        child: Center(
-                          child: title(context),
-                        ),
-                      ),
-                      Container(
-                        width: 300,
-                        height: 1,
-                        color: Theme.of(context).dividerColor,
-                      ),
-                      Container(
-                        width: 300,
-                        height: 127,
-                        padding: EdgeInsets.all(24),
-                        child: Center(
                                 child: content(context),
+                              )
+                            ],
                           ),
                         ),
                         actionButtons(context)
@@ -171,6 +141,7 @@ class BaseAlertDialog extends StatelessWidget {
             ),
           ),
         ),
+      ),
     );
   }
 }

lib/src/widgets/base_text_form_field.dart

@@ -21,7 +21,8 @@ class BaseTextFormField extends StatelessWidget {
       this.enabled = true,
       this.validator,
       this.textStyle,
-      this.placeholderTextStyle});
+      this.placeholderTextStyle,
+      this.maxLength});
 
   final TextEditingController controller;
   final TextInputType keyboardType;
@@ -42,6 +43,7 @@ class BaseTextFormField extends StatelessWidget {
   final FormFieldValidator<String> validator;
   final TextStyle placeholderTextStyle;
   final TextStyle textStyle;
+  final int maxLength;
 
   @override
   Widget build(BuildContext context) {
@@ -54,6 +56,7 @@ class BaseTextFormField extends StatelessWidget {
       maxLines: maxLines,
       inputFormatters: inputFormatters,
       enabled: enabled,
+      maxLength: maxLength,
       style: textStyle ?? TextStyle(
           fontSize: 16.0,
           color: textColor ?? Theme.of(context).primaryTextTheme.title.color),

lib/src/widgets/picker.dart

@@ -1,15 +1,20 @@
 import 'dart:ui';
+import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
+import 'package:cake_wallet/src/widgets/alert_background.dart';
+import 'package:cake_wallet/src/widgets/cake_scrollbar.dart';
+import 'package:cake_wallet/src/widgets/alert_close_button.dart';
 import 'package:cake_wallet/palette.dart';
 
-class Picker<Item extends Object> extends StatelessWidget {
+class Picker<Item extends Object> extends StatefulWidget {
   Picker({
     @required this.selectedAtIndex,
     @required this.items,
     this.images,
     @required this.title,
     @required this.onItemSelected,
-    this.mainAxisAlignment = MainAxisAlignment.start
+    this.mainAxisAlignment = MainAxisAlignment.start,
+    this.isAlwaysShowScrollThumb = false
   });
 
   final int selectedAtIndex;
@@ -18,28 +23,52 @@ class Picker<Item extends Object> extends StatelessWidget {
   final String title;
   final Function(Item) onItemSelected;
   final MainAxisAlignment mainAxisAlignment;
+  final bool isAlwaysShowScrollThumb;
+
+  @override
+  PickerState createState() => PickerState<Item>(items, images, onItemSelected);
+}
+
+class PickerState<Item> extends State<Picker> {
+  PickerState(this.items, this.images, this.onItemSelected);
+
+  final Function(Item) onItemSelected;
+  final List<Item> items;
+  final List<Image> images;
+
+  final closeButton = Image.asset('assets/images/close.png',
+    color: Palette.darkBlueCraiola,
+  );
+  ScrollController controller = ScrollController();
+
+  final double backgroundHeight = 193;
+  final double thumbHeight = 72;
+  double fromTop = 0;
 
   @override
   Widget build(BuildContext context) {
-    return GestureDetector(
+    controller.addListener(() {
-      onTap: () => Navigator.of(context).pop(),
+      fromTop = controller.hasClients
-      child: Container(
+          ? (controller.offset / controller.position.maxScrollExtent * (backgroundHeight - thumbHeight))
-        color: Colors.transparent,
+          : 0;
-        child: BackdropFilter(
+      setState(() {});
-          filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
+    });
-          child: Container(
+
-              decoration: BoxDecoration(color: PaletteDark.darkNightBlue.withOpacity(0.75)),
+    return AlertBackground(
-              child: Center(
+        child: Stack(
-                child: Column(
+          alignment: Alignment.center,
+          children: <Widget>[
+            Column(
               mainAxisSize: MainAxisSize.min,
               children: <Widget>[
                 Container(
                   padding: EdgeInsets.only(left: 24, right: 24),
                   child: Text(
-                        title,
+                    widget.title,
                     textAlign: TextAlign.center,
                     style: TextStyle(
                         fontSize: 18,
+                        fontFamily: 'Poppins',
                         fontWeight: FontWeight.bold,
                         decoration: TextDecoration.none,
                         color: Colors.white
@@ -54,23 +83,27 @@ class Picker<Item extends Object> extends StatelessWidget {
                       borderRadius: BorderRadius.all(Radius.circular(14)),
                       child: Container(
                           height: 233,
-                              color: Theme.of(context).accentTextTheme.title.backgroundColor,
+                          color: Theme.of(context).accentTextTheme.title.color,
-                              child: ListView.separated(
+                          child: Stack(
+                            alignment: Alignment.center,
+                            children: <Widget>[
+                              ListView.separated(
+                                controller: controller,
                                 separatorBuilder: (context, index) => Divider(
-                                  color: Theme.of(context).dividerColor,
+                                  color: Theme.of(context).accentTextTheme.title.backgroundColor,
                                   height: 1,
                                 ),
                                 itemCount: items == null ? 0 : items.length,
                                 itemBuilder: (context, index) {
                                   final item = items[index];
                                   final image = images != null? images[index] : null;
-                                  final isItemSelected = index == selectedAtIndex;
+                                  final isItemSelected = index == widget.selectedAtIndex;
 
                                   final color = isItemSelected
-                                      ? Theme.of(context).accentTextTheme.subtitle.decorationColor
+                                      ? Theme.of(context).textTheme.body2.color
-                                      : Colors.transparent;
+                                      : Theme.of(context).accentTextTheme.title.color;
                                   final textColor = isItemSelected
-                                      ? Colors.blue
+                                      ? Palette.blueCraiola
                                       : Theme.of(context).primaryTextTheme.title.color;
 
                                   return GestureDetector(
@@ -87,7 +120,7 @@ class Picker<Item extends Object> extends StatelessWidget {
                                       color: color,
                                       child: Row(
                                         mainAxisSize: MainAxisSize.max,
-                                        mainAxisAlignment: mainAxisAlignment,
+                                        mainAxisAlignment: widget.mainAxisAlignment,
                                         crossAxisAlignment: CrossAxisAlignment.center,
                                         children: <Widget>[
                                           image != null
@@ -101,7 +134,8 @@ class Picker<Item extends Object> extends StatelessWidget {
                                               item.toString(),
                                               style: TextStyle(
                                                 fontSize: 18,
-                                                fontWeight: FontWeight.bold,
+                                                fontFamily: 'Poppins',
+                                                fontWeight: FontWeight.w600,
                                                 color: textColor,
                                                 decoration: TextDecoration.none,
                                               ),
@@ -112,6 +146,15 @@ class Picker<Item extends Object> extends StatelessWidget {
                                     ),
                                   );
                                 },
+                              ),
+                              widget.isAlwaysShowScrollThumb
+                                  ? CakeScrollbar(
+                                  backgroundHeight: backgroundHeight,
+                                  thumbHeight: thumbHeight,
+                                  fromTop: fromTop
+                              )
+                                  : Offstage(),
+                            ],
                           )
                       ),
                     ),
@@ -119,10 +162,9 @@ class Picker<Item extends Object> extends StatelessWidget {
                 )
               ],
             ),
+            AlertCloseButton(image: closeButton)
+          ],
         )
-          ),
-        ),
-      ),
     );
   }
 }

lib/themes.dart

@@ -118,26 +118,24 @@ class Themes {
       )
     ),
     focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page)
-
-
-
-    cardColor: Palette.blueAlice,
-    cardTheme: CardTheme(
-      color: Colors.white, // synced card start
-    ),
-
-
     accentTextTheme: TextTheme(
       title: TextStyle(
-        color: Palette.darkLavender, // top panel
+        color: Colors.white, // picker background
-        backgroundColor: Palette.lavender, // bottom panel
+        backgroundColor: Palette.periwinkleCraiola, // picker divider
-        decorationColor: PaletteDark.distantBlue // select button background color
+        decorationColor: Colors.white // dialog background
       ),
       caption: TextStyle(
-        color: Palette.blue, // current wallet label
+        color: Palette.moderateLavender, // container (confirm exchange)
-        backgroundColor: Colors.white, // gradient start, wallet label
+        backgroundColor: Palette.moderateLavender, // button background (confirm exchange)
+
+
+
+
         decorationColor: Palette.lavender, // gradient end, wallet label
       ),
+
+
+
         subtitle: TextStyle(
             color: Palette.lightBlueGrey, // border color,  wallet label
             backgroundColor: Palette.lavender, // address field, wallet card
@@ -148,6 +146,16 @@ class Themes {
             backgroundColor: Palette.lavender // faq extension
         )
     ),
+
+
+
+    cardColor: Palette.blueAlice,
+    cardTheme: CardTheme(
+      color: Colors.white, // synced card start
+    ),
+
+
+
   );
 
 
@@ -266,27 +274,23 @@ class Themes {
       )
     ),
     focusColor: PaletteDark.moderateBlue, // text field button (exchange page)
-
-
-
-    cardColor: PaletteDark.darkNightBlue,
-    cardTheme: CardTheme(
-      color: PaletteDark.moderateBlue, // synced card start
-    ),
-
-
-
     accentTextTheme: TextTheme(
       title: TextStyle(
-        color: PaletteDark.moderateBlue, // top panel
+        color: PaletteDark.nightBlue, // picker background
-        backgroundColor: PaletteDark.lightNightBlue, // bottom panel
+        backgroundColor: PaletteDark.dividerColor, // picker divider
-        decorationColor: Colors.white // select button background color
+        decorationColor: PaletteDark.darkNightBlue // dialog background
       ),
       caption: TextStyle(
-        color: Colors.white, // current wallet label
+        color: PaletteDark.nightBlue, // container (confirm exchange)
-        backgroundColor: PaletteDark.distantBlue, // gradient start, wallet label
+        backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange)
+
+
+
         decorationColor: PaletteDark.nightBlue, // gradient end, wallet label
       ),
+
+
+
         subtitle: TextStyle(
             color: PaletteDark.darkNightBlue, // border color,  wallet label
             backgroundColor: PaletteDark.violetBlue, // address field, wallet card
@@ -297,6 +301,17 @@ class Themes {
             backgroundColor: PaletteDark.headerNightBlue // faq extension
         )
     ),
+
+
+
+    cardColor: PaletteDark.darkNightBlue,
+    cardTheme: CardTheme(
+      color: PaletteDark.moderateBlue, // synced card start
+    ),
+
+
+
+
   );
 
 }

lib/view_model/dashboard/dashboard_view_model.dart

@@ -108,7 +108,8 @@ abstract class DashboardViewModelBase with Store {
 
     _items
         .addAll(transactionFilterStore.filtered(transactions: transactions));
-    _items.addAll(tradeFilterStore.filtered(trades: trades));
+    //_items.addAll(tradeFilterStore.filtered(trades: trades));
+    _items.addAll(trades); // FIXME
 
     return formattedItemsList(_items);
   }

lib/view_model/exchange/exchange_view_model.dart

@@ -227,7 +227,7 @@ abstract class ExchangeViewModelBase with Store {
         }
       }
     } else {
-      tradeState = TradeIsCreatedFailure(error: S.current.error_text_limits_loading_failed("${provider.description}"));
+      tradeState = TradeIsCreatedFailure(error: S.current.error_text_limits_loading_failed('${provider.description}'));
     }
 
   }