add theme colors

c3k4ah · Apr 28, 2024 · aa072ca · aa072ca
1 parent ffe59ee
commit aa072ca
Show file tree

Hide file tree

Showing 13 changed files with 310 additions and 134 deletions.
diff --git a/lib/app.dart b/lib/app.dart
@@ -0,0 +1,68 @@
+import 'package:bamboo/foundation/breakpoint.dart';
+
+import 'package:flutter/material.dart';
+import 'package:theme_provider/theme_provider.dart';
+
+import 'core/theme/app_theme.dart';
+import 'pages/home/home.dart';
+
+class MyApp extends StatelessWidget {
+  const MyApp({super.key});
+
+  // This widget is the root of your application.
+  @override
+  Widget build(BuildContext context) {
+    ApplicationTheme appTheme = ApplicationTheme(context);
+    return BambooBreakPoint(
+      mobile: 576,
+      tablet: 768,
+      desktop: 1024,
+      child: ThemeProvider(
+        themes: [
+          AppTheme(
+            id: 'dark_theme',
+            description: 'theme de couleur orange',
+            data: appTheme.darkTheme,
+          ),
+          AppTheme(
+            id: 'orange_theme',
+            description: 'theme de couleur orange',
+            data: appTheme.orangeTheme,
+          ),
+          AppTheme(
+            id: 'blue_theme',
+            description: 'theme de couleur orange',
+            data: appTheme.blueTheme,
+          ),
+          AppTheme(
+            id: 'green_theme',
+            description: 'theme de couleur orange',
+            data: appTheme.greenTheme,
+          ),
+          AppTheme(
+            id: 'brown_theme',
+            description: 'theme de couleur orange',
+            data: appTheme.brownTheme,
+          ),
+          AppTheme(
+            id: 'purple_theme',
+            description: 'theme de couleur orange',
+            data: appTheme.purlpleTheme,
+          ),
+        ],
+        child: ThemeConsumer(
+          child: Builder(
+            builder: (themeContext) {
+              return MaterialApp(
+                title: 'DOMINICK',
+                debugShowCheckedModeBanner: false,
+                theme: ThemeProvider.themeOf(themeContext).data,
+                home: const HomePage(),
+              );
+            },
+          ),
+        ),
+      ),
+    );
+  }
+}
diff --git a/lib/core/theme/app_theme.dart b/lib/core/theme/app_theme.dart
@@ -2,9 +2,9 @@ import 'package:flutter/material.dart';
 
 import 'app_color.dart';
 
