feat: Adding responsive dashboard

client/lib/constants/color_constants.dart

@@ -0,0 +1,10 @@
+import 'package:flutter/material.dart';
+
+class ColorConstants {
+  const ColorConstants._();
+  static const Color primary = Color(0xFFFF8714);
+  static const Color onPrimary = Color(0xFF000000);
+  static const Color secondary = Color(0xFFF5F5F5);
+  static const Color onsecondary = Color(0xFFFFFFFF);
+  static const Color background = Color(0xFFFFFFFF);
+}

client/lib/constants/resources.dart

@@ -0,0 +1,9 @@
+class Resources {
+  const Resources._();
+  static const String icon = 'icons/logo.svg';
+  static const String iconwithtext = 'icons/logo_with_text.svg';
+  static const String active = 'icons/group.svg';
+  static const String joined = 'icons/joined-group.svg';
+  static const String create = 'icons/add-group.svg';
+  static const String logout = 'icons/sign-out.svg';
+}

client/lib/layout.dart

@@ -0,0 +1,28 @@
+import 'package:client/widgets/dash_board_contents.dart';
+import 'package:client/widgets/side_menu.dart';
+import 'package:client/widgets/top_nav.dart';
+import 'package:flutter/material.dart';
+import 'package:responsive_builder/responsive_builder.dart';
+
+class SiteLayout extends StatelessWidget {
+  const SiteLayout({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      key: scaffoldKey,
+      extendBodyBehindAppBar: true,
+      appBar: topNavigationBar(context, scaffoldKey),
+      drawer: const Drawer(
+        child: SideMenu(),
+      ),
+      body: ScreenTypeLayout(
+        mobile: const Padding(
+          padding: EdgeInsets.symmetric(horizontal: 16),
+        ),
+        desktop: const DashBoardContent(),
+        tablet: const DashBoardContent(),
+      ),
+    );
+  }
+}

client/lib/main.dart

@@ -1,3 +1,5 @@
+import 'package:client/layout.dart';
+import 'package:client/themes/theme_constants.dart';
 import 'package:flutter/material.dart';
 
 void main() {
@@ -7,64 +9,13 @@ void main() {
 class MyApp extends StatelessWidget {
   const MyApp({Key? key}) : super(key: key);
 
-  // This widget is the root of your application.
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
-      title: 'Flutter Demo',
-      theme: ThemeData(
-        primarySwatch: Colors.blue,
-      ),
-      home: const MyHomePage(title: 'Flutter Demo Home Page'),
-    );
-  }
-}
-
-class MyHomePage extends StatefulWidget {
-  const MyHomePage({Key? key, required this.title}) : super(key: key);
-
-  final String title;
-
-  @override
-  State<MyHomePage> createState() => _MyHomePageState();
-}
-
-class _MyHomePageState extends State<MyHomePage> {
-  int _counter = 0;
-
-  void _incrementCounter() {
-    setState(() {
-      _counter++;
-    });
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      appBar: AppBar(
-        title: Text(widget.title),
-      ),
-      body: Center(
-        // Center is a layout widget. It takes a single child and positions it
-        // in the middle of the parent.
-        child: Column(
-          mainAxisAlignment: MainAxisAlignment.center,
-          children: <Widget>[
-            const Text(
-              'You have pushed the button this many times:',
-            ),
-            Text(
-              '$_counter',
-              style: Theme.of(context).textTheme.headline4,
-            ),
-          ],
-        ),
-      ),
-      floatingActionButton: FloatingActionButton(
-        onPressed: _incrementCounter,
-        tooltip: 'Increment',
-        child: const Icon(Icons.add),
-      ), // This trailing comma makes auto-formatting nicer for build methods.
+      debugShowCheckedModeBanner: false,
+      title: 'Dashboard',
+      theme: lightTheme,
+      home: const SiteLayout(),
     );
   }
 }

client/lib/routing/routes.dart

@@ -0,0 +1,3 @@
+String activeGroupRoute = '/';
+String joinedGroupRoute = '/joinedgroup';
+String createGroupRoute = '/creategroup';

