a

lib/lang.dart

@@ -35,7 +35,7 @@ class _LangState extends State<Lang> {
             style: ButtonStyle(
                 foregroundColor: MaterialStateProperty.all<Color>(Colors.white),
                 backgroundColor:
-                    MaterialStateProperty.all<Color>(Colors.white70),
+                    MaterialStateProperty.all<Color>(Color(0xffFFFFFF).withOpacity(0.4)),
                 shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                     RoundedRectangleBorder(
                   borderRadius: BorderRadius.only(

lib/list coba.dart

@@ -0,0 +1,38 @@
+import 'package:flutter/material.dart';
+
+class ListPage extends StatelessWidget {
+  const ListPage({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    // var items;
+    return Scaffold(
+        body: Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Text(
+          'Top Menu',
+          style: TextStyle(
+            fontSize: 18,
+          ),
+        ),
+        Expanded(
+            child: ListView.builder(
+                shrinkWrap: true,
+                // itemCount: items.length,
+                itemBuilder: (context, index) {
+                  return Card(
+                    child: ListTile(
+                      // title: Text(items[index]),
+                      // subtitle: Text('Description of 'items[index]),
+                      // trailing: Icon(
+                      //   Icons.do_not_disturb_on,
+                      //   color: Colors.red,
+                      // ),
+                    ),
+                  );
+                })),
+      ],
+    ));
+  }
+}

lib/list copy.dart

@@ -1,258 +0,0 @@
-import 'package:flutter/material.dart';
-
-class ListPage extends StatelessWidget {
-  const ListPage({Key? key}) : super(key: key);
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-        resizeToAvoidBottomInset: false,
-        backgroundColor: Theme.of(context).colorScheme.primaryContainer,
-        body: ListView(
-          children: [
-            Row(
-              children: [
-                BackButton(),
-              ],
-            ),
-            Card(
-              child: Column(
-                children: [
-                  Row(
-                    children: [
-                      Text(
-                        'Top Menu',
-                        textAlign: TextAlign.left,
-                      ),
-                      Expanded(child: Container()),
-                      ElevatedButton(
-                          onPressed: () {
-                            print('Done');
-                          },
-                          child: Text('Done'))
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/food.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        crossAxisAlignment: CrossAxisAlignment.start,
-                        children: [
-                          Text('Foods & Drinks'),
-                          Text('Description of foods & drink'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.do_not_disturb_on),
-                      Icon(Icons.dehaze),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/service.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Services'),
-                          Text('Description of services'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.do_not_disturb_on),
-                      Icon(Icons.dehaze),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/additional.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Additional'),
-                          Text('Description of additional'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.do_not_disturb_on),
-                      Icon(Icons.dehaze),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/firstaid.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('First Aid'),
-                          Text('Description of first aid'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.do_not_disturb_on),
-                      Icon(Icons.dehaze),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/ticket.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Ticket'),
-                          Text('Description of ticket'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.do_not_disturb_on),
-                      Icon(Icons.dehaze),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/vacation.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Vacation'),
-                          Text('Description of vacation'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.do_not_disturb_on),
-                      Icon(Icons.dehaze),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/transportation.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Transportation'),
-                          Text('Description of transportation'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.do_not_disturb_on),
-                      Icon(Icons.dehaze),
-                    ],
-                  ),
-                ],
-              ),
-            ),
-            Card(
-              child: Column(
-                children: [
-                  Row(
-                    children: [
-                      Text(
-                        'Available Menu',
-                        textAlign: TextAlign.left,
-                      ),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/food.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Foods & Drinks'),
-                          Text('Description of foods & drink'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.add_circle),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/service.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Services'),
-                          Text('Description of services'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.add_circle),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Image.asset(
-                        'assets/images/additional.png',
-                        width: 60,
-                        height: 60,
-                        fit: BoxFit.cover,
-                      ),
-                      Column(
-                        children: [
-                          Text('Additional'),
-                          Text('Description of additional'),
-                        ],
-                      ),
-                      Expanded(child: Container()),
-                      Icon(Icons.add_circle),
-                    ],
-                  ),
-                ],
-              ),
-            ),
-            // Text(
-            //   'Demo Headline 2',
-            //   style: TextStyle(fontSize: 18),
-            // ),
-            // Expanded(
-            //   child: ListView.builder(
-            //     shrinkWrap: true,
-            //     itemBuilder: (context, int) {
-            //       return Card(
-            //         child: ListTile(title: Text('aaa $int'),
-            //         subtitle: Text('desc'),),
-            //       );
-            //     })
-            //   ),
-            // ),
-          ],
-        ));
-  }
-}

lib/list.dart

@@ -6,33 +6,488 @@ class ListPage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-        body: Column(
-      crossAxisAlignment: CrossAxisAlignment.start,
-      children: [
-        Text(
-          'Top Menu',
-          style: TextStyle(
-            fontSize: 18,
-          ),
-        ),
-        Expanded(
-            child: ListView.builder(
-                shrinkWrap: true,
-                // itemCount: 15,
-                // ignore: avoid_types_as_parameter_names
-                itemBuilder: (context, int) {
-                  return Card(
-                    child: ListTile(
-                      title: Text('aaa'),
-                      subtitle: Text('Description of $int'),
-                      trailing: Icon(
-                        Icons.do_not_disturb_on,
-                        color: Colors.red,
+        resizeToAvoidBottomInset: false,
+        backgroundColor: Color(0xff078C84),
+        body: ListView(
+          children: [
+            Row(
+              children: [
+                BackButton(),
+              ],
+            ),
+            Card(
+              child: Column(
+                children: [
+                  Row(
+                    children: [
+                      Text(
+                        'Top Menu',
+                        textAlign: TextAlign.left,
+                        style: TextStyle(
+                            fontWeight: FontWeight.w500,
+                            color: Color(0xff292D32)),
                       ),
+                      Expanded(child: Container()),
+                      ElevatedButton(
+                          style: ElevatedButton.styleFrom(
+                              backgroundColor:
+                                  Color(0xff078C84).withOpacity(0.1)),
+                          onPressed: () {
+                            print('Done');
+                          },
+                          child: Text(
+                            'Done',
+                            style: TextStyle(
+                                color: Color(0xff078C84),
+                                fontWeight: FontWeight.w300),
+                          ))
+                    ],
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xffCCA600)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xffCCA600).withOpacity(0.4)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/food.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Foods & Drinks',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of foods & drink',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.do_not_disturb_on,
+                          color: Colors.red,
+                        ),
+                        Icon(Icons.dehaze),
+                      ],
                     ),
-                  );
-                })),
-      ],
-    ));
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xff90D8F9)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xff90D8F9).withOpacity(0.22)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/service.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Services',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of services',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.do_not_disturb_on,
+                          color: Colors.red,
+                        ),
+                        Icon(Icons.dehaze),
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xffAACEE0)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xffAACEE0).withOpacity(0.31)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/additional.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Additional',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of additional',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.do_not_disturb_on,
+                          color: Colors.red,
+                        ),
+                        Icon(Icons.dehaze),
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xffFF1111)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xffFF1111).withOpacity(0.15)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/firstaid.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'First Aid',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of first aid',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.do_not_disturb_on,
+                          color: Colors.red,
+                        ),
+                        Icon(Icons.dehaze),
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xff5ED8F6)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xff5ED8F6).withOpacity(0.26)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/ticket.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Ticket',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of ticket',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.do_not_disturb_on,
+                          color: Colors.red,
+                        ),
+                        Icon(Icons.dehaze),
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xffCCA600)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xffCCA600).withOpacity(0.2)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/vacation.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Vacation',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of vacation',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.do_not_disturb_on,
+                          color: Colors.red,
+                        ),
+                        Icon(Icons.dehaze),
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xff6C8BA5)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xff6C8BA5).withOpacity(0.24)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/transportation.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Transportation',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of transportation',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.do_not_disturb_on,
+                          color: Colors.red,
+                        ),
+                        Icon(Icons.dehaze),
+                      ],
+                    ),
+                  ),
+                ],
+              ),
+            ),
+            Card(
+              child: Column(
+                children: [
+                  Row(
+                    children: [
+                      Text(
+                        'Available Menu',
+                        textAlign: TextAlign.left,
+                      ),
+                    ],
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xffCCA600)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xffCCA600).withOpacity(0.2)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/food.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Foods & Drinks',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of foods & drink',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.add_circle,
+                          color: Colors.red,
+                        ),
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xff90D8F9)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xff90D8F9).withOpacity(0.22)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/service.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Services',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of services',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.add_circle,
+                          color: Colors.red,
+                        ),
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Row(
+                      children: [
+                        Container(
+                          decoration: BoxDecoration(
+                              border: Border.all(color: Color(0xffAACEE0)),
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(20)),
+                              color: Color(0xffAACEE0).withOpacity(0.31)),
+                          padding: const EdgeInsets.all(10.0),
+                          child: Image.asset(
+                            'assets/images/additional.png',
+                            width: 36,
+                            height: 36,
+                            fit: BoxFit.cover,
+                          ),
+                        ),
+                        Padding(
+                          padding: const EdgeInsets.all(8.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                'Additional',
+                                style: TextStyle(fontSize: 14),
+                              ),
+                              Text(
+                                'Description of additional',
+                                style: TextStyle(fontSize: 12),
+                              ),
+                            ],
+                          ),
+                        ),
+                        Expanded(child: Container()),
+                        Icon(
+                          Icons.add_circle,
+                          color: Colors.red,
+                        ),
+                      ],
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ],
+        ));
   }
 }

