AppLinks セクションを追加

lib/app/home_page.dart

@@ -5,6 +5,7 @@ import 'package:confwebsite2023/core/components/responsive_widget.dart';
 import 'package:confwebsite2023/core/theme.dart';
 import 'package:confwebsite2023/features/access/ui/access_widget.dart';
 import 'package:confwebsite2023/features/announcement/ui/announcement_section.dart';
+import 'package:confwebsite2023/features/app_links/ui/app_links_section.dart';
 import 'package:confwebsite2023/features/count_down/model/count_down_timer.dart';
 import 'package:confwebsite2023/features/count_down/ui/count_down_section.dart';
 import 'package:confwebsite2023/features/event/hands-on/ui/hands_on_event.dart';
@@ -184,6 +185,13 @@ class _MainPageBody extends StatelessWidget {
             const SliverToBoxAdapter(
               child: Spaces.vertical_80,
             ),
+            _Sliver(
+              padding: padding,
+              child: const AppLinksSection(),
+            ),
+            const SliverToBoxAdapter(
+              child: Spaces.vertical_80,
+            ),
             _Sliver(
               padding: padding,
               child: const NewsSection(),

lib/core/theme/app_text_style.dart

@@ -13,7 +13,7 @@ class AppTextStyle {
   );
 
   static final _shadowHeading2 = Shadow(
-    color: GradientConstant.accent.secoundary.colors.last.withOpacity(0.25),
+    color: GradientConstant.accent.secondary.colors.last.withOpacity(0.25),
     blurRadius: 10,
     offset: const Offset(0, 2),
   );

lib/core/theme/dimension.dart

@@ -18,7 +18,9 @@ class Spaces {
   static const SizedBox vertical_16 = SizedBox(height: 16);
   static const SizedBox vertical_20 = SizedBox(height: 20);
   static const SizedBox vertical_24 = SizedBox(height: 24);
+  static const SizedBox vertical_28 = SizedBox(height: 28);
   static const SizedBox vertical_30 = SizedBox(height: 30);
+  static const SizedBox vertical_36 = SizedBox(height: 36);
   static const SizedBox vertical_40 = SizedBox(height: 40);
   static const SizedBox vertical_80 = SizedBox(height: 80);
   static const SizedBox vertical_82 = SizedBox(height: 82);

lib/core/theme/gradient.dart

@@ -19,7 +19,7 @@ class _Accent {
         ],
       );
 
-  Gradient get secoundary => const LinearGradient(
+  Gradient get secondary => const LinearGradient(
         colors: [
           Color.fromARGB(255, 243, 239, 147),
           Color.fromARGB(255, 241, 122, 55),
@@ -30,14 +30,6 @@ class _Accent {
 class _Sponsor {
   const _Sponsor();
 
-  Gradient get diamond => const LinearGradient(
-        colors: [
-          Color.fromARGB(255, 155, 202, 240),
-          Color.fromARGB(255, 225, 253, 255),
-          Color.fromARGB(255, 155, 202, 240),
-        ],
-      );
-
   Gradient get platinum => const LinearGradient(
         colors: [
           Color.fromARGB(255, 225, 236, 255),

lib/features/app_links/ui/app_links.dart

@@ -0,0 +1,95 @@
+import 'dart:async';
+
+import 'package:confwebsite2023/core/components/responsive_widget.dart';
+import 'package:confwebsite2023/core/gen/assets.gen.dart';
+import 'package:flutter/material.dart';
+import 'package:url_launcher/url_launcher.dart';
+
+final class AppLinks extends StatelessWidget {
+  const AppLinks({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final screenSizeType = ResponsiveWidget.getScreenSizeType(context);
+    final spacing = switch (screenSizeType) {
+      ScreenSizeType.large || ScreenSizeType.medium => 40.0,
+      ScreenSizeType.small => 24.0,
+    };
+    return Wrap(
+      alignment: WrapAlignment.center,
+      spacing: spacing,
+      runSpacing: spacing,
+      children: const [
+        _AppLink.appStore(),
+        _AppLink.googlePlay(),
+      ],
+    );
+  }
+}
+
+final class _AppLink extends StatelessWidget {
+  const _AppLink.appStore() : _type = _AppLinkType.appStore;
+
+  const _AppLink.googlePlay() : _type = _AppLinkType.googlePlay;
+
+  final _AppLinkType _type;
+
+  @override
+  Widget build(BuildContext context) {
+    final onTap = switch (_type) {
+      _AppLinkType.appStore => () {
+          final uri = Uri.parse(
+            'https://apps.apple.com/app/id6469518498',
+          );
+          unawaited(launchUrl(uri));
+        },
+      _AppLinkType.googlePlay => () {
+          final uri = Uri.parse(
+            'https://play.google.com/store/apps/details?id=jp.flutterkaigi.conf2023',
+          );
+          unawaited(launchUrl(uri));
+        },
+    };
+
+    final assetName = switch (_type) {
+      _AppLinkType.appStore => Assets.appLinks.appStore.keyName,
+      _AppLinkType.googlePlay => Assets.appLinks.googlePlay.keyName,
+    };
+
+    final imageButton = Material(
+      color: Colors.transparent,
+      child: Ink.image(
+        image: AssetImage(assetName),
+        fit: BoxFit.fitHeight,
+        child: InkWell(
+          onTap: onTap,
+          borderRadius: BorderRadius.circular(8),
+        ),
+      ),
+    );
+
+    final screenSizeType = ResponsiveWidget.getScreenSizeType(context);
+    final height = switch (screenSizeType) {
+      ScreenSizeType.large || ScreenSizeType.medium => 54.0,
+      ScreenSizeType.small => 42.0,
+    };
+
+    final aspectRatio = switch (_type) {
+      _AppLinkType.appStore => 148 / 54,
+      _AppLinkType.googlePlay => 182 / 54,
+    };
+
+    return SizedBox(
+      height: height,
+      child: AspectRatio(
+        aspectRatio: aspectRatio,
+        child: imageButton,
+      ),
+    );
+  }
+}
+
+enum _AppLinkType {
+  appStore,
+  googlePlay,
+}

lib/features/app_links/ui/app_links_header.dart

@@ -0,0 +1,27 @@
+import 'package:confwebsite2023/core/components/responsive_widget.dart';
+import 'package:confwebsite2023/core/components/section_header.dart';
+import 'package:confwebsite2023/core/theme/app_text_style.dart';
+import 'package:confwebsite2023/core/theme/gradient.dart';
+import 'package:flutter/material.dart';
+
+final class AppLinksHeader extends StatelessWidget {
+  const AppLinksHeader({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    const text = 'Application';
+    final gradient = GradientConstant.accent.secondary;
+    return ResponsiveWidget(
+      largeWidget: SectionHeader.centerAlignment(
+        text: text,
+        style: AppTextStyle.pcHeading2,
+        gradient: gradient,
+      ),
+      smallWidget: SectionHeader.centerAlignment(
+        text: text,
+        style: AppTextStyle.spHeading2,
+        gradient: gradient,
+      ),
+    );
+  }
+}

lib/features/app_links/ui/app_links_section.dart

@@ -0,0 +1,22 @@
+import 'package:confwebsite2023/core/theme.dart';
+import 'package:confwebsite2023/features/app_links/ui/app_links.dart';
+import 'package:confwebsite2023/features/app_links/ui/app_links_header.dart';
+import 'package:confwebsite2023/features/app_links/ui/app_links_summary.dart';
+import 'package:flutter/material.dart';
+
+final class AppLinksSection extends StatelessWidget {
+  const AppLinksSection({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return const Column(
+      children: [
+        AppLinksHeader(),
+        Spaces.vertical_28,
+        AppLinksSummary(),
+        Spaces.vertical_36,
+        AppLinks(),
+      ],
+    );
+  }
+}

lib/features/app_links/ui/app_links_summary.dart

@@ -0,0 +1,27 @@
+import 'package:confwebsite2023/core/components/responsive_widget.dart';
+import 'package:flutter/material.dart';
+
+final class AppLinksSummary extends StatelessWidget {
+  const AppLinksSummary({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final textColor = theme.colorScheme.onPrimaryContainer;
+    final textStyle = theme.textTheme.bodyLarge?.copyWith(
+      color: textColor,
+    );
+    final screenType = ResponsiveWidget.getScreenSizeType(context);
+    final text = switch (screenType) {
+      ScreenSizeType.large ||
+      ScreenSizeType.medium =>
+        'FlutterKaigi 2023 のカンファレンスアプリをダウンロード',
+      ScreenSizeType.small => 'FlutterKaigi 2023 の\nカンファレンスアプリをダウンロード',
+    };
+    return Text(
+      text,
+      textAlign: TextAlign.center,
+      style: textStyle,
+    );
+  }
+}

lib/features/sponsor/ui/detail/sponsor_session.dart

@@ -58,7 +58,7 @@ final class _SponsorSessionHeader extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     const title = 'Sponsor Session';
-    final gradient = GradientConstant.accent.secoundary;
+    final gradient = GradientConstant.accent.secondary;
     return ResponsiveWidget(
       largeWidget: SectionHeader.centerAlignment(
         text: title,

pubspec.yaml

@@ -53,6 +53,7 @@ flutter:
   generate: true
   assets:
     - .env
+    - assets/app_links/
     - assets/icons/
     - assets/sponsors/
     - assets/