Merge pull request #6 from VVK027/ui_updates

UI updates along with fixes

Author: VVK027

assets/data.json

@@ -344,7 +344,7 @@
       "fullDescription": [
         "Delivered a multi-region healthcare platform serving patients and providers across India, Colombia, Ecuador, and South Africa.",
         "Built video consultation, EHR/PHR management, real-time chat using Socket.io, biometric device integrations (ECG, BP, glucose, SpO₂, spirometer), and payment gateway integrations.",
-        "Reduced application load time by 40% through performance optimization and caching strategies, achieving 95% automation coverage with QA collaboration."
+        "Reduced application load time by 40% through performance optimization and caching strategies, achieving 90% automation coverage with QA collaboration."
       ],
       "previewImage": "assets/projects/docty_health_preview.jpg",
       "playStoreUrl": [
@@ -625,9 +625,14 @@
     }
   ],
   "awards": [
+    "Pinnacle Performer Award – 2021, Docty HealthCare Pvt. Ltd.",
+    "Consolation Prize at Savishkar Utsav – 2012, Technical Fest for presentation project on Photophobic Robot.",
+    "Youth for Rural Reconstruction Campaign– 2011, NSS Member Certified."
+  ],
+  "achievements": [
     "Reduced application load time by 40% through performance optimization and caching improvements.",
     "Led successful migration initiatives from native platforms to Flutter to improve scalability and reduce maintenance overhead.",
-    "Achieved around 95% automation coverage with QA and DevOps collaboration.",
+    "Achieved around 90% automation coverage with QA and DevOps collaboration.",
     "Built and integrated IoT and wearable ecosystems using BLE and Wi-Fi."
   ],
   "education": [

lib/core/app.dart

@@ -1,10 +1,10 @@
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:vivekdevfolio/core/provider/app_theme_provider.dart';
 import 'package:vivekdevfolio/core/theme/app_colors.dart';
 
 import 'routing/app_router.dart';
-import 'theme/app_theme.dart';
 
 class PortfolioApp extends ConsumerWidget {
   const PortfolioApp({super.key});
@@ -24,6 +24,20 @@ class PortfolioApp extends ConsumerWidget {
       themeMode: themeMode,
       routerConfig: appRouter,
       debugShowCheckedModeBanner: false,
+      builder: (context, child) {
+        final brightness = Theme.of(context).brightness;
+        final colors =
+        brightness == Brightness.dark ? AppColors.dark : AppColors.light;
+        SystemChrome.setSystemUIOverlayStyle(
+          SystemUiOverlayStyle(
+            statusBarColor: colors.scaffold,
+            statusBarIconBrightness: brightness == Brightness.dark
+                ? Brightness.light
+                : Brightness.dark,
+          ),
+        );
+        return child ?? const SizedBox.shrink();
+      },
     );
   }
 }

lib/core/constants/portfolio_icons.dart

@@ -0,0 +1,11 @@
+/// SVG icon asset paths used across the portfolio UI.
+enum PortfolioIcons {
+  linkedin('assets/icons/linkedin.svg'),
+  github('assets/icons/github.svg'),
+  pub('assets/icons/pub.svg'),
+  facebook('assets/icons/facebook-f.svg'),
+  whatsapp('assets/icons/whatsapp.svg');
+
+  const PortfolioIcons(this.assetPath);
+  final String assetPath;
+}

lib/core/theme/app_colors.dart

@@ -1,15 +1,24 @@
 import 'package:flutter/material.dart';
+import 'package:vivekdevfolio/core/theme/app_fonts.dart';
+import 'package:vivekdevfolio/core/theme/app_theme.dart';
 
 /// Semantic portfolio colors — use via [Theme.of(context).extension<AppColors>()].
 @immutable