lib/login.dart

@@ -11,21 +11,36 @@ class LoginPage extends StatelessWidget {
       backgroundColor: Theme.of(context).colorScheme.primaryContainer,
       body: Container(
         decoration: BoxDecoration(
+            gradient: LinearGradient(
+                begin: Alignment.topCenter,
+                end: Alignment.bottomCenter,
+                colors: [
+                  Color(0xffD9D9D9),
+                  Color(0xff0F968E),
+                  Color(0xff000000)
+                ]),
             image: DecorationImage(
-          image: AssetImage("assets/images/building.jpg"),
-          fit: BoxFit.cover,
-        )),
+              image: AssetImage("assets/images/building.jpg"),
+              fit: BoxFit.cover,
+            )),
         child: Column(
           mainAxisAlignment: MainAxisAlignment.spaceEvenly,
           children: [
             Row(
               children: [
                 BackButton(color: Colors.white),
-                Text(
-                  'Kembali Pindai QR',
-                  softWrap: true,
-                  textAlign: TextAlign.left,
-                  style: TextStyle(color: Colors.white),
+                Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Text(
+                      'Kembali',
+                      style: TextStyle(color: Colors.white),
+                    ),
+                    Text(
+                      'pindai QR',
+                      style: TextStyle(color: Colors.white),
+                    ),
+                  ],
                 ),
                 Expanded(child: Container()),
                 Lang(),
@@ -33,9 +48,18 @@ class LoginPage extends StatelessWidget {
             ),
             Expanded(
               child: Center(
-                  child: Text(
-                'telnow',
-                style: TextStyle(color: Color(0xffFF6600), fontSize: 48),
+                  child: Row(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Text(
+                    'tel',
+                    style: TextStyle(color: Color(0xffFF6600), fontSize: 48),
+                  ),
+                  Text(
+                    'now',
+                    style: TextStyle(color: Color(0xffFFFFFF), fontSize: 48),
+                  ),
+                ],
               )),
             ),
             Expanded(
@@ -43,43 +67,66 @@ class LoginPage extends StatelessWidget {
               children: [
                 Padding(
                   padding: const EdgeInsets.all(8.0),
-                  child: TextField(
-                    decoration: InputDecoration(
-                      border: OutlineInputBorder(),
-                      labelText: 'Nama Pengguna',
+                  child: SizedBox(
+                    width: 396,
+                    height: 51,
+                    child: TextField(
+                      decoration: InputDecoration(
+                          border: OutlineInputBorder(),
+                          enabledBorder: OutlineInputBorder(
+                              borderSide: BorderSide(color: Color(0xffFFFFFF))),
+                          labelText: 'Nama Pengguna',
+                          labelStyle: TextStyle(color: Color(0xffFFFFFF)),
+                          filled: true,
+                          fillColor: Colors.white.withOpacity(0.25)),
+                      style: TextStyle(color: Color(0xffFFFFFF)),
                     ),
                   ),
                 ),
-                Padding(
-                  padding: const EdgeInsets.all(8.0),
+                SizedBox(
+                  width: 396,
+                  height: 51,
                   child: TextField(
                     obscureText: true,
                     decoration: InputDecoration(
-                      border: OutlineInputBorder(),
-                      labelText: 'Kata Sandi',
-                    ),
+                        border: OutlineInputBorder(),
+                        enabledBorder: OutlineInputBorder(
+                            borderSide: BorderSide(color: Color(0xffFFFFFF))),
+                        labelText: 'Kata Sandi',
+                        labelStyle: TextStyle(color: Color(0xffFFFFFF)),
+                        filled: true,
+                        fillColor: Colors.white.withOpacity(0.25)),
+                    style: TextStyle(color: Color(0xffFFFFFF)),
                   ),
                 ),
                 Padding(
-                  padding: const EdgeInsets.all(8.0),
-                  child: ElevatedButton(
-                    onPressed: () => context.go('/list'),
-                    style: ButtonStyle(
-                        padding: MaterialStateProperty.all<EdgeInsets>(
-                            EdgeInsets.only(
-                                left: 260, right: 260, bottom: 25, top: 25)),
-                        backgroundColor: MaterialStateProperty.all(
-                            Color.fromARGB(0, 7, 140, 132)),
-                        foregroundColor:
-                            MaterialStateProperty.all<Color>(Colors.black),
-                        shape:
-                            MaterialStateProperty.all<RoundedRectangleBorder>(
-                                RoundedRectangleBorder(
-                          borderRadius: BorderRadius.circular(10),
-                        ))),
-                    child: Text(
-                      'Masuk',
-                      style: TextStyle(color: Colors.white),
+                  padding: const EdgeInsets.all(20.0),
+                  child: SizedBox(
+                    width: 396,
+                    height: 61,
+                    child: ElevatedButton(
+                      onPressed: () => context.go('/list'),
+                      style: ElevatedButton.styleFrom(
+                        backgroundColor: Color(0xff078C84).withOpacity(0.76),
+                        side: BorderSide(color: Colors.white),
+                        shape: RoundedRectangleBorder(
+                          borderRadius: BorderRadius.circular(12.0),
+                        ),
+                      ),
+                      // style: ButtonStyle(
+                      //     backgroundColor:
+                      //         MaterialStateProperty.all(Color(0xff078C84)),
+                      //     foregroundColor:
+                      //         MaterialStateProperty.all<Color>(Colors.black),
+                      //     shape:
+                      //         MaterialStateProperty.all<RoundedRectangleBorder>(
+                      //             RoundedRectangleBorder(
+                      //       borderRadius: BorderRadius.circular(10),
+                      //     ))),
+                      child: Text(
+                        'Masuk',
+                        style: TextStyle(color: Colors.white),
+                      ),
                     ),
                   ),
                 ),
@@ -89,25 +136,28 @@ class LoginPage extends StatelessWidget {
                 ),
               ],
             )),
-            Column(
-              children: [
-                Text('Kebijakan Privasi',
-                    style: TextStyle(
+            Padding(
+              padding: const EdgeInsets.all(8.0),
+              child: Column(
+                children: [
+                  Text('Kebijakan Privasi',
+                      style: TextStyle(
+                          fontSize: 16,
+                          decoration: TextDecoration.underline,
+                          fontWeight: FontWeight.w400,
+                          color: Colors.white)),
+                  Text('Versi 4.0.0.0',
+                      style: TextStyle(
                         fontSize: 16,
-                        decoration: TextDecoration.underline,
-                        fontWeight: FontWeight.w800,
-                        color: Colors.white)),
-                Text('Versi 4.0.0.0',
-                    style: TextStyle(
-                      fontSize: 16,
-                      fontWeight: FontWeight.w800,
-                      color: Colors.white,
-                    ))
-              ],
+                        fontWeight: FontWeight.w400,
+                        color: Colors.white,
+                      ))
+                ],
+              ),
             ),
-            Container(
-              color: Theme.of(context).colorScheme.primaryContainer,
-            )
+            // Container(
+            //   color: Theme.of(context).colorScheme.primaryContainer,
+            // )
           ],
         ),
       ),

lib/main.dart

@@ -5,7 +5,9 @@ import 'package:namer_app/login.dart';
 import 'package:namer_app/lang.dart';
 
 void main() {
-  runApp(MyApp());
+  runApp(MyApp(
+      // items: List<String>.generate(7, (i) => '$i')
+      ));
 }
 
 final _router = GoRouter(
@@ -34,8 +36,6 @@ class MyApp extends StatelessWidget {
       title: 'TelNow Lat',
       theme: ThemeData(
         useMaterial3: true,
-        // colorScheme:
-        //     ColorScheme.fromSeed(seedColor: Color(0xffD9D9D1)),
       ),
       routerConfig: _router,
     );
@@ -52,8 +52,8 @@ class MyHomePage extends StatelessWidget {
                 begin: Alignment.topCenter,
                 end: Alignment.bottomCenter,
                 colors: [
-                  Color(0xffD9D9D1),
-                  Color(0xff968E73),
+                  Color(0xffD9D9D9),
+                  Color(0xff0F968E),
                   Color(0xff000000)
                 ]),
             image: DecorationImage(
@@ -71,45 +71,51 @@ class MyHomePage extends StatelessWidget {
             ),
             Expanded(
               child: Center(
-                  child: Text(
-                'telnow',
-                style: TextStyle(color: Color(0xffFF6600), fontSize: 48),
+                  child: Row(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Text(
+                    'tel',
+                    style: TextStyle(color: Color(0xffFF6600), fontSize: 48),
+                  ),
+                  Text(
+                    'now',
+                    style: TextStyle(color: Color(0xffFFFFFF), fontSize: 48),
+                  ),
+                ],
               )),
             ),
             Padding(
-              padding: const EdgeInsets.only(left: 120, right: 120),
+              padding: const EdgeInsets.only(left: 180, right: 180),
               child: Text(
                 'Silakan pindai QR terlebih dulu untuk mulai menggunakan aplikasi.',
                 softWrap: true,
                 textAlign: TextAlign.center,
-                style: TextStyle(
-                    fontSize: 16,
-                    fontWeight: FontWeight.bold,
-                    color: Colors.white),
+                style: TextStyle(fontSize: 16, color: Colors.white),
               ),
             ),
             Expanded(
               child: Center(child: Pindai()),
             ),
-            Column(
-              children: [
-                Text('Kebijakan Privasi',
-                    style: TextStyle(
+            Padding(
+              padding: const EdgeInsets.all(8.0),
+              child: Column(
+                children: [
+                  Text('Kebijakan Privasi',
+                      style: TextStyle(
+                          fontSize: 16,
+                          decoration: TextDecoration.underline,
+                          fontWeight: FontWeight.w400,
+                          color: Colors.white)),
+                  Text('Versi 4.0.0.0',
+                      style: TextStyle(
                         fontSize: 16,
-                        decoration: TextDecoration.underline,
-                        fontWeight: FontWeight.w800,
-                        color: Colors.white)),
-                Text('Versi 4.0.0.0',
-                    style: TextStyle(
-                      fontSize: 16,
-                      fontWeight: FontWeight.w800,
-                      color: Colors.white,
-                    ))
-              ],
+                        fontWeight: FontWeight.w400,
+                        color: Colors.white,
+                      ))
+                ],
+              ),
             ),
-            Container(
-              color: Theme.of(context).colorScheme.primaryContainer,
-            )
           ],
         ),
       ),
@@ -124,21 +130,34 @@ class Pindai extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return ElevatedButton(
-      onPressed: () => context.go('/login'),
-      style: ButtonStyle(
-          padding: MaterialStateProperty.all<EdgeInsets>(EdgeInsets.all(50)),
-          foregroundColor: MaterialStateProperty.all<Color>(Colors.black),
-          backgroundColor:
-              MaterialStateProperty.all(Color.fromARGB(1, 7, 140, 132)),
-          shape: MaterialStateProperty.all<RoundedRectangleBorder>(
-              RoundedRectangleBorder(
-            borderRadius: BorderRadius.circular(18.0),
-          ))),
-      child: Text(
-        'Pindai QR',
-        style: TextStyle(color: Colors.white),
-      ),
-    );
+    return SizedBox(
+        width: 257,
+        height: 96,
+        child: ElevatedButton(
+          onPressed: () => context.go('/login'),
+          style: ElevatedButton.styleFrom(
+            backgroundColor: Color(0xff078C84).withOpacity(0.76),
+            side: BorderSide(color: Colors.white),
+            shape: RoundedRectangleBorder(
+              borderRadius: BorderRadius.circular(12.0),
+            ),
+          ),
+          child: Row(
+            mainAxisAlignment: MainAxisAlignment.center,
+            children: [
+              Text(
+                'Pindai QR',
+                style: TextStyle(color: Colors.white, fontSize: 20),
+              ),
+              Image.asset(
+                'assets/images/scan_icon_183865.png',
+                width: 32,
+                height: 32,
+                fit: BoxFit.cover,
+                color: Color(0xffFFFFFF),
+              )
+            ],
+          ),
+        ));
   }
 }