Add close underlay btn to collectibles and home menu

This commit is contained in:
Shawn 2022-12-19 14:13:25 -07:00
parent 9463be0bcd
commit a40f7c42ce
4 changed files with 54 additions and 17 deletions

View File

@ -87,7 +87,11 @@ class _BaseContentModal extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Padding( return IntrinsicHeight(
child: Center(
child: SizedBox(
width: $styles.sizes.maxContentWidth3,
child: Padding(
padding: EdgeInsets.all($styles.insets.lg), padding: EdgeInsets.all($styles.insets.lg),
child: LightText( child: LightText(
child: SeparatedColumn( child: SeparatedColumn(
@ -102,6 +106,9 @@ class _BaseContentModal extends StatelessWidget {
], ],
), ),
), ),
),
),
),
); );
} }
} }

View File

@ -0,0 +1,16 @@
import 'package:wonders/common_libs.dart';
class PopNavigatorUnderlay extends StatelessWidget {
const PopNavigatorUnderlay({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return ExcludeSemantics(
child: AppBtn.basic(
onPressed: () => Navigator.of(context).pop(),
semanticLabel: '',
child: const SizedBox.expand(),
),
);
}
}

View File

@ -1,7 +1,9 @@
import 'package:particle_field/particle_field.dart'; import 'package:particle_field/particle_field.dart';
import 'package:wonders/common_libs.dart'; import 'package:wonders/common_libs.dart';
import 'package:wonders/logic/data/collectible_data.dart'; import 'package:wonders/logic/data/collectible_data.dart';
import 'package:wonders/ui/common/app_backdrop.dart';
import 'package:wonders/ui/common/centered_box.dart'; import 'package:wonders/ui/common/centered_box.dart';
import 'package:wonders/ui/common/pop_navigator_underlay.dart';
part 'widgets/_animated_ribbon.dart'; part 'widgets/_animated_ribbon.dart';
part 'widgets/_celebration_particles.dart'; part 'widgets/_celebration_particles.dart';
@ -49,8 +51,19 @@ class CollectibleFoundScreen extends StatelessWidget {
Widget _buildDetail(BuildContext context) { Widget _buildDetail(BuildContext context) {
Duration t = $styles.times.fast; Duration t = $styles.times.fast;
return Stack(key: ValueKey('detail'), children: [ return Stack(key: ValueKey('detail'), children: [
Animate().custom(duration: t, builder: (context, ratio, _) => _buildGradient(context, 1, ratio)), /// Background
AppBackdrop(
strength: .5,
child: Container(color: $styles.colors.greyStrong.withOpacity(.96)),
).animate().fadeIn(),
/// Particles
_CelebrationParticles(fadeMs: (t * 6).inMilliseconds), _CelebrationParticles(fadeMs: (t * 6).inMilliseconds),
/// invisible close btn
PopNavigatorUnderlay(),
/// Content
SafeArea( SafeArea(
child: CenteredBox( child: CenteredBox(
width: $styles.sizes.maxContentWidth3, width: $styles.sizes.maxContentWidth3,

View File

@ -5,6 +5,7 @@ import 'package:wonders/logic/data/wonder_data.dart';
import 'package:wonders/ui/common/app_backdrop.dart'; import 'package:wonders/ui/common/app_backdrop.dart';
import 'package:wonders/ui/common/app_icons.dart'; import 'package:wonders/ui/common/app_icons.dart';
import 'package:wonders/ui/common/controls/locale_switcher.dart'; import 'package:wonders/ui/common/controls/locale_switcher.dart';
import 'package:wonders/ui/common/pop_navigator_underlay.dart';
import 'package:wonders/ui/screens/home_menu/about_dialog_content.dart'; import 'package:wonders/ui/screens/home_menu/about_dialog_content.dart';
class HomeMenu extends StatelessWidget { class HomeMenu extends StatelessWidget {
@ -48,11 +49,11 @@ class HomeMenu extends StatelessWidget {
/// Backdrop / Underlay /// Backdrop / Underlay
AppBackdrop( AppBackdrop(
strength: .5, strength: .5,
child: Container( child: Container(color: $styles.colors.greyStrong.withOpacity(.7)),
color: $styles.colors.greyStrong.withOpacity(.7),
),
), ),
PopNavigatorUnderlay(),
SafeArea( SafeArea(
child: PaddedRow( child: PaddedRow(
padding: EdgeInsets.symmetric( padding: EdgeInsets.symmetric(