client/lib/screens/activegroup/active_group.dart

@@ -0,0 +1,12 @@
+import 'package:flutter/material.dart';
+
+class ActiveGroup extends StatelessWidget {
+  const ActiveGroup({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return const Center(
+      child: Text('active group'),
+    );
+  }
+}

client/lib/screens/creategroup/create_group.dart

@@ -0,0 +1,12 @@
+import 'package:flutter/material.dart';
+
+class CreateGroup extends StatelessWidget {
+  const CreateGroup({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return const Center(
+      child: Text('create group'),
+    );
+  }
+}

client/lib/screens/joinedgroup/joined_group.dart

@@ -0,0 +1,10 @@
+import 'package:flutter/material.dart';
+
+class JoinedGroup extends StatelessWidget {
+  const JoinedGroup({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return const Center(child: Text('joined group'));
+  }
+}

client/lib/themes/theme_constants.dart

@@ -0,0 +1,70 @@
+import 'package:client/constants/color_constants.dart';
+import 'package:flutter/material.dart';
+
+const double appPadding = 16.0;
+
+ThemeData lightTheme = ThemeData(
+  brightness: Brightness.light,
+  primaryColor: ColorConstants.primary,
+  floatingActionButtonTheme: const FloatingActionButtonThemeData(
+    backgroundColor: ColorConstants.primary,
+  ),
+  elevatedButtonTheme: ElevatedButtonThemeData(
+    style: ButtonStyle(
+      shape: MaterialStateProperty.all<OutlinedBorder>(
+        RoundedRectangleBorder(
+          borderRadius: BorderRadius.circular(20.0),
+        ),
+      ),
+      backgroundColor: MaterialStateProperty.all<Color>(ColorConstants.primary),
+    ),
+  ),
+  inputDecorationTheme: InputDecorationTheme(
+    border: OutlineInputBorder(
+      borderRadius: BorderRadius.circular(15),
+      borderSide: BorderSide.none,
+    ),
+    filled: true,
+    suffixIconColor: Colors.grey,
+    contentPadding: const EdgeInsetsDirectional.only(start: 30),
+  ),
+  appBarTheme: const AppBarTheme(
+    backgroundColor: ColorConstants.primary,
+    iconTheme: IconThemeData(color: ColorConstants.onPrimary),
+    titleTextStyle: TextStyle(
+      color: ColorConstants.onPrimary,
+      fontSize: 16,
+    ),
+  ),
+  textTheme: const TextTheme(
+    headline1: TextStyle(
+      fontSize: 45.0,
+      fontWeight: FontWeight.bold,
+      color: Colors.black,
+    ),
+    headline2: TextStyle(
+      fontSize: 24.0,
+      fontWeight: FontWeight.bold,
+      color: Colors.black,
+    ),
+    headline3: TextStyle(
+      fontSize: 18.0,
+      fontWeight: FontWeight.bold,
+    ),
+    headline4: TextStyle(
+      fontSize: 16.0,
+      fontWeight: FontWeight.bold,
+      color: Colors.black,
+    ),
+    bodyText2: TextStyle(
+      fontSize: 14,
+      letterSpacing: 0.5,
+    ),
+    subtitle1: TextStyle(
+      fontSize: 14.0,
+    ),
+    subtitle2: TextStyle(
+      fontSize: 12.0,
+    ),
+  ),
+);

client/lib/widgets/dash_board_contents.dart

@@ -0,0 +1,31 @@
+import 'package:client/screens/activegroup/active_group.dart';
+import 'package:client/widgets/side_menu.dart';
+
+import 'package:flutter/material.dart';
+
+class DashBoardContent extends StatefulWidget {
+  const DashBoardContent({Key? key}) : super(key: key);
+
+  @override
+  DashState createState() => DashState();
+}
+
+class DashState extends State<DashBoardContent> {
+  int selectedIndex = 0;
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: const [
+        Expanded(
+          child: SideMenu(),
+        ),
+        Expanded(
+          flex: 5,
+          child: ActiveGroup(),
+        ),
+      ],
+    );
+  }
+}