-class AppColors extends ThemeExtension<AppColors> {
+class AppColors extends ThemeExtension<AppColors> implements AppThemeColors {
+  @override
   final Color scaffold;
+  @override
   final Color surface;
+  @override
   final Color card;
   final Color cardBorder;
+  @override
   final Color sectionBorder;
+  @override
   final Color textPrimary;
+  @override
   final Color textSecondary;
+  @override
   final Color textMuted;
   final Color appBarGradientStart;
   final Color appBarGradientEnd;
@@ -31,12 +40,17 @@ class AppColors extends ThemeExtension<AppColors> {
   final Color carouselIndicatorInactive;
   final Color carouselIcon;
   final Color carouselIconDisabled;
+  @override
   final Color chipBackground;
+  @override
   final Color chipBorder;
+  @override
   final Color chipLabel;
   final Color filterChipSelected;
   final Color filterChipUnselected;
+  @override
   final Color accent;
+  @override
   final Color accentSecondary;
   final Color accentGradientStart;
   final Color accentGradientEnd;
@@ -443,3 +457,17 @@ extension AppColorsContext on BuildContext {
           ? AppColors.dark
           : AppColors.light);
 }
+
+final ThemeData lightTheme = buildAppTheme(
+  brightness: Brightness.light,
+  colors: AppColors.light,
+  colorExtension: AppColors.light,
+  fontFamily: AppFonts.family,
+);
+
+final ThemeData darkTheme = buildAppTheme(
+  brightness: Brightness.dark,
+  colors: AppColors.dark,
+  colorExtension: AppColors.dark,
+  fontFamily: AppFonts.family,
+);

lib/core/theme/app_theme.dart

@@ -1,8 +1,25 @@
 import 'dart:ui' show lerpDouble;
 
 import 'package:flutter/material.dart';
-import 'package:vivekdevfolio/core/theme/app_colors.dart';
-import 'package:vivekdevfolio/core/theme/app_fonts.dart';
+
+/// Semantic colors required to build the shared [buildAppTheme] configuration.
+///
+/// Implement this in your project's `app_colors.dart` and pass the result to
+/// [buildAppTheme] along with the matching [ThemeExtension].
+abstract class AppThemeColors {
+  Color get scaffold;
+  Color get surface;
+  Color get card;
+  Color get sectionBorder;
+  Color get textPrimary;
+  Color get textSecondary;
+  Color get textMuted;
+  Color get chipBackground;
+  Color get chipBorder;
+  Color get chipLabel;
+  Color get accent;
+  Color get accentSecondary;
+}
 
 class Metrics extends ThemeExtension<Metrics> {
   final double sectionHPad;
@@ -19,11 +36,15 @@ class Metrics extends ThemeExtension<Metrics> {
       );
 }
 
-TextTheme _baseTextTheme(Brightness brightness, AppColors colors) {
+TextTheme _baseTextTheme(
+  Brightness brightness,
+  AppThemeColors colors, {
+  required String fontFamily,
+}) {
   final source = brightness == Brightness.dark
       ? ThemeData.dark().textTheme
       : ThemeData.light().textTheme;
-  final themed = source.apply(fontFamily: AppFonts.family);
+  final themed = source.apply(fontFamily: fontFamily);
   return themed.copyWith(
     headlineMedium: themed.headlineMedium?.copyWith(
       fontSize: 32,
@@ -82,9 +103,13 @@ TextTheme _baseTextTheme(Brightness brightness, AppColors colors) {
   );
 }
 
-ThemeData _buildTheme({
+/// Builds a Material 3 theme from project-specific color tokens.
+ThemeData buildAppTheme<C extends ThemeExtension<C>>({
   required Brightness brightness,
-  required AppColors colors,
+  required AppThemeColors colors,
+  required C colorExtension,
+  String fontFamily = 'Poppins',
+  Metrics metrics = const Metrics(sectionHPad: 20),
 }) {
   final scheme = ColorScheme(
     brightness: brightness,
@@ -105,14 +130,15 @@ ThemeData _buildTheme({
     scaffoldBackgroundColor: colors.scaffold,
     cardColor: colors.card,
     dividerColor: colors.sectionBorder,
-    textTheme: _baseTextTheme(brightness, colors),
+    textTheme: _baseTextTheme(brightness, colors, fontFamily: fontFamily),
     appBarTheme: AppBarTheme(
       backgroundColor: Colors.transparent,
       foregroundColor: colors.textPrimary,
       elevation: 0,
       scrolledUnderElevation: 0,
       surfaceTintColor: Colors.transparent,
-      titleTextStyle: _baseTextTheme(brightness, colors).titleLarge,
+      titleTextStyle:
+          _baseTextTheme(brightness, colors, fontFamily: fontFamily).titleLarge,
       iconTheme: IconThemeData(color: colors.textPrimary),
     ),
     iconTheme: IconThemeData(color: colors.textPrimary),
@@ -128,16 +154,6 @@ ThemeData _buildTheme({
       textStyle: TextStyle(color: colors.textPrimary),
     ),
     progressIndicatorTheme: ProgressIndicatorThemeData(color: colors.accent),
-    extensions: [colors, const Metrics(sectionHPad: 20)],
+    extensions: [colorExtension, metrics],
   );
 }
-
-final ThemeData lightTheme = _buildTheme(
-  brightness: Brightness.light,
-  colors: AppColors.light,
-);
-
-final ThemeData darkTheme = _buildTheme(
-  brightness: Brightness.dark,
-  colors: AppColors.dark,
-);

lib/data/mappers/portfolio_mapper.dart

@@ -15,6 +15,7 @@ class PortfolioMapper {
       projects: model.projects.map(_projectToEntity).toList(),
       reviews: model.reviews?.map(_reviewToEntity).toList(),
       awards: model.awards,
+      achievements: model.achievements,
       education: model.education,
       certifications: model.certifications,
       contact: _contactToEntity(model.contact),

lib/data/models/portfolio_model.dart

@@ -13,6 +13,7 @@ class PortfolioModel {
   final List<ProjectModel> projects;
   final List<ReviewModel>? reviews;
   final List<String> awards;
+  final List<String> achievements;
   final List<String> education;
   final List<String> certifications;
   final ContactModel contact;
@@ -27,6 +28,7 @@ class PortfolioModel {
     this.projects,
     this.reviews,
     this.awards,
+    this.achievements,
     this.education,
     this.certifications,
     this.contact,

lib/domain/entities/portfolio.dart

@@ -8,6 +8,7 @@ class Portfolio {
   final List<Project> projects;
   final List<Review>? reviews;
   final List<String> awards;
+  final List<String> achievements;
   final List<String> education;
   final List<String> certifications;
   final Contact contact;
@@ -22,6 +23,7 @@ class Portfolio {
     required this.projects,
     required this.reviews,
     required this.awards,
+    required this.achievements,
     required this.education,
     required this.certifications,
     required this.contact,

lib/presentation/extensions/portfolio_section_enum.dart

@@ -5,6 +5,7 @@ enum PortfolioSectionEnum {
   projects('Projects', 'Projects'),
   reviews('Reviews', 'Reviews'),
   awards('Awards', 'Awards'),
+  achievements('Achievements', 'Achievements'),
   education('Education', 'Education'),
   certifications('Certifications', 'Certifications'),
   contact('Contact', 'Contact Me');

lib/presentation/portfolio/screen/portfolio_page.dart

@@ -201,7 +201,12 @@ class _PortfolioScaffold extends StatelessWidget {
                   onSectionSelected: onSectionIndexSelected,
                 ),
               const SizedBox(width: 6),
-              const ThemeToggleButton(size: 32),
+              ThemeToggleButton(
+                size: 32,
+                backgroundColor: colors.chipBackground,
+                foregroundColor: colors.textPrimary,
+                borderColor: colors.cardBorder,
+              ),
               if (!isDesktop) ...[
                 const SizedBox(width: 4),
                 PortfolioMobileNavMenu(
@@ -235,6 +240,10 @@ class _PortfolioScaffold extends StatelessWidget {
                       subtitle: section == PortfolioSectionEnum.reviews
                           ? 'Recommendations from people I have worked with.'
                           : null,
+                      sectionBorderColor: colors.sectionBorder,
+                      accentGradientStart: colors.accentGradientStart,
+                      accentGradientEnd: colors.accentGradientEnd,
+                      subtitleColor: colors.textMuted,
                       child: buildSection(section),
                     );
                   },