Skip to content

Commit 420ed38

Browse files
author
Shubham Jitiya
committed
🚧 Update text form field border
1 parent bc29236 commit 420ed38

File tree

5 files changed

+80
-19
lines changed

5 files changed

+80
-19
lines changed

‎example/lib/constants.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ class AppConstants {
1111
borderRadius: BorderRadius.circular(7),
1212
borderSide: BorderSide(
1313
width: 2,
14-
color: AppColors.primary,
14+
color: AppColors.outlineVariant,
1515
),
1616
);
1717

‎example/lib/theme/app_colors.dart‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ class AppColors {
66

77
static const Color primary = Color(0xffEF5366);
88
static const Color onPrimary = Color(0xfff0f0f0);
9+
static const Color outlineVariant = Color(0xffd7c1c2);
10+
static const Color outline = Color(0xff857373);
911
static const Color surfaceContainerLow = Color(0xfffff0f0);
1012
static const Color black = Color(0xff626262);
1113
static const Color radiantWhite = Color(0xffffffff);

‎example/lib/theme/app_theme.dart‎

Lines changed: 61 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,46 @@ import 'package:flutter/material.dart';
66
import 'dark_app_colors.dart';
77

88
class AppTheme {
9+
// Base InputDecorationTheme
10+
static final baseInputDecorationTheme = InputDecorationTheme(
11+
border: AppConstants.inputBorder,
12+
disabledBorder: AppConstants.inputBorder,
13+
errorBorder: AppConstants.inputBorder.copyWith(
14+
borderSide: BorderSide(
15+
width: 2,
16+
color: AppColors.red,
17+
),
18+
),
19+
enabledBorder: AppConstants.inputBorder,
20+
focusedBorder: AppConstants.inputBorder.copyWith(
21+
borderSide: BorderSide(
22+
width: 2,
23+
color: AppColors.outline,
24+
),
25+
),
26+
focusedErrorBorder: AppConstants.inputBorder,
27+
hintStyle: TextStyle(
28+
color: AppColors.black,
29+
fontSize: 17,
30+
),
31+
labelStyle: TextStyle(
32+
color: AppColors.black,
33+
fontSize: 17,
34+
),
35+
helperStyle: TextStyle(
36+
color: AppColors.black,
37+
fontSize: 17,
38+
),
39+
errorStyle: TextStyle(
40+
color: AppColors.red,
41+
fontSize: 12,
42+
),
43+
contentPadding: EdgeInsets.symmetric(
44+
vertical: 10,
45+
horizontal: 20,
46+
),
47+
);
48+
949
// Light theme
1050
static final light = CalendarTheme.light.copyWith(
1151
// TODO(Shubham): Reorder
@@ -18,10 +58,7 @@ class AppTheme {
1858
floatingActionButtonTheme: FloatingActionButtonThemeData(
1959
backgroundColor: AppColors.primary,
2060
),
21-
inputDecorationTheme: InputDecorationTheme(
22-
border: AppConstants.inputBorder,
23-
focusedBorder: AppConstants.inputBorder,
24-
),
61+
inputDecorationTheme: baseInputDecorationTheme,
2562
appBarTheme: AppBarTheme(
2663
backgroundColor: AppColors.primary,
2764
foregroundColor: AppColors.onPrimary,
@@ -45,6 +82,26 @@ class AppTheme {
4582
foregroundColor: DarkAppColors.onPrimary,
4683
),
4784
),
85+
inputDecorationTheme: baseInputDecorationTheme.copyWith(
86+
disabledBorder: AppConstants.inputBorder.copyWith(
87+
borderSide: BorderSide(
88+
width: 2,
89+
color: DarkAppColors.outlineVariant,
90+
),
91+
),
92+
enabledBorder: AppConstants.inputBorder.copyWith(
93+
borderSide: BorderSide(
94+
width: 2,
95+
color: DarkAppColors.outlineVariant,
96+
),
97+
),
98+
focusedBorder: AppConstants.inputBorder.copyWith(
99+
borderSide: BorderSide(
100+
width: 2,
101+
color: DarkAppColors.outline,
102+
),
103+
),
104+
),
48105
floatingActionButtonTheme: FloatingActionButtonThemeData(
49106
backgroundColor: DarkAppColors.primary,
50107
),

‎example/lib/theme/dark_app_colors.dart‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,6 @@ class DarkAppColors {
55

66
static const Color primary = Color(0xffffb3b6);
77
static const Color onPrimary = Color(0xff561d23);
8+
static const Color outline = Color(0xff9f8c8c);
9+
static const Color outlineVariant = Color(0xff524343);
810
}

‎example/lib/widgets/add_event_form.dart‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -72,12 +72,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
7272
children: [
7373
TextFormField(
7474
controller: _titleController,
75-
decoration: AppConstants.inputDecoration.copyWith(
75+
decoration: InputDecoration(
7676
labelText: "Event Title",
7777
labelStyle: TextStyle(
7878
color: color.onSurfaceVariant,
7979
),
80-
),
80+
).applyDefaults(Theme.of(context).inputDecorationTheme),
8181
style: TextStyle(
8282
color: color.onSurface,
8383
fontSize: 17.0,
@@ -101,12 +101,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
101101
children: [
102102
Expanded(
103103
child: DateTimeSelectorFormField(
104-
decoration: AppConstants.inputDecoration.copyWith(
104+
decoration: InputDecoration(
105105
labelText: "Start Date",
106106
labelStyle: TextStyle(
107107
color: color.onSurfaceVariant,
108108
),
109-
),
109+
).applyDefaults(Theme.of(context).inputDecorationTheme),
110110
initialDateTime: _startDate,
111111
onSelect: (date) {
112112
if (date.withoutTime.withoutTime
@@ -140,12 +140,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
140140
Expanded(
141141
child: DateTimeSelectorFormField(
142142
initialDateTime: _endDate,
143-
decoration: AppConstants.inputDecoration.copyWith(
143+
decoration: InputDecoration(
144144
labelText: "End Date",
145145
labelStyle: TextStyle(
146146
color: color.onSurfaceVariant,
147147
),
148-
),
148+
).applyDefaults(Theme.of(context).inputDecorationTheme),
149149
onSelect: (date) {
150150
if (date.withoutTime.withoutTime
151151
.isBefore(_startDate.withoutTime)) {
@@ -184,12 +184,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
184184
children: [
185185
Expanded(
186186
child: DateTimeSelectorFormField(
187-
decoration: AppConstants.inputDecoration.copyWith(
187+
decoration: InputDecoration(
188188
labelText: "Start Time",
189189
labelStyle: TextStyle(
190190
color: color.onSurfaceVariant,
191191
),
192-
),
192+
).applyDefaults(Theme.of(context).inputDecorationTheme),
193193
initialDateTime: _startTime,
194194
minimumDateTime: CalendarConstants.epochDate,
195195
onSelect: (date) {
@@ -214,12 +214,12 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
214214
SizedBox(width: 20.0),
215215
Expanded(
216216
child: DateTimeSelectorFormField(
217-
decoration: AppConstants.inputDecoration.copyWith(
217+
decoration: InputDecoration(
218218
labelText: "End Time",
219219
labelStyle: TextStyle(
220220
color: color.onSurfaceVariant,
221221
),
222-
),
222+
).applyDefaults(Theme.of(context).inputDecorationTheme),
223223
initialDateTime: _endTime,
224224
onSelect: (date) {
225225
if (_startTime != null &&
@@ -268,10 +268,10 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
268268

269269
return null;
270270
},
271-
decoration: AppConstants.inputDecoration.copyWith(
271+
decoration: InputDecoration(
272272
hintText: "Event Description",
273273
counterStyle: TextStyle(color: color.onSurfaceVariant),
274-
),
274+
).applyDefaults(Theme.of(context).inputDecorationTheme),
275275
),
276276
Align(
277277
alignment: Alignment.centerLeft,
@@ -478,9 +478,9 @@ class _AddOrEditEventFormState extends State<AddOrEditEventForm> {
478478
if (_selectedRecurrenceEnd == RecurrenceEnd.onDate)
479479
DateTimeSelectorFormField(
480480
initialDateTime: _recurrenceEndDate,
481-
decoration: AppConstants.inputDecoration.copyWith(
481+
decoration: InputDecoration(
482482
labelText: 'Ends on',
483-
),
483+
).applyDefaults(Theme.of(context).inputDecorationTheme),
484484
onSelect: (date) {
485485
if (date.withoutTime.isBefore(_endDate.withoutTime)) {
486486
ScaffoldMessenger.of(context).showSnackBar(SnackBar(

0 commit comments

Comments
 (0)