Ui improvements for tablet mode

lib/config/sizes.dart

@@ -0,0 +1,3 @@
+class Sizes {
+  static int tabletBreakpoint = 800;
+}

lib/screens/bookmarks/ui/bookmark_form_modal.dart

@@ -1,5 +1,3 @@
-import 'dart:io';
-
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:easy_autocomplete/easy_autocomplete.dart';
@@ -8,17 +6,16 @@ import 'package:linkdy/screens/bookmarks/provider/bookmark_form.provider.dart';
 import 'package:linkdy/widgets/section_label.dart';
 
 import 'package:linkdy/models/data/bookmarks.dart';
+import 'package:linkdy/config/sizes.dart';
 import 'package:linkdy/i18n/strings.g.dart';
 import 'package:linkdy/constants/global_keys.dart';
 import 'package:linkdy/constants/enums.dart';
 
 class BookmarkFormModal extends ConsumerStatefulWidget {
-  final bool fullscreen;
   final Bookmark? bookmark;
 
   const BookmarkFormModal({
     super.key,
-    required this.fullscreen,
     this.bookmark,
   });
 
@@ -37,6 +34,56 @@ class BookmarkFormModalState extends ConsumerState<BookmarkFormModal> {
 
   @override
   Widget build(BuildContext context) {
+    final width = MediaQuery.of(context).size.width;
+
+    if (width > Sizes.tabletBreakpoint) {
+      return ScaffoldMessenger(
+        key: ScaffoldMessengerKeys.addBookmark,
+        child: Dialog(
+          child: ConstrainedBox(
+            constraints: const BoxConstraints(maxWidth: 500, maxHeight: 700),
+            child: Column(
+              children: [
+                Padding(
+                  padding: const EdgeInsets.all(16),
+                  child: Row(
+                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                    children: [
+                      Row(
+                        children: [
+                          CloseButton(
+                            onPressed: () => Navigator.pop(context),
+                          ),
+                          const SizedBox(width: 16),
+                          Text(
+                            widget.bookmark != null
+                                ? t.bookmarks.addBookmark.editBookmark
+                                : t.bookmarks.addBookmark.addBookmark,
+                            style: const TextStyle(fontSize: 24),
+                          ),
+                        ],
+                      ),
+                      IconButton(
+                        onPressed: ref.watch(bookmarkFormProvider).checkBookmark != null
+                            ? () => ref.read(bookmarkFormProvider.notifier).saveBookmark()
+                            : null,
+                        icon: const Icon(Icons.save_rounded),
+                        tooltip: t.generic.save,
+                      ),
+                    ],
+                  ),
+                ),
+                Expanded(
+                  child: ListView(
+                    children: const [_ModalContent()],
+                  ),
+                ),
+              ],
+            ),
+          ),
+        ),
+      );
+    } else {
       return ScaffoldMessenger(
         key: ScaffoldMessengerKeys.addBookmark,
         child: Dialog.fullscreen(
@@ -92,6 +139,7 @@ class BookmarkFormModalState extends ConsumerState<BookmarkFormModal> {
         ),
       );
     }
+  }
 }
 
 class _ModalContent extends ConsumerWidget {
@@ -377,7 +425,7 @@ void openBookmarkFormModal({
 }) {
   showGeneralDialog(
     context: context,
-    barrierColor: !(width > 700 || !(Platform.isAndroid || Platform.isIOS)) ? Colors.transparent : Colors.black54,
+    barrierColor: Colors.black54,
     transitionBuilder: (context, anim1, anim2, child) {
       return SlideTransition(
         position: Tween(begin: const Offset(0, 1), end: const Offset(0, 0)).animate(
@@ -386,9 +434,6 @@ void openBookmarkFormModal({
         child: child,
       );
     },
-    pageBuilder: (context, animation, secondaryAnimation) => BookmarkFormModal(
-      fullscreen: width <= 700,
-      bookmark: bookmark,
-    ),
+    pageBuilder: (context, animation, secondaryAnimation) => const BookmarkFormModal(),
   );
 }

lib/screens/onboarding/ui/onboarding.dart

@@ -7,6 +7,7 @@ import 'package:linkdy/screens/onboarding/ui/server_required.dart';
 import 'package:linkdy/screens/onboarding/ui/welcome.dart';
 import 'package:linkdy/widgets/system_overlay_style.dart';
 
+import 'package:linkdy/config/sizes.dart';
 import 'package:linkdy/constants/global_keys.dart';
 
 class Onboarding extends ConsumerWidget {
@@ -19,6 +20,28 @@ class Onboarding extends ConsumerWidget {
         key: ScaffoldMessengerKeys.onboarding,
         child: Scaffold(
           body: SafeArea(
+            child: LayoutBuilder(
+              builder: (context, constraints) {
+                return Center(
+                  child: ConstrainedBox(
+                    constraints: constraints.maxWidth > Sizes.tabletBreakpoint
+                        ? const BoxConstraints(maxWidth: 500, maxHeight: 600)
+                        : const BoxConstraints.expand(),
+                    child: Container(
+                      decoration: constraints.maxWidth > Sizes.tabletBreakpoint
+                          ? BoxDecoration(
+                              color: Theme.of(context).colorScheme.surface,
+                              borderRadius: BorderRadius.circular(28),
+                              boxShadow: [
+                                BoxShadow(
+                                  color: Colors.grey.withOpacity(0.5),
+                                  spreadRadius: 5,
+                                  blurRadius: 7,
+                                  offset: const Offset(0, 3), // changes position of shadow
+                                ),
+                              ],
+                            )
+                          : null,
                       child: PageView(
                         controller: ref.watch(onboardingProvider).pageController,
                         physics: const NeverScrollableScrollPhysics(),
@@ -30,6 +53,11 @@ class Onboarding extends ConsumerWidget {
                       ),
                     ),
                   ),
+                );
+              },
+            ),
+          ),
+        ),
       ),
     );
   }

lib/screens/onboarding/ui/welcome.dart

@@ -5,15 +5,12 @@ import 'package:linkdy/i18n/strings.g.dart';
 import 'package:linkdy/screens/onboarding/provider/onboarding.provider.dart';
 
 class OnboardingWelcome extends ConsumerWidget {
-  const OnboardingWelcome({Key? key}) : super(key: key);
+  const OnboardingWelcome({super.key});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    final width = MediaQuery.of(context).size.width;
-    final height = MediaQuery.of(context).size.height;
-
-    final iconSize = width > height ? height : width;
-
+    return LayoutBuilder(
+      builder: (context, constraints) {
         return Padding(
           padding: const EdgeInsets.all(24),
           child: Stack(
@@ -68,7 +65,9 @@ class OnboardingWelcome extends ConsumerWidget {
                   angle: 0.7,
                   child: Icon(
                     Icons.link_rounded,
-                size: iconSize - 48,
+                    size: constraints.maxWidth > constraints.maxHeight
+                        ? constraints.maxHeight
+                        : constraints.maxWidth - 48,
                     color: Theme.of(context).colorScheme.secondary.withOpacity(0.2),
                   ),
                 ),
@@ -76,5 +75,7 @@ class OnboardingWelcome extends ConsumerWidget {
             ],
           ),
         );
+      },
+    );
   }
 }

lib/widgets/circle_page_transition.dart

@@ -14,7 +14,7 @@ Route circlePageBuilder({
     fullscreenDialog: fullScreenDialog ?? false,
     transitionsBuilder: (context, animation, secondaryAnimation, child) {
       const double beganRadius = 0.0;
-      final double endRadius = MediaQuery.of(context).size.height * 1.2;
+      final double endRadius = MediaQuery.of(context).size.height * 1.7;
 
       final radiusTweenAnimation = animation.drive(
         Tween(begin: beganRadius, end: endRadius),