Add complete impl from codelabs github

lib/main.dart

@@ -43,7 +43,6 @@ class MyAppState extends ChangeNotifier {
     }
     notifyListeners();
   }
-
 }
 
 class MyHomePage extends StatefulWidget {
@@ -63,41 +62,44 @@ class _MyHomePageState extends State<MyHomePage> {
       case 1:
         page = FavoritesPage();
       default:
-        throw UnimplementedError('Unknown index: $selectedIndex');
+        throw UnimplementedError('no widget for $selectedIndex');
     }
-    return Scaffold(
+
-      body: Row(
+    return LayoutBuilder(builder: (context, constraints) {
-        children: [
+      return Scaffold(
-          SafeArea(
+        body: Row(
-            child: NavigationRail(
+          children: [
-              extended: false,
+            SafeArea(
-              destinations: [
+              child: NavigationRail(
-                NavigationRailDestination(
+                extended: constraints.maxWidth >= 600,
-                  icon: Icon(Icons.home),
+                destinations: [
-                  label: Text('Home'),
+                  NavigationRailDestination(
-                ),
+                    icon: Icon(Icons.home),
-                NavigationRailDestination(
+                    label: Text('Home'),
-                  icon: Icon(Icons.favorite),
+                  ),
-                  label: Text('Favorites'),
+                  NavigationRailDestination(
-                ),
+                    icon: Icon(Icons.favorite),
-              ],
+                    label: Text('Favorites'),
-              selectedIndex: selectedIndex,
+                  ),
-              onDestinationSelected: (value) {
+                ],
-                setState(() {
+                selectedIndex: selectedIndex,
-                  selectedIndex = value;
+                onDestinationSelected: (value) {
-                });
+                  setState(() {
-              },
+                    selectedIndex = value;
+                  });
+                },
+              ),
             ),
-          ),
+            Expanded(
-          Expanded(
+              child: Container(
-            child: Container(
+                color: Theme.of(context).colorScheme.primaryContainer,
-              color: Theme.of(context).colorScheme.primaryContainer,
+                child: page,
-              child: page,
+              ),
             ),
-          ),
+          ],
-        ],
+        ),
-      ),
+      );
-    );
+    });
   }
 }
 
@@ -145,7 +147,34 @@ class GeneratorPage extends StatelessWidget {
   }
 }
 
+class BigCard extends StatelessWidget {
+  const BigCard({
+    super.key,
+    required this.pair,
+  });
+
+  final WordPair pair;
 
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final style = theme.textTheme.displayMedium!.copyWith(
+      color: theme.colorScheme.onPrimary,
+    );
+
+    return Card(
+      color: theme.colorScheme.primary,
+      child: Padding(
+        padding: const EdgeInsets.all(20),
+        child: Text(
+          pair.asLowerCase,
+          style: style,
+          semanticsLabel: "${pair.first} ${pair.second}",
+        ),
+      ),
+    );
+  }
+}
 
 class FavoritesPage extends StatelessWidget {
   @override
@@ -174,34 +203,3 @@ class FavoritesPage extends StatelessWidget {
     );
   }
 }
-
-
-
-class BigCard extends StatelessWidget {
-  const BigCard({
-    super.key,
-    required this.pair,
-  });
-
-  final WordPair pair;
-
-  @override
-  Widget build(BuildContext context) {
-    var theme = Theme.of(context);
-    var style = theme.textTheme.displayMedium!.copyWith(
-      color: theme.colorScheme.onPrimary,
-    );
-
-    return Card(
-      color: theme.colorScheme.primary,
-      child: Padding(
-        padding: const EdgeInsets.all(20),
-        child: Text(
-          pair.asLowerCase,
-          style: style,
-          semanticsLabel: pair.asPascalCase,
-          ),
-      ),
-    );
-  }
-}