diff --git a/android/gradle.properties b/android/gradle.properties
index 3e4ee4f7fc752c7bb9d11bf7ffc76f46dd8039d7..dcf12984c36f3453d790ee3d76b4953ce8cb7158 100644
--- a/android/gradle.properties
+++ b/android/gradle.properties
@@ -1,5 +1,5 @@
org.gradle.jvmargs=-Xmx1536M
android.useAndroidX=true
android.enableJetifier=true
-app.versionName=1.0.21
-app.versionCode=22
+app.versionName=1.0.22
+app.versionCode=23
diff --git a/assets/fonts/Nunito-Bold.ttf b/assets/fonts/Nunito-Bold.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..6519feb781449ebe0015cbc74dfd9e13110fbba9
Binary files /dev/null and b/assets/fonts/Nunito-Bold.ttf differ
diff --git a/assets/fonts/Nunito-Light.ttf b/assets/fonts/Nunito-Light.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..8a0736c41cd6c2a1225d356bf274de1d0afc3497
Binary files /dev/null and b/assets/fonts/Nunito-Light.ttf differ
diff --git a/assets/fonts/Nunito-Medium.ttf b/assets/fonts/Nunito-Medium.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..88fccdc0638b6f5d6ac49d9d269dc3d518618ad1
Binary files /dev/null and b/assets/fonts/Nunito-Medium.ttf differ
diff --git a/assets/fonts/Nunito-Regular.ttf b/assets/fonts/Nunito-Regular.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..e7b8375a896ef0cd8e06730a78c84532b377e784
Binary files /dev/null and b/assets/fonts/Nunito-Regular.ttf differ
diff --git a/lib/activities/ActivityDemoPage.dart b/lib/activities/ActivityDemoPage.dart
index cbe5ff79e5f7e990d70034e6e5b0c19785513a9b..b8cceb192700ed2174a1da9b0900e50f99340f2b 100644
--- a/lib/activities/ActivityDemoPage.dart
+++ b/lib/activities/ActivityDemoPage.dart
@@ -20,7 +20,7 @@ class ActivityDemoPage extends StatelessWidget {
),
],
),
- backgroundColor: Colors.blue,
+ backgroundColor: Theme.of(context).colorScheme.background,
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
diff --git a/lib/activities/ActivityGraphPage.dart b/lib/activities/ActivityGraphPage.dart
index 7fa2cbae14ca103b5b265ae37a44577cc9ddf9e0..da60d7ba89f4c69d0589f3efe0a42de5ef14fa1f 100644
--- a/lib/activities/ActivityGraphPage.dart
+++ b/lib/activities/ActivityGraphPage.dart
@@ -22,7 +22,7 @@ class ActivityGraphPage extends StatelessWidget {
),
],
),
- backgroundColor: Colors.blue,
+ backgroundColor: Theme.of(context).colorScheme.background,
body: SafeArea(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
diff --git a/lib/config/theme.dart b/lib/config/theme.dart
new file mode 100644
index 0000000000000000000000000000000000000000..be390348c7868e7c63387df13e13c46de43f8a23
--- /dev/null
+++ b/lib/config/theme.dart
@@ -0,0 +1,196 @@
+import 'package:flutter/material.dart';
+
+/// Colors from Tailwind CSS (v3.0) - June 2022
+///
+/// https://tailwindcss.com/docs/customizing-colors
+
+const int _primaryColor = 0xFF6366F1;
+const MaterialColor primarySwatch = MaterialColor(_primaryColor, <int, Color>{
+ 50: Color(0xFFEEF2FF), // indigo-50
+ 100: Color(0xFFE0E7FF), // indigo-100
+ 200: Color(0xFFC7D2FE), // indigo-200
+ 300: Color(0xFFA5B4FC), // indigo-300
+ 400: Color(0xFF818CF8), // indigo-400
+ 500: Color(_primaryColor), // indigo-500
+ 600: Color(0xFF4F46E5), // indigo-600
+ 700: Color(0xFF4338CA), // indigo-700
+ 800: Color(0xFF3730A3), // indigo-800
+ 900: Color(0xFF312E81), // indigo-900
+});
+
+const int _textColor = 0xFF64748B;
+const MaterialColor textSwatch = MaterialColor(_textColor, <int, Color>{
+ 50: Color(0xFFF8FAFC), // slate-50
+ 100: Color(0xFFF1F5F9), // slate-100
+ 200: Color(0xFFE2E8F0), // slate-200
+ 300: Color(0xFFCBD5E1), // slate-300
+ 400: Color(0xFF94A3B8), // slate-400
+ 500: Color(_textColor), // slate-500
+ 600: Color(0xFF475569), // slate-600
+ 700: Color(0xFF334155), // slate-700
+ 800: Color(0xFF1E293B), // slate-800
+ 900: Color(0xFF0F172A), // slate-900
+});
+
+const Color errorColor = Color(0xFFDC2626); // red-600
+
+final ColorScheme lightColorScheme = ColorScheme.light(
+ primary: primarySwatch.shade500,
+ secondary: primarySwatch.shade500,
+ onSecondary: Colors.white,
+ error: errorColor,
+ background: textSwatch.shade200,
+ onBackground: textSwatch.shade500,
+ onSurface: textSwatch.shade500,
+ surface: textSwatch.shade50,
+ surfaceVariant: Colors.white,
+ shadow: textSwatch.shade900.withOpacity(.1),
+);
+
+final ColorScheme darkColorScheme = ColorScheme.dark(
+ primary: primarySwatch.shade500,
+ secondary: primarySwatch.shade500,
+ onSecondary: Colors.white,
+ error: errorColor,
+ background: const Color(0xFF171724),
+ onBackground: textSwatch.shade400,
+ onSurface: textSwatch.shade300,
+ surface: const Color(0xFF262630),
+ surfaceVariant: const Color(0xFF282832),
+ shadow: textSwatch.shade900.withOpacity(.2),
+);
+
+final ThemeData lightTheme = ThemeData(
+ colorScheme: lightColorScheme,
+ fontFamily: 'Nunito',
+ textTheme: TextTheme(
+ displayLarge: TextStyle(
+ color: textSwatch.shade700,
+ fontFamily: 'Nunito',
+ ),
+ displayMedium: TextStyle(
+ color: textSwatch.shade600,
+ fontFamily: 'Nunito',
+ ),
+ displaySmall: TextStyle(
+ color: textSwatch.shade500,
+ fontFamily: 'Nunito',
+ ),
+ headlineLarge: TextStyle(
+ color: textSwatch.shade700,
+ fontFamily: 'Nunito',
+ ),
+ headlineMedium: TextStyle(
+ color: textSwatch.shade600,
+ fontFamily: 'Nunito',
+ ),
+ headlineSmall: TextStyle(
+ color: textSwatch.shade500,
+ fontFamily: 'Nunito',
+ ),
+ titleLarge: TextStyle(
+ color: textSwatch.shade700,
+ fontFamily: 'Nunito',
+ ),
+ titleMedium: TextStyle(
+ color: textSwatch.shade600,
+ fontFamily: 'Nunito',
+ ),
+ titleSmall: TextStyle(
+ color: textSwatch.shade500,
+ fontFamily: 'Nunito',
+ ),
+ bodyLarge: TextStyle(
+ color: textSwatch.shade700,
+ fontFamily: 'Nunito',
+ ),
+ bodyMedium: TextStyle(
+ color: textSwatch.shade600,
+ fontFamily: 'Nunito',
+ ),
+ bodySmall: TextStyle(
+ color: textSwatch.shade500,
+ fontFamily: 'Nunito',
+ ),
+ labelLarge: TextStyle(
+ color: textSwatch.shade700,
+ fontFamily: 'Nunito',
+ ),
+ labelMedium: TextStyle(
+ color: textSwatch.shade600,
+ fontFamily: 'Nunito',
+ ),
+ labelSmall: TextStyle(
+ color: textSwatch.shade500,
+ fontFamily: 'Nunito',
+ ),
+ ),
+);
+
+final ThemeData darkTheme = lightTheme.copyWith(
+ colorScheme: darkColorScheme,
+ textTheme: TextTheme(
+ displayLarge: TextStyle(
+ color: textSwatch.shade200,
+ fontFamily: 'Nunito',
+ ),
+ displayMedium: TextStyle(
+ color: textSwatch.shade300,
+ fontFamily: 'Nunito',
+ ),
+ displaySmall: TextStyle(
+ color: textSwatch.shade400,
+ fontFamily: 'Nunito',
+ ),
+ headlineLarge: TextStyle(
+ color: textSwatch.shade200,
+ fontFamily: 'Nunito',
+ ),
+ headlineMedium: TextStyle(
+ color: textSwatch.shade300,
+ fontFamily: 'Nunito',
+ ),
+ headlineSmall: TextStyle(
+ color: textSwatch.shade400,
+ fontFamily: 'Nunito',
+ ),
+ titleLarge: TextStyle(
+ color: textSwatch.shade200,
+ fontFamily: 'Nunito',
+ ),
+ titleMedium: TextStyle(
+ color: textSwatch.shade300,
+ fontFamily: 'Nunito',
+ ),
+ titleSmall: TextStyle(
+ color: textSwatch.shade400,
+ fontFamily: 'Nunito',
+ ),
+ bodyLarge: TextStyle(
+ color: textSwatch.shade200,
+ fontFamily: 'Nunito',
+ ),
+ bodyMedium: TextStyle(
+ color: textSwatch.shade300,
+ fontFamily: 'Nunito',
+ ),
+ bodySmall: TextStyle(
+ color: textSwatch.shade400,
+ fontFamily: 'Nunito',
+ ),
+ labelLarge: TextStyle(
+ color: textSwatch.shade200,
+ fontFamily: 'Nunito',
+ ),
+ labelMedium: TextStyle(
+ color: textSwatch.shade300,
+ fontFamily: 'Nunito',
+ ),
+ labelSmall: TextStyle(
+ color: textSwatch.shade400,
+ fontFamily: 'Nunito',
+ ),
+ ),
+);
+
+final ThemeData appTheme = darkTheme;
diff --git a/lib/main.dart b/lib/main.dart
index 0add32855ed05690b9510934e5a108a96884e1ce..82c70b7bb1ce8367ffa13601eb0b132d0f5acfe9 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -1,9 +1,10 @@
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
+import 'package:random/ui/screens/skeleton_screen.dart';
+import 'package:random/config/theme.dart';
import 'package:random/activities/ActivityDemoPage.dart';
import 'package:random/activities/ActivityGraphPage.dart';
-import 'package:random/screens/home.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
@@ -30,10 +31,8 @@ class MyApp extends StatelessWidget {
Widget build(BuildContext context) {
return MaterialApp(
title: 'Random application',
- theme: ThemeData(
- primarySwatch: Colors.blue,
- ),
- home: Home(),
+ theme: appTheme,
+ home: SkeletonScreen(),
onGenerateRoute: (settings) {
switch (settings.name) {
case ActivityDemoPage.route:
diff --git a/lib/screens/home.dart b/lib/ui/screens/skeleton_screen.dart
similarity index 86%
rename from lib/screens/home.dart
rename to lib/ui/screens/skeleton_screen.dart
index a263e343ad49c159b4e4f7717e28ef5df1cc0f23..cd13b088efda89f5714ca58c0fe3c7296fb5b1af 100644
--- a/lib/screens/home.dart
+++ b/lib/ui/screens/skeleton_screen.dart
@@ -3,10 +3,9 @@ import 'package:flutter/material.dart';
import 'package:random/activities/ActivityDemoPage.dart';
import 'package:random/activities/ActivityGraphPage.dart';
-class Home extends StatelessWidget {
+class SkeletonScreen extends StatelessWidget {
static const String id = 'home';
- @override
Widget build(BuildContext context) {
double screenWidth = MediaQuery.of(context).size.width;
@@ -20,7 +19,7 @@ class Home extends StatelessWidget {
child: TextButton(
style: TextButton.styleFrom(
padding: EdgeInsets.all(4),
- backgroundColor: Colors.lightBlue,
+ backgroundColor: Theme.of(context).colorScheme.background,
),
child: Image(
image: AssetImage(imageAsset),
@@ -39,7 +38,8 @@ class Home extends StatelessWidget {
}
return Scaffold(
- backgroundColor: Colors.blue,
+ extendBodyBehindAppBar: true,
+ backgroundColor: Theme.of(context).colorScheme.background,
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
diff --git a/pubspec.yaml b/pubspec.yaml
index 1385047fef4349e1c102eb1e6250868059a58625..ed763febaf57b50e3d0117444bb53b007e89ee8b 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -3,7 +3,7 @@ description: A random application, for testing purpose only.
publish_to: 'none'
-version: 1.0.21+22
+version: 1.0.22+23
environment:
sdk: '^3.0.0'
@@ -19,3 +19,15 @@ flutter:
assets:
- assets/menu/
- assets/translations/
+
+ fonts:
+ - family: Nunito
+ fonts:
+ - asset: assets/fonts/Nunito-Bold.ttf
+ weight: 700
+ - asset: assets/fonts/Nunito-Medium.ttf
+ weight: 500
+ - asset: assets/fonts/Nunito-Regular.ttf
+ weight: 400
+ - asset: assets/fonts/Nunito-Light.ttf
+ weight: 300