Preliminary code for the event list tile, layout and title

lib/src/mixins/tile_mixin.dart

@@ -0,0 +1,13 @@
+import 'package:flutter/material.dart';
+
+mixin Tile {
+  BoxDecoration tileDecoration(BuildContext context) {
+    return BoxDecoration(
+      color: Theme.of(context).cardColor,
+      borderRadius: BorderRadius.only(
+        topRight: Radius.circular(8),
+        bottomRight: Radius.circular(8),
+      ),
+    );
+  }
+}

lib/src/screens/events_screen.dart

@@ -1,7 +1,9 @@
 import 'package:flutter/material.dart' hide AppBar;
 
 import '../blocs/events_bloc.dart';
+import '../models/event_model.dart';
 import '../widgets/app_bar.dart';
+import '../widgets/event_list_tile.dart';
 import '../widgets/populated_drawer.dart';
 
 class EventsScreen extends StatefulWidget {
@@ -24,6 +26,7 @@ class _EventsScreenState extends State<EventsScreen> {
           userDisplayName = userSnap.data.displayName;
           userEmail = userSnap.data.email;
         }
+
         return Scaffold(
           drawer: PopulatedDrawer(
             userAvatarUrl: userAvatarUrl,
@@ -35,6 +38,23 @@ class _EventsScreenState extends State<EventsScreen> {
             title: 'My Events',
             hasDrawer: true,
           ),
+          body: ListView(
+            padding: EdgeInsets.only(top: 15),
+            children: <Widget>[
+              EventListTile(
+                event: EventModel(
+                  id: '1',
+                  name: 'Math',
+                  pendigTasks: 3,
+                  media: <String>[],
+                  when: <bool>[],
+                  highPriority: 2,
+                  mediumPriority: 1,
+                  lowPriority: 0,
+                ),
+              )
+            ],
+          ),
         );
       },
     );

lib/src/utils.dart

@@ -20,6 +20,19 @@ const kSmallTextStyle = TextStyle(
   fontSize: 16,
   fontWeight: FontWeight.w500,
 );
+
+const kTileBigTextStyle = TextStyle(
+  color: Colors.white,
+  fontSize: 24,
+  fontWeight: FontWeight.bold,
+);
+
+const kTileSubtitleStyle = TextStyle(
+  color: Colors.white,
+  fontSize: 10,
+  fontWeight: FontWeight.w300,
+);
+
 const kBlueGradient = LinearGradient(
   begin: Alignment.topLeft,
   end: Alignment.bottomRight,

lib/src/widgets/event_list_tile.dart

@@ -0,0 +1,42 @@
+import 'package:flutter/material.dart';
+
+import '../models/event_model.dart';
+import '../mixins/tile_mixin.dart';
+import '../utils.dart';
+
+class EventListTile extends StatelessWidget with Tile {
+  final EventModel event;
+
+  EventListTile({@required this.event}) : assert(event != null);
+
+  Widget build(BuildContext context) {
+    return FractionallySizedBox(
+      alignment: Alignment.centerLeft,
+      widthFactor: .95,
+      child: Container(
+        height: 85,
+        child: Stack(
+          children: <Widget>[
+            Container(
+              padding: EdgeInsets.all(8),
+              child: Row(
+                children: <Widget>[
+                  Column(
+                    children: <Widget>[
+                      Text(
+                        event.name,
+                        style: kTileBigTextStyle,
+                      ),
+                    ],
+                  ),
+                  Column(),
+                ],
+              ),
+            ),
+          ],
+        ),
+        decoration: tileDecoration(context),
+      ),
+    );
+  }
+}

lib/src/widgets/task_list_tile.dart

@@ -1,12 +1,13 @@
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 
+import '../mixins/tile_mixin.dart';
 import '../models/task_model.dart';
 import '../utils.dart';
 import '../widgets/action_button.dart';
 
 /// A card that visually represents a task.
-class TaskListTile extends StatelessWidget {
+class TaskListTile extends StatelessWidget with Tile {
   /// Task model which this card represents.
   final TaskModel task;
 
@@ -79,19 +80,11 @@ class TaskListTile extends StatelessWidget {
           ),
           Text(
             task.event,
-            style: TextStyle(
+            style: kTileBigTextStyle,
-              color: Colors.white,
-              fontSize: 24,
-              fontWeight: FontWeight.bold,
-            ),
           ),
           Text(
             task.text,
-            style: TextStyle(
+            style: kTileSubtitleStyle,
-              color: Colors.white,
-              fontSize: 10,
-              fontWeight: FontWeight.w300,
-            ),
           ),
         ],
       ),
@@ -169,14 +162,4 @@ class TaskListTile extends StatelessWidget {
       ),
     );
   }
-
-  BoxDecoration tileDecoration(BuildContext context) {
-    return BoxDecoration(
-      color: Theme.of(context).cardColor,
-      borderRadius: BorderRadius.only(
-        topRight: Radius.circular(8),
-        bottomRight: Radius.circular(8),
-      ),
-    );
-  }
 }