diff --git a/example/lib/constants.dart b/example/lib/constants.dart
index 5ec7dc3a..a305b1ad 100644
--- a/example/lib/constants.dart
+++ b/example/lib/constants.dart
@@ -11,7 +11,7 @@ class AppConstants {
borderRadius: BorderRadius.circular(7),
borderSide: BorderSide(
width: 2,
- color: AppColors.primary,
+ color: AppColors.outlineVariant,
),
);
diff --git a/example/lib/theme/app_colors.dart b/example/lib/theme/app_colors.dart
index 253815dc..7ad16ef9 100644
--- a/example/lib/theme/app_colors.dart
+++ b/example/lib/theme/app_colors.dart
@@ -6,6 +6,8 @@ class AppColors {
static const Color primary = Color(0xffEF5366);
static const Color onPrimary = Color(0xfff0f0f0);
+ static const Color outlineVariant = Color(0xffd7c1c2);
+ static const Color outline = Color(0xff857373);
static const Color surfaceContainerLow = Color(0xfffff0f0);
static const Color black = Color(0xff626262);
static const Color radiantWhite = Color(0xffffffff);
diff --git a/example/lib/theme/app_theme.dart b/example/lib/theme/app_theme.dart
index 592afa36..6d4a1b2b 100644
--- a/example/lib/theme/app_theme.dart
+++ b/example/lib/theme/app_theme.dart
@@ -6,6 +6,46 @@ import 'package:flutter/material.dart';
import 'dark_app_colors.dart';
class AppTheme {
+ // Base InputDecorationTheme
+ static final baseInputDecorationTheme = InputDecorationTheme(
+ border: AppConstants.inputBorder,
+ disabledBorder: AppConstants.inputBorder,
+ errorBorder: AppConstants.inputBorder.copyWith(
+ borderSide: BorderSide(
+ width: 2,
+ color: AppColors.red,
+ ),
+ ),
+ enabledBorder: AppConstants.inputBorder,
+ focusedBorder: AppConstants.inputBorder.copyWith(
+ borderSide: BorderSide(
+ width: 2,
+ color: AppColors.outline,
+ ),
+ ),
+ focusedErrorBorder: AppConstants.inputBorder,
+ hintStyle: TextStyle(
+ color: AppColors.black,
+ fontSize: 17,
+ ),
+ labelStyle: TextStyle(
+ color: AppColors.black,
+ fontSize: 17,
+ ),
+ helperStyle: TextStyle(
+ color: AppColors.black,
+ fontSize: 17,
+ ),
+ errorStyle: TextStyle(
+ color: AppColors.red,
+ fontSize: 12,
+ ),
+ contentPadding: EdgeInsets.symmetric(
+ vertical: 10,
+ horizontal: 20,
+ ),
+ );
+
// Light theme
static final light = CalendarTheme.light.copyWith(
// TODO(Shubham): Reorder
@@ -18,10 +58,7 @@ class AppTheme {
floatingActionButtonTheme: FloatingActionButtonThemeData(
backgroundColor: AppColors.primary,
),
- inputDecorationTheme: InputDecorationTheme(
- border: AppConstants.inputBorder,
- focusedBorder: AppConstants.inputBorder,
- ),
+ inputDecorationTheme: baseInputDecorationTheme,
appBarTheme: AppBarTheme(
backgroundColor: AppColors.primary,
foregroundColor: AppColors.onPrimary,
@@ -45,6 +82,26 @@ class AppTheme {
foregroundColor: DarkAppColors.onPrimary,
),
),
+ inputDecorationTheme: baseInputDecorationTheme.copyWith(
+ disabledBorder: AppConstants.inputBorder.copyWith(
+ borderSide: BorderSide(
+ width: 2,
+ color: DarkAppColors.outlineVariant,
+ ),
+ ),
+ enabledBorder: AppConstants.inputBorder.copyWith(
+ borderSide: BorderSide(
+ width: 2,
+ color: DarkAppColors.outlineVariant,
+ ),
+ ),
+ focusedBorder: AppConstants.inputBorder.copyWith(
+ borderSide: BorderSide(
+ width: 2,
+ color: DarkAppColors.outline,
+ ),
+ ),
+ ),
floatingActionButtonTheme: FloatingActionButtonThemeData(
backgroundColor: DarkAppColors.primary,
),
diff --git a/example/lib/theme/dark_app_colors.dart b/example/lib/theme/dark_app_colors.dart
index 9f5a7703..a5ec0a7d 100644
--- a/example/lib/theme/dark_app_colors.dart
+++ b/example/lib/theme/dark_app_colors.dart
@@ -5,4 +5,6 @@ class DarkAppColors {
static const Color primary = Color(0xffffb3b6);
static const Color onPrimary = Color(0xff561d23);
+ static const Color outline = Color(0xff9f8c8c);
+ static const Color outlineVariant = Color(0xff524343);
}
diff --git a/example/lib/widgets/add_event_form.dart b/example/lib/widgets/add_event_form.dart
index fa6cc441..f9702456 100644
--- a/example/lib/widgets/add_event_form.dart
+++ b/example/lib/widgets/add_event_form.dart
@@ -72,12 +72,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
children: [
TextFormField(
controller: _titleController,
- decoration: AppConstants.inputDecoration.copyWith(
+ decoration: InputDecoration(
labelText: "Event Title",
labelStyle: TextStyle(
color: color.onSurfaceVariant,
),
- ),
+ ).applyDefaults(Theme.of(context).inputDecorationTheme),
style: TextStyle(
color: color.onSurface,
fontSize: 17.0,
@@ -101,12 +101,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
children: [
Expanded(
child: DateTimeSelectorFormField(
- decoration: AppConstants.inputDecoration.copyWith(
+ decoration: InputDecoration(
labelText: "Start Date",
labelStyle: TextStyle(
color: color.onSurfaceVariant,
),
- ),
+ ).applyDefaults(Theme.of(context).inputDecorationTheme),
initialDateTime: _startDate,
onSelect: (date) {
if (date.withoutTime.withoutTime
@@ -140,12 +140,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
Expanded(
child: DateTimeSelectorFormField(
initialDateTime: _endDate,
- decoration: AppConstants.inputDecoration.copyWith(
+ decoration: InputDecoration(
labelText: "End Date",
labelStyle: TextStyle(
color: color.onSurfaceVariant,
),
- ),
+ ).applyDefaults(Theme.of(context).inputDecorationTheme),
onSelect: (date) {
if (date.withoutTime.withoutTime
.isBefore(_startDate.withoutTime)) {
@@ -184,12 +184,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
children: [
Expanded(
child: DateTimeSelectorFormField(
- decoration: AppConstants.inputDecoration.copyWith(
+ decoration: InputDecoration(
labelText: "Start Time",
labelStyle: TextStyle(
color: color.onSurfaceVariant,
),
- ),
+ ).applyDefaults(Theme.of(context).inputDecorationTheme),
initialDateTime: _startTime,
minimumDateTime: CalendarConstants.epochDate,
onSelect: (date) {
@@ -214,12 +214,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
SizedBox(width: 20.0),
Expanded(
child: DateTimeSelectorFormField(
- decoration: AppConstants.inputDecoration.copyWith(
+ decoration: InputDecoration(
labelText: "End Time",
labelStyle: TextStyle(
color: color.onSurfaceVariant,
),
- ),
+ ).applyDefaults(Theme.of(context).inputDecorationTheme),
initialDateTime: _endTime,
onSelect: (date) {
if (_startTime != null &&
@@ -268,10 +268,10 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
return null;
},
- decoration: AppConstants.inputDecoration.copyWith(
+ decoration: InputDecoration(
hintText: "Event Description",
counterStyle: TextStyle(color: color.onSurfaceVariant),
- ),
+ ).applyDefaults(Theme.of(context).inputDecorationTheme),
),
Align(
alignment: Alignment.centerLeft,
@@ -478,9 +478,9 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
if (_selectedRecurrenceEnd == RecurrenceEnd.onDate)
DateTimeSelectorFormField(
initialDateTime: _recurrenceEndDate,
- decoration: AppConstants.inputDecoration.copyWith(
+ decoration: InputDecoration(
labelText: 'Ends on',
- ),
+ ).applyDefaults(Theme.of(context).inputDecorationTheme),
onSelect: (date) {
if (date.withoutTime.isBefore(_endDate.withoutTime)) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(