update carousel

firka/devtools_options.yaml

@@ -0,0 +1,3 @@
+description: This file stores settings for Dart & Flutter DevTools.
+documentation: https://docs.flutter.dev/tools/devtools/extensions#configure-extension-enablement-states
+extensions:

firka/lib/main.dart

@@ -46,7 +46,6 @@ Future<AppInitialization> initializeApp() async {
 }
 
 void main() async {
-
   //TODO: fix the error handling currently not pushing to the error page
   runZonedGuarded(() async {
     WidgetsFlutterBinding.ensureInitialized();
@@ -96,7 +95,6 @@ class InitializationScreen extends StatelessWidget {
             );
           }
 
-
           // Initialization successful, determine which screen to show
           Widget screen;
           if (false) {
@@ -118,8 +116,8 @@ class InitializationScreen extends StatelessWidget {
             ),
             home: screen,
             routes: {
-              '/login': (context) => const LoginScreen(),
-              '/debug': (context) => const DebugScreen(),
+              '/login': (context) => LoginScreen(),
+              '/debug': (context) => DebugScreen(),
             },
           );
         }

firka/lib/screens/login/login_screen.dart

@@ -1,29 +1,49 @@
 import 'package:carousel_slider/carousel_slider.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_inappwebview/flutter_inappwebview.dart';
+
+
 
-/// Epic login screen code, licensed under AGPL 3.0, unlike "refilc"
 class LoginScreen extends StatelessWidget {
-  const LoginScreen({super.key});
+  LoginScreen({super.key}) {
+    SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
+    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
+      statusBarBrightness: Brightness.light,
+      statusBarIconBrightness: Brightness.dark,
+      statusBarColor: Colors.transparent,
+      systemNavigationBarColor: Color(0xFFDAE4F7),
+    ));
+  }
 
   @override
   Widget build(BuildContext context) {
-    final contentWidth = MediaQuery.of(context).size.width - MediaQuery.of(context).size.width * 0.90;
+    final paddingWidthHorizontal = MediaQuery.of(context).size.width -
+        MediaQuery.of(context).size.width * 0.95;
+    final contentWidth = MediaQuery.of(context).size.width * 0.95;
+
     final List<Map<String, String>> slides = [
       {
         'title': 'A romló tendenciádat tízféle képpen láthatod',
-        'subtitle': 'Annyi statisztikát láthatsz, hogy a 8 általánosos matek nem lesz elég a kisilabizálására.'
+        'subtitle':
+            'Annyi statisztikát láthatsz, hogy a 8 általánosos matek nem lesz elég a kisilabizálására.',
+        'picture': 'assets/images/carousel/slide1.png',
       },
       {
         'title': 'Minden egy helyen',
-        'subtitle': 'Egyetlen kattintás és máris többet tudsz, mint az osztályfőnököd.'
+        'subtitle':
+            'Egyetlen kattintás és máris többet tudsz, mint az osztályfőnököd.',
+        'picture': 'assets/images/carousel/slide2.png',
       },
       {
         'title': 'Könnyen érthető elemzések',
-        'subtitle': 'Több száz adatból szűrjük ki neked a lényeget.'
+        'subtitle': 'Több száz adatból szűrjük ki neked a lényeget.',
+        'picture': 'assets/images/carousel/slide3.png',
       },
       {
         'title': 'Valós idejű frissítések',
-        'subtitle': 'A statisztikáid mindig naprakészen jelennek meg.'
+        'subtitle': 'A statisztikáid mindig naprakészen jelennek meg.',
+        'picture': 'assets/images/carousel/slide4.png',
       }
     ];
 
@@ -31,14 +51,15 @@ class LoginScreen extends StatelessWidget {
       home: Scaffold(
         backgroundColor: Color(0xFFFAFFEF),
         body: SafeArea(
-          child: Center(
-            child: SizedBox(
-              width: contentWidth,
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  SizedBox(height: 16),
-                  Row(
+            child: Stack(
+          children: [
+            Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SizedBox(height: 16),
+                Padding(
+                  padding: EdgeInsets.only(left: paddingWidthHorizontal),
+                  child: Row(
                     children: [
                       Container(
                         width: 30,
@@ -46,7 +67,8 @@ class LoginScreen extends StatelessWidget {
                         clipBehavior: Clip.antiAlias,
                         decoration: ShapeDecoration(
                           image: DecorationImage(
-                            image: AssetImage('assets/images/logos/colored_logo.png'),
+                            image: AssetImage(
+                                'assets/images/logos/colored_logo.png'),
                             fit: BoxFit.cover,
                           ),
                           shape: RoundedRectangleBorder(
@@ -67,61 +89,183 @@ class LoginScreen extends StatelessWidget {
                       ),
                     ],
                   ),
-                  SizedBox(height: 16),
-                  Expanded(
-                    child: CarouselSlider.builder(
-                      itemCount: slides.length,
-                      itemBuilder: (context, index, realIndex) => Padding(
-                        padding: const EdgeInsets.only(bottom: 16),
-                        child: Column(
-                          crossAxisAlignment: CrossAxisAlignment.start,
-                          mainAxisAlignment: MainAxisAlignment.start,
-                          children: [
-                            Text(
-                              slides[index]['title']!,
-                              style: TextStyle(
-                                color: Color(0xFF394B0A),
-                                fontSize: 19,
+                ),
+                SizedBox(height: 16),
+                Expanded(
+                  child: CarouselSlider.builder(
+                    itemCount: slides.length,
+                    itemBuilder: (context, index, realIndex) => Padding(
+                      padding: EdgeInsets.symmetric(
+                          horizontal: paddingWidthHorizontal),
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        mainAxisAlignment: MainAxisAlignment.start,
+                        children: [
+                          Text(
+                            slides[index]['title']!,
+                            style: TextStyle(
+                              color: Color(0xFF394B0A),
+                              fontSize: 19,
+                              fontFamily: 'Montserrat',
+                              fontVariations: [
+                                FontVariation('wght', 700),
+                              ],
+                            ),
+                            softWrap: true,
+                            overflow: TextOverflow.visible,
+                          ),
+                          SizedBox(height: 8),
+                          Text(
+                            slides[index]['subtitle']!,
+                            style: TextStyle(
+                              color: Color(0xFF394B0A),
+                              fontSize: 17,
+                              fontFamily: 'Montserrat',
+                              fontVariations: [
+                                FontVariation('wght', 400),
+                              ],
+                              height: 1.30,
+                            ),
+                            softWrap: true,
+                            overflow: TextOverflow.visible,
+                          ),
+                          SizedBox(height: 38),
+                          SizedBox(
+                            width: MediaQuery.of(context).size.width,
+                            child: Image(
+                              image: AssetImage(slides[index]['picture']!),
+                              fit: BoxFit.cover,
+                              width: double.infinity,
+                              alignment: Alignment.center,
+                            ),
+                          ),
+                        ],
+                      ),
+                    ),
+                    options: CarouselOptions(
+                      height: double.infinity,
+                      autoPlay: true,
+                      autoPlayInterval: const Duration(milliseconds: 4000),
+                      viewportFraction: 1.0,
+                      enableInfiniteScroll: true,
+                    ),
+                  ),
+                ),
+              ],
+            ),
+            Column(
+              mainAxisAlignment: MainAxisAlignment.end,
+              children: [
+                Container(
+                  width: double.infinity,
+                  height: 200,
+                  decoration: BoxDecoration(
+                    gradient: LinearGradient(
+                      colors: [
+                        Color(0x00DAE4F7),
+                        Color(0xFFDAE4F7)
+                      ], // customize colors
+                      stops: [0.0, 0.5], // percentages (0% → 50% → 100%)
+                      begin: Alignment.topCenter,
+                      end: Alignment.bottomCenter,
+                    ),
+                  ),
+                )
+              ],
+            ),
+            Positioned(
+              bottom: 10,
+              left: 0,
+              right: 0,
+              child: Column(
+                children: [
+                  Center(
+                    child: Padding(
+                      padding: EdgeInsets.symmetric(
+                          horizontal: paddingWidthHorizontal),
+                      child: InkWell(
+                        onTap: () {
+                          showModalBottomSheet<void>(
+                              context: context,
+                              builder: (BuildContext context) {
+                                return SizedBox(
+                                  height: 200,
+                                  child: Center(
+                                    child: Column(
+                                      mainAxisAlignment:
+                                          MainAxisAlignment.center,
+                                      mainAxisSize: MainAxisSize.min,
+                                      children: <Widget>[
+                                        const Text('Modal BottomSheet'),
+                                        ElevatedButton(
+                                          child:
+                                              const Text('Close BottomSheet'),
+                                          onPressed: () =>
+                                              Navigator.pop(context),
+                                        ),
+                                      ],
+                                    ),
+                                  ),
+                                );
+                              });
+                        },
+                        borderRadius: BorderRadius.circular(12),
+                        child: Container(
+                          width: double.infinity,
+                          height: 48,
+                          padding: const EdgeInsets.symmetric(vertical: 8),
+                          decoration: ShapeDecoration(
+                            color: const Color(0xFFA7DB21), // Accent-Accent
+                            shape: RoundedRectangleBorder(
+                              borderRadius: BorderRadius.circular(12),
+                            ),
+                            shadows: const [
+                              BoxShadow(
+                                color: Color(0x33647E22),
+                                blurRadius: 2,
+                                offset: Offset(0, 1),
+                                spreadRadius: 0,
+                              )
+                            ],
+                          ),
+                          child: Center(
+                            child: Text(
+                              'Bejelentkezés E-Kréta fiókkal',
+                              textAlign: TextAlign.center,
+                              style: const TextStyle(
+                                color: Color(0xFF394B0A), // Text-Primary
+                                fontSize: 17,
                                 fontFamily: 'Montserrat',
                                 fontVariations: [
                                   FontVariation('wght', 700),
                                 ],
+                                letterSpacing: -0.30,
                               ),
-                              softWrap: true,
-                              overflow: TextOverflow.visible,
                             ),
-                            SizedBox(height: 8),
-                            Text(
-                              slides[index]['subtitle']!,
-                              style: TextStyle(
-                                color: Color(0xFF394B0A),
-                                fontSize: 17,
-                                fontFamily: 'Montserrat',
-                                fontVariations: [
-                                  FontVariation('wght', 400),
-                                ],
-                                height: 1.30,
-                              ),
-                              softWrap: true,
-                              overflow: TextOverflow.visible,
-                            )
-                          ],
+                          ),
                         ),
                       ),
-                      options: CarouselOptions(
-                        height: double.infinity,
-                        autoPlay: true,
-                        autoPlayInterval: const Duration(milliseconds: 3000),
-                        viewportFraction: 1.0,
-                        enableInfiniteScroll: true,
-                      ),
+                    ),
+                  ),
+                  SizedBox(height: 20),
+                  Text(
+                    'Adatvédelmi tájékoztató',
+                    textAlign: TextAlign.center,
+                    style: TextStyle(
+                      color: const Color(0x7F394C0A) /* Text-Teritary */,
+                      fontSize: 14,
+                      fontFamily: 'Montserrat',
+                      fontVariations: [
+                        FontVariation('wght', 500),
+                      ],
+                      height: 1.30,
                     ),
                   ),
                 ],
               ),
             ),
-          ),
-        ),
+          ],
+        )),
       ),
     );
   }

firka/pubspec.yaml

@@ -45,7 +45,8 @@ dependencies:
   path_provider: ^2.1.0
   carousel_slider: ^5.0.0
   i18n_extension: ^15.0.4
-
+  flutter_inappwebview: ^6.1.5
+  
 dev_dependencies:
   flutter_test:
     sdk: flutter
@@ -61,6 +62,7 @@ flutter:
     - assets/images/logos/colored_logo.png
     - assets/images/carousel/
 
+
   fonts:
     - family: Montserrat
       fonts: