feat(example): Make responsive on mobile

Author: bdlukaa

example/lib/app.dart

@@ -11,13 +11,13 @@ class App extends StatelessComponent {
     return div(
       styles: Styles(
         display: Display.flex,
+        width: Unit.percent(100),
         minHeight: Unit.vh(100),
         flexDirection: FlexDirection.column,
         color: Color('#111827'),
         fontFamily: FontFamily('Inter, system-ui, sans-serif'),
         backgroundColor: Color('#f9fafb'),
       ),
-      classes: 'main',
       [
         header(
           styles: Styles(
@@ -48,9 +48,7 @@ class App extends StatelessComponent {
         ),
         div(
           styles: Styles(
-            width: Unit.percent(100),
-            maxWidth: Unit.pixels(1200),
-            padding: Spacing.all(Unit.pixels(32)),
+            width: Unit.percent(80),
             margin: Spacing.symmetric(horizontal: Unit.auto),
             flex: Flex.grow(1),
           ),

example/lib/pages/home.dart

@@ -27,7 +27,7 @@ class _HomeState extends State<Home> {
   Component build(BuildContext context) {
     final textareaStyle = Styles(
       width: Unit.percent(100),
-      height: Unit.pixels(300),
+      height: Unit.percent(100),
       padding: Spacing.all(Unit.pixels(16)),
       boxSizing: BoxSizing.borderBox,
       border: Border.all(color: Color('#d1d5db')),
@@ -50,7 +50,7 @@ class _HomeState extends State<Home> {
       display: Display.flex,
       flexDirection: FlexDirection.column,
       gap: Gap.all(Unit.pixels(12)),
-      flex: Flex.grow(1),
+      flex: Flex(grow: 1, shrink: 1),
     );
 
     final labelStyle = Styles(