-class AppTheme {
+class ApplicationTheme {
   final BuildContext context;
-  AppTheme(this.context);
+  ApplicationTheme(this.context);
 
   AppColors colors(context) => Theme.of(context).extension<AppColors>()!;
 

diff --git a/lib/core/utils/sizes/responsive.dart b/lib/core/utils/sizes/responsive.dart
@@ -74,8 +74,10 @@ class ResponsiveSize {
       return tablet;
     } else if (size.width >= 500) {
       return mobileLarge;
-    } else if (size.width >= 300) {
-      return small ?? mobile;
+    } else if (size.width >= 390) {
+      return mobile;
+    } else if (small != null && size.width >= 300) {
+      return small;
     } else {
       return mobile;
     }

diff --git a/lib/main.dart b/lib/main.dart
@@ -1,40 +1,12 @@
-import 'package:bamboo/foundation/breakpoint.dart';
 import 'package:device_preview/device_preview.dart';
 import 'package:flutter/material.dart';
-import 'package:meta_seo/meta_seo.dart';
-import 'package:flutter/foundation.dart';
-import 'core/theme/app_theme.dart';
-import 'pages/home/home.dart';
+import 'app.dart';
 
 void main() {
-  if (kIsWeb) {
-    MetaSEO().config();
-  }
   runApp(
     DevicePreview(
       enabled: false,
       builder: (context) => const MyApp(), // Wrap your app
     ),
   );
 }
-
-class MyApp extends StatelessWidget {
-  const MyApp({super.key});
-
-  // This widget is the root of your application.
-  @override
-  Widget build(BuildContext context) {
-    AppTheme appTheme = AppTheme(context);
-    return BambooBreakPoint(
-      mobile: 576,
-      tablet: 768,
-      desktop: 1024,
-      child: MaterialApp(
-        title: 'DOMINICK',
-        debugShowCheckedModeBanner: false,
-        theme: appTheme.greenTheme,
-        home: const HomePage(),
-      ),
-    );
-  }
-}
diff --git a/lib/pages/home/home.dart b/lib/pages/home/home.dart
@@ -8,6 +8,7 @@ import 'parts/footer/footer_v2.dart';
 import 'parts/part.dart';
 // ignore: unused_import
 import 'parts/widgets/app_bar.dart';
+import 'parts/widgets/floating_btt.dart';
 
 class HomePage extends StatefulWidget {
   const HomePage({super.key});
@@ -40,6 +41,9 @@ class _HomePageState extends State<HomePage> {
       // appBar: AppBarWidget(
       //   controller: _scrollController,
       // ),
+      floatingActionButton: FloatingColorBtt(
+        controller: _scrollController,
+      ),
       body: Container(
         color: Colors.grey.shade900,
         child: Container(

diff --git a/lib/pages/home/parts/footer/footer_v2.dart b/lib/pages/home/parts/footer/footer_v2.dart
@@ -6,6 +6,7 @@ import '../../../../core/theme/app_color.dart';
 import '../../../../data/image_assets.dart';
 import '../../../../data/social_media.dart';
 import '../../../../models/social_media_model.dart';
+import '../widgets/icon_and_title_widet.dart';
 import '../widgets/my_footer_widget.dart';
 
 class FooterPartV2 extends StatelessWidget {
@@ -16,8 +17,8 @@ class FooterPartV2 extends StatelessWidget {
     final themeColor = Theme.of(context).extension<AppColors>()!;
     double textSize = ResponsiveSize.number(
       context: context,
-      small: 10,
-      mobile: 12,
+      // small: 15,
+      mobile: 15,
       tablet: 20,
       mobileLarge: 15,
       desktop: 20,
@@ -36,6 +37,7 @@ class FooterPartV2 extends StatelessWidget {
       width: MediaQuery.sizeOf(context).width,
       height: ResponsiveSize.number(
         context: context,
+        small: MediaQuery.sizeOf(context).height * .3,
         mobile: MediaQuery.sizeOf(context).height * .25,
         tablet: 340,
         mobileLarge: MediaQuery.sizeOf(context).height * .6,
@@ -46,33 +48,20 @@ class FooterPartV2 extends StatelessWidget {
         mainAxisAlignment: MainAxisAlignment.spaceAround,
         crossAxisAlignment: CrossAxisAlignment.center,
         children: [
-          Expanded(
-            flex: 2,
-            child: Container(
-              // height: imageSize,
-              margin: EdgeInsets.symmetric(
-                horizontal: ResponsiveSize.number(
-                  context: context,
-                  mobile: 20,
-                  tablet: 20,
-                  mobileLarge: 10,
-                  desktop: 30,
-                ),
-              ),
-              decoration: BoxDecoration(
-                image: DecorationImage(
-                  image: AssetImage(
-                    imageAsset.cekahLogo,
-                  ),
-                  fit: BoxFit.fitWidth,
-                ),
-              ),
+          Responsive(
+            mobile: const SizedBox(),
+            desktop: logoPart(
+              context: context,
+              themeColor: themeColor,
+            ),
+            tablet: logoPart(
+              context: context,
+              themeColor: themeColor,
+            ),
+            mobileLarge: logoPart(
+              context: context,
+              themeColor: themeColor,
             ),
-          ),
-          VerticalDivider(
-            color: themeColor.whiteColor,
-            width: 2,
-            thickness: 1,
           ),
           Expanded(
             flex: 4,
@@ -91,21 +80,9 @@ class FooterPartV2 extends StatelessWidget {
                 mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                 crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
-                  SizedBox(
-                    child: Text(
-                      'Mes coordonnées :',
-                      style: TextStyle(
-                        color: themeColor.whiteColor,
-                        fontSize: ResponsiveSize.number(
-                          context: context,
-                          mobile: 25,
-                          desktop: 40,
-                          mobileLarge: 40,
-                          tablet: 40,
-                        ),
-                        fontWeight: FontWeight.normal,
-                      ),
-                    ),
+                  const BigTitileWidget(
+                    title: 'Mes coordonnées :',
+                    svgIcon: '',
                   ),
                   Column(
                     mainAxisAlignment: MainAxisAlignment.spaceBetween,
@@ -156,6 +133,46 @@ class FooterPartV2 extends StatelessWidget {
     );
   }
 
+  Widget logoPart({
+    required BuildContext context,
+    required AppColors themeColor,
+  }) {
+    return Expanded(
+      flex: 2,
+      child: Row(
+        children: [
+          Expanded(
+            child: Container(
+              // height: imageSize,
+              margin: EdgeInsets.symmetric(
+                horizontal: ResponsiveSize.number(
+                  context: context,
+                  mobile: 20,
+                  tablet: 20,
+                  mobileLarge: 10,
+                  desktop: 30,
+                ),
+              ),
+              decoration: BoxDecoration(
+                image: DecorationImage(
+                  image: AssetImage(
+                    imageAsset.cekahLogo,
+                  ),
+                  fit: BoxFit.fitWidth,
+                ),
+              ),
+            ),
+          ),
+          VerticalDivider(
+            color: themeColor.whiteColor,
+            width: 2,
+            thickness: 1,
+          ),
+        ],
+      ),
+    );
+  }
+
   Widget buildContactInfo({
     required IconData icon,
     required String text,
@@ -166,7 +183,13 @@ class FooterPartV2 extends StatelessWidget {
     return Container(
       padding: const EdgeInsets.symmetric(vertical: 5),
       // height: 50,
-      width: MediaQuery.sizeOf(context).width * .5,
+      width: ResponsiveSize.number(
+        context: context,
+        mobile: MediaQuery.sizeOf(context).width,
+        tablet: MediaQuery.sizeOf(context).width * .5,
+        mobileLarge: MediaQuery.sizeOf(context).height * .5,
+        desktop: MediaQuery.sizeOf(context).width * .5,
+      ),
       child: Row(
         mainAxisAlignment: MainAxisAlignment.start,
         crossAxisAlignment: CrossAxisAlignment.center,

diff --git a/lib/pages/home/parts/myteam/teams.dart b/lib/pages/home/parts/myteam/teams.dart
@@ -30,7 +30,7 @@ class MyBigPart extends StatelessWidget {
         child: Column(
           children: [
             const BigTitileWidget(
-              title: 'Notre équipe',
+              title: 'Mon équipe',
               svgIcon: 'team',
             ),
             SizedBox(

diff --git a/lib/pages/home/parts/skills/skills.dart b/lib/pages/home/parts/skills/skills.dart
@@ -17,11 +17,13 @@ class SkillsPart extends StatelessWidget {
       margin: EdgeInsets.symmetric(
         horizontal: ResponsiveSize.number(
           context: context,
-          mobile: 5,
-          desktop: MediaQuery.sizeOf(context).width * .2,
-          mobileLarge: 50,
-          tablet: 40,
+          small: 0,
+          mobile: MediaQuery.sizeOf(context).width * .1,
+          desktop: MediaQuery.sizeOf(context).width * .1,
+          mobileLarge: MediaQuery.sizeOf(context).width * .1,
+          tablet: MediaQuery.sizeOf(context).width * .1,
         ),
+        // horizontal: 0,
         vertical: ResponsiveSize.number(
           context: context,
           mobile: 10,
@@ -32,10 +34,11 @@ class SkillsPart extends StatelessWidget {
       ),
       height: ResponsiveSize.number(
         context: context,
-        mobile: 450,
-        tablet: 700,
+        // small: 710,
+        mobile: 610,
+        tablet: 550,
         mobileLarge: 400,
-        desktop: 550,
+        desktop: 630,
       ),
       child: Column(
         children: [
@@ -46,7 +49,7 @@ class SkillsPart extends StatelessWidget {
           Expanded(
             child: ResponsiveGridList(
               squareCells: false,
-              scroll: true,
+              scroll: false,
               rowMainAxisAlignment: MainAxisAlignment.center,
               desiredItemWidth: ResponsiveSize.number(
                 context: context,
@@ -116,7 +119,7 @@ class SkillsPart extends StatelessWidget {
                           style: TextStyle(
                             fontSize: ResponsiveSize.number(
                               context: context,
-                              mobile: 13,
+                              mobile: 12,
                               tablet: 13,
                               mobileLarge: 13,
                               desktop: 15,
@@ -142,9 +145,9 @@ class SkillsPart extends StatelessWidget {
 List<SkillModel> skills = [
   SkillModel(name: 'Dart', percentage: 0.75),
   SkillModel(name: 'Flutter', percentage: 0.85),
-  // Skill(name: 'Flutter Bloc', percentage: 0.7),
   SkillModel(name: 'Clean Archi', percentage: 0.9),
   SkillModel(name: 'CI/CD', percentage: 0.4),
+  SkillModel(name: 'PocketBase', percentage: 0.5),
   SkillModel(name: 'Firebase', percentage: 0.5),
   SkillModel(name: 'Golang', percentage: 0.25),
 ];