Skip to content

Commit

Permalink
all style and and color
Browse files Browse the repository at this point in the history
  • Loading branch information
KOSSHOH committed Jan 15, 2021
1 parent 0f50ade commit c3868e3
Showing 8 changed files with 364 additions and 35 deletions.
1 change: 1 addition & 0 deletions android/gradle.properties
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
org.gradle.jvmargs=-Xmx1536M
android.useAndroidX=true
android.enableJetifier=true
android.enableR8=true
Binary file added assets/fonts/NunitoSans-Bold.ttf
Binary file not shown.
Binary file added assets/fonts/NunitoSans-Regular.ttf
Binary file not shown.
Binary file added assets/fonts/NunitoSans-SemiBold.ttf
Binary file not shown.
39 changes: 34 additions & 5 deletions lib/main.dart
Original file line number Diff line number Diff line change
@@ -1,18 +1,47 @@
import 'dart:io';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:messenger/src/app_theme.dart';
import 'package:messenger/src/ui/onboarding.dart';

void main() {
runApp(MyApp());
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await SystemChrome.setPreferredOrientations(
<DeviceOrientation>[
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
],
).then(
(_) => runApp(MyApp()),
);
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(
statusBarColor: Colors.transparent,
statusBarIconBrightness: Brightness.dark,
statusBarBrightness:
Platform.isAndroid ? Brightness.dark : Brightness.light,
systemNavigationBarColor: Colors.white,
systemNavigationBarDividerColor: Colors.grey.withOpacity(0.1),
systemNavigationBarIconBrightness: Brightness.dark,
),
);

return MaterialApp(
title: 'Flutter Demo',
debugShowCheckedModeBanner: false,
title: 'Messenger',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
accentColor: Color(0xFF327FEB),
canvasColor: Colors.transparent,
textTheme: AppTheme.textTheme,
platform: TargetPlatform.iOS,
),
home: OnBoarding(),
);
}
}
293 changes: 293 additions & 0 deletions lib/src/app_theme.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,293 @@
import 'package:flutter/material.dart';

class AppTheme {
AppTheme._();

///default
static const Color darkText = Color(0xFF253840);
static const Color darkerText = Color(0xFF17262A);
static const Color lightText = Color(0xFF4A6572);

///app
static const Color primary = Color(0xFF327FEB);
static const Color dark = Color(0xFF383838);
static const Color black80 = Color.fromRGBO(56, 56, 56, 0.8);
static const Color black30 = Color.fromRGBO(56, 56, 56, 0.6);
static const Color black10 = Color.fromRGBO(56, 56, 56, 0.4);
static const Color grey = Color(0xFFA9A9A9);
static const Color grey80 = Color.fromRGBO(169, 169, 169, 0.8);
static const Color grey30 = Color.fromRGBO(169, 169, 169, 0.6);
static const Color grey10 = Color.fromRGBO(169, 169, 169, 0.4);
static const Color success = Color(0xFF0AB97A);
static const Color error = Color(0xFFF31629);
static const Color white = Color(0xFFFFFFFF);
static const Color white80 = Color.fromRGBO(255, 255, 255, 0.8);
static const Color white30 = Color.fromRGBO(255, 255, 255, 0.6);
static const Color screen = Color(0xFFFAFAFA);

///fonts
static const String fontNunitoSans = 'NunitoSans';

/// Text Style
static TextStyle boldOverline(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 14,
letterSpacing: 0.14,
height: 1.35,
color: color,
);
}

static TextStyle boldH2(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 24,
height: 1.375,
color: color,
);
}

static TextStyle regularLabel(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.normal,
fontSize: 16,
height: 1.62,
color: color,
);
}

static TextStyle boldButton(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 18,
height: 1.38,
color: color,
);
}

static TextStyle boldH3(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 20,
height: 1.65,
color: color,
);
}

static TextStyle regularH3(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.w600,
fontSize: 20,
height: 1.35,
color: color,
);
}

static TextStyle regularDisplay(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.normal,
fontSize: 17,
height: 1.79,
color: color,
);
}

static TextStyle semiBoldLabel(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.w600,
fontSize: 16,
height: 1.69,
color: color,
);
}

static TextStyle semiBoldDisplay(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.w600,
fontSize: 16,
height: 1.56,
color: color,
);
}

static TextStyle boldH4(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 18,
height: 1.38,
color: color,
);
}

static TextStyle boldH1(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 28,
height: 1.35,
color: color,
);
}

static TextStyle regularBody(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.normal,
fontSize: 13,
height: 1.85,
color: color,
);
}

static TextStyle boldDisplay(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 16,
height: 1.56,
color: color,
);
}

static TextStyle regularContent(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.normal,
fontSize: 14,
height: 1.71,
color: color,
);
}

static TextStyle semiBoldContent(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.w600,
fontSize: 14,
height: 1.71,
color: color,
);
}

static TextStyle boldLabel(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 16,
height: 1.62,
color: color,
);
}

static TextStyle boldContent(Color color) {
return TextStyle(
fontFamily: fontNunitoSans,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 14,
height: 1.71,
color: color,
);
}

static const TextTheme textTheme = TextTheme(
headline4: display1,
headline5: headline,
headline6: title,
subtitle2: subtitle,
bodyText2: body2,
bodyText1: body1,
caption: caption,
);

static const TextStyle display1 = TextStyle(
// h4 -> display1
fontFamily: fontNunitoSans,
fontWeight: FontWeight.bold,
fontSize: 36,
letterSpacing: 0.4,
height: 0.9,
color: darkerText,
);

static const TextStyle headline = TextStyle(
// h5 -> headline
fontFamily: fontNunitoSans,
fontWeight: FontWeight.bold,
fontSize: 24,
letterSpacing: 0.27,
color: darkerText,
);

static const TextStyle title = TextStyle(
// h6 -> title
fontFamily: fontNunitoSans,
fontWeight: FontWeight.bold,
fontSize: 16,
letterSpacing: 0.18,
color: darkerText,
);

static const TextStyle subtitle = TextStyle(
// subtitle2 -> subtitle
fontFamily: fontNunitoSans,
fontWeight: FontWeight.w400,
fontSize: 14,
letterSpacing: -0.04,
color: darkText,
);

static const TextStyle body2 = TextStyle(
// body1 -> body2
fontFamily: fontNunitoSans,
fontWeight: FontWeight.w400,
fontSize: 14,
letterSpacing: 0.2,
color: darkText,
);

static const TextStyle body1 = TextStyle(
// body2 -> body1
fontFamily: fontNunitoSans,
fontWeight: FontWeight.w400,
fontSize: 16,
letterSpacing: -0.05,
color: darkText,
);

static const TextStyle caption = TextStyle(
// Caption -> caption
fontFamily: fontNunitoSans,
fontWeight: FontWeight.w400,
fontSize: 12,
letterSpacing: 0.2,
color: lightText, // was lightText
);
}
23 changes: 23 additions & 0 deletions lib/src/ui/onboarding.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:messenger/src/app_theme.dart';

class OnBoarding extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _OnBoardingState();
}
}

class _OnBoardingState extends State<OnBoarding> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppTheme.white,
body: Text(
"ssfsfd ff ",
style: AppTheme.boldOverline(AppTheme.black80),
),
);
}
}
Loading

0 comments on commit c3868e3

Please sign in to comment.