add a button to open the blog & check if the theme is dark by system setting

Signed-off-by: Tejas Mehta <[email protected]>

Author: tmthecoder

lib/main.dart

@@ -1,3 +1,5 @@
+import 'dart:html';
+
 import 'package:controller_widgets/controller_widgets.dart';
 import 'package:flutter/material.dart';
 import 'package:portfolio/routing/portfolio_route_information_parser.dart';
@@ -9,15 +11,15 @@ void main() {
     future: SharedPreferences.getInstance(),
     builder: (BuildContext context, AsyncSnapshot<SharedPreferences> snapshot) {
       if (!snapshot.hasData) return Container();
-      return ThemeControllerWidget(initiallyIsDark: snapshot.data?.getBool("initialDark") ?? false, child: MyApp(),);
+      return ThemeControllerWidget(
+        initiallyIsDark: window.matchMedia('(prefers-color-scheme: dark)').matches,
+        child: MyApp(),
+      );
     }
   ));
 }
 
 class MyApp extends StatelessWidget {
-  final GlobalKey<NavigatorState> _navigatorKey = GlobalKey<NavigatorState>();
-  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
-
   final ThemeData _lightTheme = ThemeData(
     brightness: Brightness.light,
     appBarTheme: AppBarTheme(color: Colors.transparent, shadowColor: Colors.transparent, iconTheme: IconThemeData(color: Colors.black)),

lib/routing/portfolio_router_delegate.dart

@@ -2,6 +2,8 @@
 /// Made on Saturday, May 01, 2021
 /// File Name: portfolio_router_delegate.dart
 
+import 'dart:html';
+
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:controller_widgets/controller_widgets.dart';
@@ -78,18 +80,24 @@ class PortfolioRouterDelegate extends RouterDelegate<PortfolioRoutePath>
   }
 
   AppBar _createAppbar(BuildContext context) {
+    bool needsButtons = MediaQuery.of(context).size.width > 500;
     return AppBar(
       title: Text("Tejas Mehta", style: TextStyle(color: ThemeController.of(context).isDark ? Colors.white : Colors.black),),
       actions: [
-        MediaQuery.of(context).size.width > 500 ? TextButton(
+        if(needsButtons) TextButton(
             onPressed: () => moveAndUpdateRoute(PortfolioRoutePath.about(), false),
             child: _createTextTab("About", context)
-        ) : Container(),
+        ),
         Padding(padding: EdgeInsets.all(10)),
-        MediaQuery.of(context).size.width > 500 ? TextButton(
+        if (needsButtons) TextButton(
             onPressed: () => moveAndUpdateRoute(PortfolioRoutePath.projects(), false),
             child: _createTextTab("Projects", context)
-        ) : Container(),
+        ),
+        Padding(padding: EdgeInsets.all(10)),
+        if (needsButtons) TextButton(
+          onPressed: _moveToBlog,
+          child: _createTextTab("Blog", context),
+        ),
         Padding(padding: EdgeInsets.all(10)),
         IconButton(
             icon: Icon(ThemeController.of(context).isDark ? Icons.wb_sunny : Icons.brightness_3), onPressed: () {
@@ -105,6 +113,7 @@ class PortfolioRouterDelegate extends RouterDelegate<PortfolioRoutePath>
         children: [
           ListTile(title: Text("About"), onTap: () => moveAndUpdateRoute(PortfolioRoutePath.about(), true),),
           ListTile(title: Text("Projects"), onTap: () => moveAndUpdateRoute(PortfolioRoutePath.projects(), true),),
+          ListTile(title: Text("Blog"), onTap: _moveToBlog,)
         ],
       ),
     );
@@ -127,6 +136,10 @@ class PortfolioRouterDelegate extends RouterDelegate<PortfolioRoutePath>
     onPopPage: (_, __) => false,
   );
 
+  void _moveToBlog() {
+    window.open("https://blog.tmthecoder.dev","_blank");
+  }
+
   void moveAndUpdateRoute(PortfolioRoutePath path, bool drawer) {
     setNewRoutePath(path);
     if (drawer) _scaffoldKey.currentState?.openEndDrawer();