changed premium directories to plus
This commit is contained in:
643
refilc_mobile_ui/lib/plus/plus_screen.dart
Normal file
643
refilc_mobile_ui/lib/plus/plus_screen.dart
Normal file
@@ -0,0 +1,643 @@
|
||||
import 'package:refilc/theme/colors/colors.dart';
|
||||
import 'package:refilc_mobile_ui/plus/plus_screen.i18n.dart';
|
||||
import 'package:refilc_mobile_ui/plus/components/plan_card.dart';
|
||||
import 'package:flutter_feather_icons/flutter_feather_icons.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:refilc_plus/providers/premium_provider.dart';
|
||||
import 'package:refilc_plus/ui/mobile/plus/upsell.dart';
|
||||
|
||||
import 'components/active_sponsor_card.dart';
|
||||
// import 'components/github_button.dart';
|
||||
|
||||
class PlusScreen extends StatefulWidget {
|
||||
const PlusScreen({super.key});
|
||||
|
||||
@override
|
||||
State<PlusScreen> createState() => PlusScreenState();
|
||||
}
|
||||
|
||||
class PlusScreenState extends State<PlusScreen> {
|
||||
Uri parseTierUri({required String tierId}) {
|
||||
return Uri.parse(
|
||||
'https://github.com/sponsors/refilc/sponsorships?tier_id=$tierId&preview=true');
|
||||
}
|
||||
|
||||
bool showLifetime = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
LinearGradient plusGradient = const LinearGradient(
|
||||
colors: [
|
||||
Color(0xFF7087FF),
|
||||
Color(0xFF9069FF),
|
||||
Color(0xFFE4D7FF),
|
||||
Color(0xFFDBC5FF),
|
||||
Color(0xFFE57DFF),
|
||||
Color(0xFFDBB7FF),
|
||||
Color(0xFF6850FF),
|
||||
Color(0xFF2144FF),
|
||||
],
|
||||
stops: [0.0, 0.16, 0.32, 0.49, 0.69, 0.8, 0.92, 1.0],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
);
|
||||
LinearGradient goldGradient = const LinearGradient(
|
||||
colors: [
|
||||
Color(0xFFFFBD70),
|
||||
Color(0xFFFFDE69),
|
||||
Color(0xFFFFECD7),
|
||||
Color(0xFFFFE4C5),
|
||||
Color(0xFFFFDB7D),
|
||||
Color(0xFFFFDEB7),
|
||||
Color(0xFFFFAE50),
|
||||
Color(0xFFFF9921),
|
||||
],
|
||||
stops: [0.0, 0.16, 0.32, 0.49, 0.69, 0.8, 0.92, 1.0],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
);
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xffF4F9FF),
|
||||
body: Container(
|
||||
padding: EdgeInsets.zero,
|
||||
width: double.infinity,
|
||||
decoration: const BoxDecoration(
|
||||
image: DecorationImage(
|
||||
image: AssetImage('assets/images/premium_top_banner.png'),
|
||||
fit: BoxFit.fitWidth,
|
||||
alignment: Alignment.topCenter,
|
||||
),
|
||||
),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
const Color(0xffF4F9FF).withOpacity(0.30),
|
||||
const Color(0xffF4F9FF).withOpacity(0.40),
|
||||
const Color(0xffF4F9FF).withOpacity(0.50),
|
||||
const Color(0xffF4F9FF).withOpacity(0.60),
|
||||
const Color(0xffF4F9FF).withOpacity(0.70),
|
||||
],
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
stops: const [0.0, 0.1, 0.15, 0.2, 0.25],
|
||||
),
|
||||
),
|
||||
child: ListView(
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
const Color(0xffF4F9FF).withOpacity(0.0),
|
||||
const Color(0xffF4F9FF).withOpacity(0.7),
|
||||
const Color(0xffF4F9FF).withOpacity(0.8),
|
||||
const Color(0xffF4F9FF).withOpacity(0.9),
|
||||
const Color(0xffF4F9FF),
|
||||
],
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
stops: const [0.0, 0.1, 0.15, 0.18, 0.22],
|
||||
),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 20.0, vertical: 15.0),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// heading (title, x button)
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: 12.0),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
'reFilc+',
|
||||
style: TextStyle(
|
||||
fontSize: 33,
|
||||
color: Color(0xFF0a1c41),
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
icon: const Icon(
|
||||
FeatherIcons.x,
|
||||
color: Colors.black,
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
||||
child: Text.rich(
|
||||
TextSpan(
|
||||
text: 'even_more_cheaper'.i18n,
|
||||
style: const TextStyle(
|
||||
height: 1.2,
|
||||
fontSize: 22,
|
||||
color: Color(0xFF0A1C41),
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
children: [
|
||||
WidgetSpan(
|
||||
child: Transform.translate(
|
||||
offset: const Offset(1.0, -5.5),
|
||||
child: Text(
|
||||
'1',
|
||||
style: TextStyle(
|
||||
fontSize: 14.4,
|
||||
color: const Color(0xFF0A1C41)
|
||||
.withOpacity(0.5),
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
// cards and description
|
||||
const SizedBox(
|
||||
height: 60,
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
||||
child: Text.rich(
|
||||
TextSpan(
|
||||
children: [
|
||||
TextSpan(text: 'support_1'.i18n),
|
||||
WidgetSpan(
|
||||
child: Transform.translate(
|
||||
offset: const Offset(1.0, -3.6),
|
||||
child: Text(
|
||||
'2',
|
||||
style: TextStyle(
|
||||
color: const Color(0xFF011234)
|
||||
.withOpacity(0.5),
|
||||
fontSize: 10.0,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
TextSpan(
|
||||
text: 'support_2'.i18n,
|
||||
),
|
||||
],
|
||||
style: TextStyle(
|
||||
color: const Color(0xFF011234).withOpacity(0.6),
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 18,
|
||||
),
|
||||
PlusPlanCard(
|
||||
active: ActiveSponsorCard.estimateLevel(
|
||||
context.watch<PremiumProvider>().scopes) ==
|
||||
PremiumFeatureLevel.cap,
|
||||
iconPath: 'assets/images/plus_tier_cap.png',
|
||||
title: 'reFilc+',
|
||||
description: 'tier_rfp'.i18n,
|
||||
color: const Color(0xFF7C3EFF),
|
||||
gradient: plusGradient,
|
||||
id: showLifetime ? 'refilcpluslifetime' : 'refilcplus',
|
||||
price: showLifetime ? 39.99 : 0.99,
|
||||
borderRadius: const BorderRadius.vertical(
|
||||
top: Radius.circular(16.0),
|
||||
bottom: Radius.circular(16.0)),
|
||||
features: [
|
||||
['✨', 'rfp_1'.i18n],
|
||||
['1️⃣', 'rfp_5'.i18n],
|
||||
// ['👥', 'rfp_2'.i18n],
|
||||
['👋', 'rfp_3'.i18n],
|
||||
['📓', 'rfp_4'.i18n],
|
||||
['🎓', 'rfp_6'.i18n],
|
||||
['🔜', 'more_soon'.i18n],
|
||||
],
|
||||
),
|
||||
const SizedBox(
|
||||
height: 12.0,
|
||||
),
|
||||
PlusPlanCard(
|
||||
active: ActiveSponsorCard.estimateLevel(
|
||||
context.watch<PremiumProvider>().scopes) ==
|
||||
PremiumFeatureLevel.ink,
|
||||
iconPath: 'assets/images/plus_tier_ink.png',
|
||||
title: 'reFilc+ Gold',
|
||||
description: 'tier_rfpgold'.i18n,
|
||||
color: const Color(0xFFFFBD3E),
|
||||
gradient: goldGradient,
|
||||
id: showLifetime
|
||||
? 'refilcplusgoldlifetime'
|
||||
: 'refilcplusgold',
|
||||
price: showLifetime ? 59.99 : 2.99,
|
||||
borderRadius: const BorderRadius.vertical(
|
||||
top: Radius.circular(16.0),
|
||||
bottom: Radius.circular(16.0)),
|
||||
features: [
|
||||
['🕑', 'rfp_7'.i18n],
|
||||
['🔤', 'rfp_8'.i18n],
|
||||
// ['👥', 'rfp_9'.i18n],
|
||||
// ['🎓', 'Összesített átlagszámoló'],
|
||||
['📱', 'rfp_10'.i18n],
|
||||
['🟦', 'rfp_11'.i18n],
|
||||
['📒', 'rfp_12'.i18n],
|
||||
['📅', 'rfp_13'.i18n],
|
||||
const ['🖋️', 'cap_tier_benefits'],
|
||||
['🔜', 'more_soon'.i18n],
|
||||
],
|
||||
),
|
||||
// const SizedBox(
|
||||
// height: 8.0,
|
||||
// ),
|
||||
// PlusPlanCard(
|
||||
// active: ActiveSponsorCard.estimateLevel(
|
||||
// context.watch<PremiumProvider>().scopes) ==
|
||||
// PremiumFeatureLevel.sponge,
|
||||
// iconPath: 'assets/images/plus_tier_sponge.png',
|
||||
// title: 'Szivacs',
|
||||
// description:
|
||||
// 'Férj hozzá még több funkcióhoz, használj még több profilt és tedd egyszerűbbé mindennapjaid.',
|
||||
// color: const Color(0xFFFFC700),
|
||||
// id: 'refilcplusgold',
|
||||
// price: 4.99,
|
||||
// borderRadius: const BorderRadius.vertical(
|
||||
// top: Radius.circular(8.0),
|
||||
// bottom: Radius.circular(16.0)),
|
||||
// features: const [
|
||||
// ['👥', 'Korlátlan fiók használata egyszerre'],
|
||||
// ['🖋️', 'ink_cap_tier_benefits'],
|
||||
// ],
|
||||
// ),
|
||||
// const SizedBox(
|
||||
// height: 18.0,
|
||||
// ),
|
||||
// const GithubLoginButton(),
|
||||
// lifetime plan toggle
|
||||
const SizedBox(
|
||||
height: 18.0,
|
||||
),
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(16.0),
|
||||
border: Border.all(
|
||||
color: AppColors.of(context).text.withOpacity(0.2),
|
||||
),
|
||||
),
|
||||
child: SwitchListTile(
|
||||
contentPadding:
|
||||
const EdgeInsets.only(left: 15.0, right: 10.0),
|
||||
value: showLifetime,
|
||||
onChanged: (value) {
|
||||
setState(() {
|
||||
showLifetime = !showLifetime;
|
||||
});
|
||||
},
|
||||
title: Text('show_lifetime'.i18n),
|
||||
),
|
||||
),
|
||||
// faq section
|
||||
const SizedBox(
|
||||
height: 30.0,
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
||||
child: Text(
|
||||
'faq'.i18n,
|
||||
style: TextStyle(
|
||||
color: const Color(0xFF011234).withOpacity(0.6),
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 18,
|
||||
),
|
||||
Card(
|
||||
margin: EdgeInsets.zero,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.vertical(
|
||||
top: Radius.circular(16.0),
|
||||
bottom: Radius.circular(8.0),
|
||||
),
|
||||
),
|
||||
shadowColor: Colors.transparent,
|
||||
surfaceTintColor: const Color(0xffFFFFFF),
|
||||
color: Colors.white,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(
|
||||
top: 18.0,
|
||||
bottom: 16.0,
|
||||
left: 22.0,
|
||||
right: 18.0,
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'money'.i18n,
|
||||
style: const TextStyle(
|
||||
fontSize: 16.6,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.black,
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 14.0,
|
||||
),
|
||||
Text.rich(
|
||||
TextSpan(
|
||||
style: TextStyle(
|
||||
color: const Color(0xFF011234)
|
||||
.withOpacity(0.6),
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
children: [
|
||||
TextSpan(
|
||||
text: 'm_1'.i18n,
|
||||
),
|
||||
WidgetSpan(
|
||||
child: Transform.translate(
|
||||
offset: const Offset(1.0, -3.6),
|
||||
child: Text(
|
||||
'3',
|
||||
style: TextStyle(
|
||||
color: const Color(0xFF011234)
|
||||
.withOpacity(0.5),
|
||||
fontSize: 10.0,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
TextSpan(
|
||||
text: 'm_2'.i18n,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 8.0,
|
||||
),
|
||||
Card(
|
||||
margin: EdgeInsets.zero,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.vertical(
|
||||
top: Radius.circular(8.0),
|
||||
bottom: Radius.circular(16.0),
|
||||
),
|
||||
),
|
||||
shadowColor: Colors.transparent,
|
||||
surfaceTintColor: const Color(0xffFFFFFF),
|
||||
color: Colors.white,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(
|
||||
top: 18.0,
|
||||
bottom: 16.0,
|
||||
left: 22.0,
|
||||
right: 18.0,
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'open'.i18n,
|
||||
style: const TextStyle(
|
||||
fontSize: 16.6,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.black,
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 14.0,
|
||||
),
|
||||
Text(
|
||||
'o_1'.i18n,
|
||||
style: TextStyle(
|
||||
color:
|
||||
const Color(0xFF011234).withOpacity(0.6),
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 30.0,
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
||||
child: Text(
|
||||
'desc'.i18n,
|
||||
style: TextStyle(
|
||||
color: const Color(0xFF011234).withOpacity(0.6),
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
height: 18,
|
||||
),
|
||||
Card(
|
||||
margin: EdgeInsets.zero,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.vertical(
|
||||
top: Radius.circular(8.0),
|
||||
bottom: Radius.circular(16.0),
|
||||
),
|
||||
),
|
||||
shadowColor: Colors.transparent,
|
||||
surfaceTintColor: const Color(0xffFFFFFF),
|
||||
color: Colors.white,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(
|
||||
top: 18.0,
|
||||
bottom: 16.0,
|
||||
left: 22.0,
|
||||
right: 18.0,
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xff011234),
|
||||
borderRadius: BorderRadius.circular(20.0),
|
||||
),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 10.0,
|
||||
vertical: 2.5,
|
||||
),
|
||||
child: const Text(
|
||||
'1',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
width: 14.0,
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'cheaper'.i18n,
|
||||
maxLines: 5,
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w500,
|
||||
fontSize: 14.4,
|
||||
height: 1.3,
|
||||
color: Colors.black,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(
|
||||
height: 14.0,
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xff011234),
|
||||
borderRadius: BorderRadius.circular(20.0),
|
||||
),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 8.8,
|
||||
vertical: 2.5,
|
||||
),
|
||||
child: const Text(
|
||||
'2',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
width: 14.0,
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'qwit'.i18n,
|
||||
maxLines: 5,
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w500,
|
||||
fontSize: 14.4,
|
||||
height: 1.3,
|
||||
color: Colors.black,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(
|
||||
height: 14.0,
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xff011234),
|
||||
borderRadius: BorderRadius.circular(20.0),
|
||||
),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 8.6,
|
||||
vertical: 2.5,
|
||||
),
|
||||
child: const Text(
|
||||
'3',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
width: 14.0,
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'apple'.i18n,
|
||||
maxLines: 5,
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w500,
|
||||
fontSize: 14.4,
|
||||
height: 1.3,
|
||||
color: Colors.black,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(
|
||||
height: 14.0,
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xff011234),
|
||||
borderRadius: BorderRadius.circular(20.0),
|
||||
),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 7.9,
|
||||
vertical: 2.5,
|
||||
),
|
||||
child: const Text(
|
||||
'4',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(
|
||||
width: 14.0,
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'eur'.i18n,
|
||||
maxLines: 5,
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w500,
|
||||
fontSize: 14.4,
|
||||
height: 1.3,
|
||||
color: Colors.black,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user