From 1b8276470073bfda61f21ec936da7ee820063afa Mon Sep 17 00:00:00 2001 From: Saumya-28 Date: Wed, 5 Jun 2024 15:53:45 +0530 Subject: [PATCH] Improved UI of Linux Foundation Screen --- lib/programs screen/linux_foundation.dart | 2 +- lib/widgets/linux_foundation_widget.dart | 87 ++++++++++++++--------- 2 files changed, 56 insertions(+), 33 deletions(-) diff --git a/lib/programs screen/linux_foundation.dart b/lib/programs screen/linux_foundation.dart index 9bc0fa0..4734921 100644 --- a/lib/programs screen/linux_foundation.dart +++ b/lib/programs screen/linux_foundation.dart @@ -74,7 +74,7 @@ class _LinuxFoundationState extends State { return RefreshIndicator( onRefresh: _refresh, child: Scaffold( - appBar: AppBar(title: const Text('OpSo'), actions: [ + appBar: AppBar(title: const Text('Linux Foundation'), actions: [ IconButton( icon: (isBookmarked) ? const Icon(Icons.bookmark_add_rounded) diff --git a/lib/widgets/linux_foundation_widget.dart b/lib/widgets/linux_foundation_widget.dart index 3714410..b6b89aa 100644 --- a/lib/widgets/linux_foundation_widget.dart +++ b/lib/widgets/linux_foundation_widget.dart @@ -3,6 +3,7 @@ import 'package:flutter_svg/flutter_svg.dart'; import 'package:opso/modals/linux_foundation_modal.dart'; import 'package:url_launcher/url_launcher.dart'; + class LinuxFoundationWidget extends StatelessWidget { final LinuxFoundationModal modal; final double height; @@ -10,47 +11,69 @@ class LinuxFoundationWidget extends StatelessWidget { const LinuxFoundationWidget( {super.key, required this.modal, this.height = 100, this.width = 100}); + @override Widget build(BuildContext context) { + bool isDarkMode = Theme.of(context).brightness == Brightness.dark; + + return GestureDetector( onTap: () => launchUrl(Uri.parse(modal.projectUrl)), - child: Container( - constraints: BoxConstraints( - minHeight: height, + child: Card( + elevation: 5, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(20), ), - width: width, - decoration: BoxDecoration( - color: const Color.fromARGB(255, 153, 152, 152), - borderRadius: BorderRadius.circular(20)), - child: Padding( - padding: const EdgeInsets.all(20.0), - child: Column( - // mainAxisAlignment: MainAxisAlignment.spaceEvenly, - children: [ - // const SizedBox(height: 20), - SvgPicture.network( - modal.imageUrl, - fit: BoxFit.fitWidth, - height: 60, - placeholderBuilder: (context) => - const CircularProgressIndicator(), - ), - const SizedBox(height: 10), - Text( - modal.name, - style: const TextStyle( - fontSize: 18, - color: Color.fromARGB(255, 190, 200, 221), - fontWeight: FontWeight.bold, - decoration: TextDecoration.underline, - decorationColor: Color.fromARGB(255, 190, 200, 221), + child: Container( + width: width, + constraints: BoxConstraints(minHeight: height), + decoration: BoxDecoration( + color: isDarkMode + ? const Color.fromARGB(255, 48, 48, 48) + : const Color.fromARGB(255, 255, 255, 255), + border: Border.all( + color: isDarkMode ? Colors.orange.shade100 : Colors.orange.shade300, + width: 1, + ), + borderRadius: BorderRadius.circular(20), + ), + child: Padding( + padding: const EdgeInsets.all(20.0), + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + modal.imageUrl == "" + ? SvgPicture.asset( + 'assets/logo.png', + fit: BoxFit.fitWidth, + height: 60, + ) + : + SvgPicture.network( + modal.imageUrl, + fit: BoxFit.fitWidth, + height: 60, + placeholderBuilder: (context) => const CircularProgressIndicator(), + ), + const SizedBox(height: 10), + Text( + modal.name, + style: TextStyle( + fontSize: 20, + color: Colors.orange, + fontWeight: FontWeight.bold, + decoration: TextDecoration.underline, + decorationColor: Colors.orange, + ), + textAlign: TextAlign.center, ), - textAlign: TextAlign.center, - ), - ], + const SizedBox(height: 10), + ], + ), ), ), ), ); } } +