diff --git a/demo_app/lib/assets/icons/avatar.png b/demo_app/lib/assets/icons/avatar.png
new file mode 100644
index 00000000..685ad1a3
Binary files /dev/null and b/demo_app/lib/assets/icons/avatar.png differ
diff --git a/demo_app/lib/assets/icons/back.png b/demo_app/lib/assets/icons/back.png
new file mode 100644
index 00000000..6c90e89b
Binary files /dev/null and b/demo_app/lib/assets/icons/back.png differ
diff --git a/demo_app/lib/assets/icons/badge.png b/demo_app/lib/assets/icons/badge.png
new file mode 100644
index 00000000..5d233517
Binary files /dev/null and b/demo_app/lib/assets/icons/badge.png differ
diff --git a/demo_app/lib/assets/icons/buttons.png b/demo_app/lib/assets/icons/buttons.png
new file mode 100644
index 00000000..d7cf8870
Binary files /dev/null and b/demo_app/lib/assets/icons/buttons.png differ
diff --git a/demo_app/lib/assets/icons/buttons.svg b/demo_app/lib/assets/icons/buttons.svg
new file mode 100644
index 00000000..415c67d3
--- /dev/null
+++ b/demo_app/lib/assets/icons/buttons.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/demo_app/lib/assets/icons/card.png b/demo_app/lib/assets/icons/card.png
new file mode 100644
index 00000000..79543ea6
Binary files /dev/null and b/demo_app/lib/assets/icons/card.png differ
diff --git a/demo_app/lib/assets/icons/chips.png b/demo_app/lib/assets/icons/chips.png
new file mode 100644
index 00000000..99b08372
Binary files /dev/null and b/demo_app/lib/assets/icons/chips.png differ
diff --git a/demo_app/lib/assets/icons/danger.svg b/demo_app/lib/assets/icons/danger.svg
new file mode 100644
index 00000000..dea91e14
--- /dev/null
+++ b/demo_app/lib/assets/icons/danger.svg
@@ -0,0 +1,12 @@
+
diff --git a/demo_app/lib/assets/icons/dark.svg b/demo_app/lib/assets/icons/dark.svg
new file mode 100644
index 00000000..a5e5eb1b
--- /dev/null
+++ b/demo_app/lib/assets/icons/dark.svg
@@ -0,0 +1,11 @@
+
diff --git a/demo_app/lib/assets/icons/dribble.svg b/demo_app/lib/assets/icons/dribble.svg
new file mode 100644
index 00000000..dbaca3b1
--- /dev/null
+++ b/demo_app/lib/assets/icons/dribble.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/fb.svg b/demo_app/lib/assets/icons/fb.svg
new file mode 100644
index 00000000..e6078c98
--- /dev/null
+++ b/demo_app/lib/assets/icons/fb.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/google.svg b/demo_app/lib/assets/icons/google.svg
new file mode 100644
index 00000000..d837859e
--- /dev/null
+++ b/demo_app/lib/assets/icons/google.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/images.png b/demo_app/lib/assets/icons/images.png
new file mode 100644
index 00000000..b5e4cb02
Binary files /dev/null and b/demo_app/lib/assets/icons/images.png differ
diff --git a/demo_app/lib/assets/icons/info.svg b/demo_app/lib/assets/icons/info.svg
new file mode 100644
index 00000000..21fd193c
--- /dev/null
+++ b/demo_app/lib/assets/icons/info.svg
@@ -0,0 +1,12 @@
+
diff --git a/demo_app/lib/assets/icons/items.png b/demo_app/lib/assets/icons/items.png
new file mode 100644
index 00000000..1a495321
Binary files /dev/null and b/demo_app/lib/assets/icons/items.png differ
diff --git a/demo_app/lib/assets/icons/light.svg b/demo_app/lib/assets/icons/light.svg
new file mode 100644
index 00000000..bf6f73a6
--- /dev/null
+++ b/demo_app/lib/assets/icons/light.svg
@@ -0,0 +1,11 @@
+
diff --git a/demo_app/lib/assets/icons/link.svg b/demo_app/lib/assets/icons/link.svg
new file mode 100644
index 00000000..9260d523
--- /dev/null
+++ b/demo_app/lib/assets/icons/link.svg
@@ -0,0 +1,17 @@
+
diff --git a/demo_app/lib/assets/icons/linkedin.svg b/demo_app/lib/assets/icons/linkedin.svg
new file mode 100644
index 00000000..7adb1746
--- /dev/null
+++ b/demo_app/lib/assets/icons/linkedin.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/lists.png b/demo_app/lib/assets/icons/lists.png
new file mode 100644
index 00000000..e3e93174
Binary files /dev/null and b/demo_app/lib/assets/icons/lists.png differ
diff --git a/demo_app/lib/assets/icons/menu.png b/demo_app/lib/assets/icons/menu.png
new file mode 100644
index 00000000..0932d5f5
Binary files /dev/null and b/demo_app/lib/assets/icons/menu.png differ
diff --git a/demo_app/lib/assets/icons/next.png b/demo_app/lib/assets/icons/next.png
new file mode 100644
index 00000000..8d3c89d9
Binary files /dev/null and b/demo_app/lib/assets/icons/next.png differ
diff --git a/demo_app/lib/assets/icons/pinterest.svg b/demo_app/lib/assets/icons/pinterest.svg
new file mode 100644
index 00000000..7aa538e1
--- /dev/null
+++ b/demo_app/lib/assets/icons/pinterest.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/primary.svg b/demo_app/lib/assets/icons/primary.svg
new file mode 100644
index 00000000..c2ad37e4
--- /dev/null
+++ b/demo_app/lib/assets/icons/primary.svg
@@ -0,0 +1,19 @@
+
diff --git a/demo_app/lib/assets/icons/secondary.svg b/demo_app/lib/assets/icons/secondary.svg
new file mode 100644
index 00000000..56c06ebe
--- /dev/null
+++ b/demo_app/lib/assets/icons/secondary.svg
@@ -0,0 +1,17 @@
+
diff --git a/demo_app/lib/assets/icons/slack.svg b/demo_app/lib/assets/icons/slack.svg
new file mode 100644
index 00000000..ed08c2a0
--- /dev/null
+++ b/demo_app/lib/assets/icons/slack.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/slider.png b/demo_app/lib/assets/icons/slider.png
new file mode 100644
index 00000000..03fb809b
Binary files /dev/null and b/demo_app/lib/assets/icons/slider.png differ
diff --git a/demo_app/lib/assets/icons/success.svg b/demo_app/lib/assets/icons/success.svg
new file mode 100644
index 00000000..b06b4ae5
--- /dev/null
+++ b/demo_app/lib/assets/icons/success.svg
@@ -0,0 +1,11 @@
+
diff --git a/demo_app/lib/assets/icons/tabs.png b/demo_app/lib/assets/icons/tabs.png
new file mode 100644
index 00000000..49678a20
Binary files /dev/null and b/demo_app/lib/assets/icons/tabs.png differ
diff --git a/demo_app/lib/assets/icons/toast.png b/demo_app/lib/assets/icons/toast.png
new file mode 100644
index 00000000..44ee2d77
Binary files /dev/null and b/demo_app/lib/assets/icons/toast.png differ
diff --git a/demo_app/lib/assets/icons/toggle.png b/demo_app/lib/assets/icons/toggle.png
new file mode 100644
index 00000000..f33816f9
Binary files /dev/null and b/demo_app/lib/assets/icons/toggle.png differ
diff --git a/demo_app/lib/assets/icons/twitter.svg b/demo_app/lib/assets/icons/twitter.svg
new file mode 100644
index 00000000..ac962749
--- /dev/null
+++ b/demo_app/lib/assets/icons/twitter.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/typo.png b/demo_app/lib/assets/icons/typo.png
new file mode 100644
index 00000000..90592362
Binary files /dev/null and b/demo_app/lib/assets/icons/typo.png differ
diff --git a/demo_app/lib/assets/icons/warning.svg b/demo_app/lib/assets/icons/warning.svg
new file mode 100644
index 00000000..aae2b731
--- /dev/null
+++ b/demo_app/lib/assets/icons/warning.svg
@@ -0,0 +1,10 @@
+
diff --git a/demo_app/lib/assets/icons/whatsapp.svg b/demo_app/lib/assets/icons/whatsapp.svg
new file mode 100644
index 00000000..992ff345
--- /dev/null
+++ b/demo_app/lib/assets/icons/whatsapp.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/icons/youtube.svg b/demo_app/lib/assets/icons/youtube.svg
new file mode 100644
index 00000000..b2503883
--- /dev/null
+++ b/demo_app/lib/assets/icons/youtube.svg
@@ -0,0 +1,6 @@
+
diff --git a/demo_app/lib/assets/logo/logo.png b/demo_app/lib/assets/logo/logo.png
new file mode 100644
index 00000000..27e5cae0
Binary files /dev/null and b/demo_app/lib/assets/logo/logo.png differ
diff --git a/demo_app/lib/screens/badges/badges.dart b/demo_app/lib/screens/badges/badges.dart
new file mode 100644
index 00000000..34ff7a15
--- /dev/null
+++ b/demo_app/lib/screens/badges/badges.dart
@@ -0,0 +1,295 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:ui_kit/colors/gf_color.dart';
+import 'package:ui_kit/components/badge/gf_badge.dart';
+import 'package:ui_kit/components/badge/gf_button_badge.dart';
+import 'package:ui_kit/components/badge/gf_icon_badge.dart';
+import 'package:ui_kit/components/card/gf_card.dart';
+import 'package:ui_kit/components/typography/gf_typography.dart';
+import 'package:ui_kit/components/tabs/gf_tabs.dart';
+import 'package:ui_kit/components/button/gf_icon_button.dart';
+import 'package:ui_kit/position/gf_position.dart';
+import 'package:ui_kit/shape/gf_badge_shape.dart';
+import 'package:ui_kit/shape/gf_button_shape.dart';
+import 'package:ui_kit/size/gf_size.dart';
+import 'package:ui_kit/types/gf_typography_type.dart';
+import 'package:ui_kit/types/gf_type.dart';
+import 'package:ui_kit/components/tabs/gf_tabBarView.dart';
+
+class Badges extends StatefulWidget {
+ @override
+ _BadgesState createState() => _BadgesState();
+}
+
+class _BadgesState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ title: Text(
+ 'Badges',
+ style: TextStyle(fontSize: 17),
+ ),
+ centerTitle: true,
+ ),
+ body: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'With Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Primary',
+ ),
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Second',
+ color: GFColor.secondary,
+ ),
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Success',
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Warning',
+ color: GFColor.warning,
+ ),
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Danger',
+ color: GFColor.danger,
+ ),
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Info',
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Light',
+ color: GFColor.light,
+ ),
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Dark',
+ textStyle: TextStyle(color: getGFColor(GFColor.white)),
+ color: GFColor.dark,
+ ),
+ GFButtonBadge(
+ icon: GFBadge(
+ text: '6',
+ shape: GFBadgeShape.pills,
+ ),
+ onPressed: () {},
+ text: 'Link',
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Icon with Badges',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ children: [
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ children: [
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/primary.svg',
+ color: getGFColor(GFColor.primary),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.circle,
+ size: GFSize.small,
+ )),
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg',
+ color: getGFColor(GFColor.secondary),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.circle,
+ size: GFSize.small,
+ )),
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/success.svg',
+ color: getGFColor(GFColor.success),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.circle,
+ size: GFSize.small,
+ )),
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/warning.svg',
+ color: getGFColor(GFColor.warning),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.circle,
+ size: GFSize.small,
+ )),
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/danger.svg',
+ color: getGFColor(GFColor.danger),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.circle,
+ size: GFSize.small,
+ )),
+ ],
+ ),
+ Row(
+ children: [
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/info.svg',
+ color: getGFColor(GFColor.info),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.standard,
+ size: GFSize.small,
+ )),
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/light.svg',
+ color: getGFColor(GFColor.light),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.square,
+ size: GFSize.small,
+ )),
+ GFIconBadge(
+ child: GFIconButton(
+ type: GFType.transparent,
+ onPressed: () {},
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/dark.svg',
+ color: getGFColor(GFColor.dark),
+ )),
+ counterChild: GFBadge(
+ text: '12',
+ shape: GFBadgeShape.pills,
+ size: GFSize.small,
+ )),
+ ],
+ )
+ ],
+ ),
+ ),
+ ],
+ ),
+ );
+ }
+}
diff --git a/demo_app/lib/screens/button/button-types.dart b/demo_app/lib/screens/button/button-types.dart
new file mode 100644
index 00000000..a9ffb0bb
--- /dev/null
+++ b/demo_app/lib/screens/button/button-types.dart
@@ -0,0 +1,237 @@
+import 'package:demo_app/screens/avatars.dart';
+import 'package:demo_app/screens/button/shadow-buttons.dart';
+import 'package:ui_kit/components/avatar/gf_avatar.dart';
+
+import 'standard-buttons.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:ui_kit/colors/gf_color.dart';
+import 'package:ui_kit/components/card/gf_card.dart';
+import 'package:ui_kit/components/list_tile/gf_list_tile.dart';
+import 'pill-buttons.dart';
+import 'square-buttons.dart';
+import 'icon-buttons.dart';
+import 'social-buttons.dart';
+
+class ButtonTypes extends StatefulWidget {
+ @override
+ _ButtonTypesState createState() => _ButtonTypesState();
+}
+
+class _ButtonTypesState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ leading: GestureDetector(
+ onTap: (){
+ Navigator.pop(context);
+ },
+ child:Image.asset('lib/assets/icons/back.png')
+ ),
+ title: Text('Buttons', style: TextStyle(fontSize: 17),),
+ centerTitle: true,
+ ),
+
+ body: ListView(
+ children: [
+ SizedBox(
+ height: 20,
+ ),
+ GestureDetector(
+ onTap: (){
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => StandardButtons()
+ ),
+ );
+ },
+ child:Container(
+ margin: EdgeInsets.only(left: 15, right: 15, top: 20),
+ padding: EdgeInsets.all(5),
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ color: getGFColor(GFColor.dark),
+ boxShadow: [
+ BoxShadow(
+ color: Colors.black.withOpacity(0.40),
+ blurRadius: 5.0
+ )
+ ]
+ ),
+ child: GFListTile(
+ color: getGFColor(GFColor.dark),
+ showDivider: false,
+ title: Text('Standard Buttons', style: TextStyle(color: getGFColor(GFColor.white)),),
+ icon: Image.asset('lib/assets/icons/next.png'),
+
+ ),
+ )
+ ),
+
+ GestureDetector(
+ onTap: (){
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => PillsButtons()
+ ),
+ );
+ },
+ child:Container(
+ margin: EdgeInsets.only(left: 15, right: 15, top: 20),
+ padding: EdgeInsets.all(5),
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ color: getGFColor(GFColor.dark),
+ boxShadow: [
+ BoxShadow(
+ color: Colors.black.withOpacity(0.40),
+ blurRadius: 5.0
+ )
+ ]
+ ),
+ child: GFListTile(
+ color: getGFColor(GFColor.dark),
+ showDivider: false,
+ title: Text('Pills Buttons', style: TextStyle(color: getGFColor(GFColor.white)),),
+ icon: Image.asset('lib/assets/icons/next.png')
+ ),
+ )
+ ),
+
+
+ GestureDetector(
+ onTap: (){
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => SquareButtons()
+ ),
+ );
+ },
+ child:Container(
+ margin: EdgeInsets.only(left: 15, right: 15, top: 20),
+ padding: EdgeInsets.all(5),
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ color: getGFColor(GFColor.dark),
+ boxShadow: [
+ BoxShadow(
+ color: Colors.black.withOpacity(0.40),
+ blurRadius: 5.0
+ )
+ ]
+ ),
+ child: GFListTile(
+ color: getGFColor(GFColor.dark),
+ showDivider: false,
+ title: Text('Square Buttons', style: TextStyle(color: getGFColor(GFColor.white)),),
+ icon: Image.asset('lib/assets/icons/next.png')
+ ),
+ )
+ ),
+
+ GestureDetector(
+ onTap: (){
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => ShadowButtons()
+ ),
+ );
+ },
+ child:Container(
+ margin: EdgeInsets.only(left: 15, right: 15, top: 20),
+ padding: EdgeInsets.all(5),
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ color: getGFColor(GFColor.dark),
+ boxShadow: [
+ BoxShadow(
+ color: Colors.black.withOpacity(0.40),
+ blurRadius: 5.0
+ )
+ ]
+ ),
+ child: GFListTile(
+ color: getGFColor(GFColor.dark),
+ showDivider: false,
+ title: Text('Shadow Buttons', style: TextStyle(color: getGFColor(GFColor.white)),),
+ icon: Image.asset('lib/assets/icons/next.png')
+ ),
+ )
+ ),
+
+ GestureDetector(
+ onTap: (){
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => IconButtons()
+ ),
+ );
+ },
+ child:Container(
+ margin: EdgeInsets.only(left: 15, right: 15, top: 20),
+ padding: EdgeInsets.all(5),
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ color: getGFColor(GFColor.dark),
+ boxShadow: [
+ BoxShadow(
+ color: Colors.black.withOpacity(0.40),
+ blurRadius: 5.0
+ )
+ ]
+ ),
+ child: GFListTile(
+ color: getGFColor(GFColor.dark),
+ showDivider: false,
+ title: Text('Icons Buttons', style: TextStyle(color: getGFColor(GFColor.white)),),
+ icon: Image.asset('lib/assets/icons/next.png')
+ ),
+ )
+ ),
+
+ GestureDetector(
+ onTap: (){
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => SocialButtons()
+ ),
+ );
+ },
+ child:Container(
+
+ margin: EdgeInsets.only(left: 15, right: 15, top: 20, bottom: 20),
+ padding: EdgeInsets.all(5),
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ color: getGFColor(GFColor.dark),
+ boxShadow: [
+ BoxShadow(
+ color: Colors.black.withOpacity(0.40),
+ blurRadius: 5.0
+ )
+ ]
+ ),
+ child: GFListTile(
+ color: getGFColor(GFColor.dark),
+ showDivider: false,
+ title: Text('Social Buttons', style: TextStyle(color: getGFColor(GFColor.white)),),
+ icon: Image.asset('lib/assets/icons/next.png')
+ ),
+ )
+ ),
+
+
+ ],
+ )
+
+ );
+ }
+}
diff --git a/demo_app/lib/screens/button/icon-buttons.dart b/demo_app/lib/screens/button/icon-buttons.dart
new file mode 100644
index 00000000..80309f0b
--- /dev/null
+++ b/demo_app/lib/screens/button/icon-buttons.dart
@@ -0,0 +1,1185 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/colors/gf_color.dart';
+import 'package:ui_kit/components/button/gf_button.dart';
+import 'package:ui_kit/components/button/gf_icon_button.dart';
+import 'package:ui_kit/components/card/gf_card.dart';
+import 'package:ui_kit/components/typography/gf_typography.dart';
+import 'package:ui_kit/types/gf_typography_type.dart';
+import 'package:ui_kit/shape/gf_button_shape.dart';
+import 'package:ui_kit/types/gf_type.dart';
+import 'package:ui_kit/size/gf_size.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+
+class IconButtons extends StatefulWidget {
+ @override
+ _IconButtonsState createState() => _IconButtonsState();
+}
+
+class _IconButtonsState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ leading: GestureDetector(
+ onTap: () {
+ Navigator.pop(context);
+ },
+ child: Image.asset('lib/assets/icons/back.png')),
+ title: Text(
+ 'Icon Buttons',
+ style: TextStyle(fontSize: 17),
+ ),
+ centerTitle: true,
+ ),
+ body: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Solid Icons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+//
+// GFCard(
+// content: Column(
+// children: [
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+//// GFIconButton(
+//// onPressed: (){},
+//// icon: Icon(Icons.ac_unit),
+////// iconSize: 12.0,
+//// type: GFType.solid,
+//// shape: GFButtonShape.pills,
+//// size: GFSize.large,
+////// buttonBoxShadow: true,
+////// color: GFColor.primary,
+////// boxShadow: BoxShadow(
+////// color: Colors.pink,
+////// blurRadius: 2.0,
+////// spreadRadius: 1.0,
+////// offset: Offset.zero,
+////// ),
+////// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid),
+////// borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero),
+//// ),
+//
+//
+// ],
+// ),
+// ],
+// )
+// )
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text(
+ "Primary",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/primary.svg')),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text("Second"),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg'),
+ color: GFColor.secondary,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ icon:
+ SvgPicture.asset('lib/assets/icons/success.svg'),
+ color: GFColor.success,
+ ),
+ )
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/warning.svg'),
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/danger.svg'),
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/info.svg'),
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/light.svg'),
+ type: GFType.solid,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ style: TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/dark.svg'),
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/link.svg'),
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Outline Icons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ type: GFType.outline,
+ child: Text(
+ "Primary",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/primary.svg',
+ color: getGFColor(GFColor.primary),
+ )),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text("Second"),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg',
+ color: getGFColor(GFColor.secondary),
+ ),
+ color: GFColor.secondary,
+ type: GFType.outline,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/success.svg',
+ color: getGFColor(GFColor.success),
+ ),
+ color: GFColor.success,
+ type: GFType.outline,
+ ),
+ )
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/warning.svg',
+ color: getGFColor(GFColor.warning),
+ ),
+ color: GFColor.warning,
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/danger.svg',
+ color: getGFColor(GFColor.danger),
+ ),
+ color: GFColor.danger,
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/info.svg',
+ color: getGFColor(GFColor.info),
+ ),
+ color: GFColor.info,
+ type: GFType.outline,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/light.svg',
+ color: getGFColor(GFColor.light),
+ ),
+ type: GFType.outline,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/dark.svg',
+ color: getGFColor(GFColor.dark),
+ ),
+ color: GFColor.dark,
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/link.svg',
+ color: getGFColor(GFColor.alt),
+ ),
+ color: GFColor.transparent,
+ type: GFType.outline,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Outline 2x Icons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ type: GFType.outline2x,
+ child: Text(
+ "Primary",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/primary.svg',
+ color: getGFColor(GFColor.primary),
+ )),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text("Second"),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg',
+ color: getGFColor(GFColor.secondary),
+ ),
+ color: GFColor.secondary,
+ type: GFType.outline2x,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/success.svg',
+ color: getGFColor(GFColor.success),
+ ),
+ color: GFColor.success,
+ type: GFType.outline2x,
+ ),
+ )
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/warning.svg',
+ color: getGFColor(GFColor.warning),
+ ),
+ color: GFColor.warning,
+ type: GFType.outline2x,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/danger.svg',
+ color: getGFColor(GFColor.danger),
+ ),
+ color: GFColor.danger,
+ type: GFType.outline2x,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/info.svg',
+ color: getGFColor(GFColor.info),
+ ),
+ color: GFColor.info,
+ type: GFType.outline2x,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/light.svg',
+ color: getGFColor(GFColor.light),
+ ),
+ type: GFType.outline2x,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/dark.svg',
+ color: getGFColor(GFColor.dark),
+ ),
+ color: GFColor.dark,
+ type: GFType.outline2x,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/link.svg',
+ color: getGFColor(GFColor.alt),
+ ),
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Square Icons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Primary",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/primary.svg')),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text("Second"),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg'),
+ color: GFColor.secondary,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ shape: GFButtonShape.square,
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ icon:
+ SvgPicture.asset('lib/assets/icons/success.svg'),
+ color: GFColor.success,
+ ),
+ )
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Warning",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/warning.svg'),
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Danger",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/danger.svg'),
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Info",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/info.svg'),
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Light",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/light.svg'),
+ type: GFType.solid,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Dark",
+ style: TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/dark.svg'),
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Link",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/link.svg'),
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Pills Icons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Primary",
+ ),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/primary.svg')),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text("Second"),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg'),
+ color: GFColor.secondary,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ shape: GFButtonShape.pills,
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ icon:
+ SvgPicture.asset('lib/assets/icons/success.svg'),
+ color: GFColor.success,
+ ),
+ )
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Warning",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/warning.svg'),
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Danger",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/danger.svg'),
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Info",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/info.svg'),
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Light",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/light.svg'),
+ type: GFType.solid,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Dark",
+ style: TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/dark.svg'),
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Link",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/link.svg'),
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Shadow Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text(
+ "Primary",
+ ),
+ icon:
+ SvgPicture.asset('lib/assets/icons/primary.svg'),
+ buttonBoxShadow: true,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text("Second"),
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg'),
+ color: GFColor.secondary,
+ buttonBoxShadow: true,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ icon:
+ SvgPicture.asset('lib/assets/icons/success.svg'),
+ color: GFColor.success,
+ buttonBoxShadow: true,
+ ),
+ )
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/warning.svg'),
+ color: GFColor.warning,
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/danger.svg'),
+ color: GFColor.danger,
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/info.svg'),
+ color: GFColor.info,
+ buttonBoxShadow: true,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/light.svg'),
+ type: GFType.solid,
+ color: GFColor.light,
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ style: TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/dark.svg'),
+ color: GFColor.dark,
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/link.svg'),
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text("Large",
+ style: TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.large,
+ icon: SvgPicture.asset('lib/assets/icons/primary.svg'),
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Normal",
+ style: TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ icon:
+ SvgPicture.asset('lib/assets/icons/secondary.svg'),
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Small",
+ style: TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
+ icon: SvgPicture.asset('lib/assets/icons/info.svg'),
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Large",
+ ),
+ size: GFSize.large,
+ icon: SvgPicture.asset('lib/assets/icons/primary.svg'),
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Normal",
+ ),
+ size: GFSize.medium,
+ icon: SvgPicture.asset('lib/assets/icons/secondary.svg'),
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Small",
+ ),
+ size: GFSize.small,
+ icon: SvgPicture.asset('lib/assets/icons/success.svg'),
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Icons Only',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ icon:
+ SvgPicture.asset('lib/assets/icons/primary.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: GFColor.secondary,
+ icon: SvgPicture.asset(
+ 'lib/assets/icons/secondary.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: GFColor.success,
+ icon:
+ SvgPicture.asset('lib/assets/icons/success.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: GFColor.warning,
+ icon:
+ SvgPicture.asset('lib/assets/icons/warning.svg'),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ color: GFColor.danger,
+ icon: SvgPicture.asset('lib/assets/icons/danger.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: GFColor.info,
+ icon: SvgPicture.asset('lib/assets/icons/info.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: GFColor.light,
+ icon: SvgPicture.asset('lib/assets/icons/light.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: GFColor.dark,
+ icon: SvgPicture.asset('lib/assets/icons/dark.svg'),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ type: GFType.outline,
+ icon: Icon(Icons.settings),
+ onPressed: () {}),
+ GFIconButton(
+ type: GFType.outline,
+ color: GFColor.secondary,
+ icon: Icon(Icons.send),
+ onPressed: () {}),
+ GFIconButton(
+ type: GFType.outline,
+ color: GFColor.success,
+ icon: Icon(Icons.file_download),
+ onPressed: () {}),
+ GFIconButton(
+ type: GFType.outline,
+ color: GFColor.warning,
+ icon: Icon(Icons.warning),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ type: GFType.outline,
+ color: GFColor.danger,
+ icon: Icon(Icons.insert_drive_file),
+ onPressed: () {}),
+ GFIconButton(
+ type: GFType.outline,
+ color: GFColor.info,
+ icon: Icon(Icons.delete),
+ onPressed: () {}),
+ GFIconButton(
+ type: GFType.outline,
+ color: GFColor.light,
+ icon: Icon(Icons.info),
+ onPressed: () {}),
+ GFIconButton(
+ type: GFType.outline,
+ color: GFColor.dark,
+ icon: Icon(Icons.apps),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ));
+ }
+}
diff --git a/demo_app/lib/screens/button/pill-buttons.dart b/demo_app/lib/screens/button/pill-buttons.dart
new file mode 100644
index 00000000..b994ecba
--- /dev/null
+++ b/demo_app/lib/screens/button/pill-buttons.dart
@@ -0,0 +1,1189 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/components/typography/gf_typography.dart';
+import 'package:ui_kit/components/tabs/gf_tabs.dart';
+import 'package:ui_kit/components/button/gf_button.dart';
+import 'package:ui_kit/size/gf_size.dart';
+import 'package:ui_kit/types/gf_typography_type.dart';
+import 'package:ui_kit/types/gf_type.dart';
+import 'package:ui_kit/shape/gf_button_shape.dart';
+import 'package:ui_kit/colors/gf_color.dart';
+import 'package:ui_kit/components/card/gf_card.dart';
+import 'package:ui_kit/components/tabs/gf_tabBarView.dart';
+
+class PillsButtons extends StatefulWidget {
+ @override
+ _PillsButtonsState createState() => _PillsButtonsState();
+}
+
+class _PillsButtonsState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ leading: GestureDetector(
+ onTap: () {
+ Navigator.pop(context);
+ },
+ child: Image.asset('lib/assets/icons/back.png')),
+ title: Text(
+ 'Pills Buttons',
+ style: TextStyle(fontSize: 17),
+ ),
+ centerTitle: true,
+ ),
+ body: GFTabs(
+ height: MediaQuery.of(context).size.height,
+ tabBarColor: Color(0xFFD3E9ED),
+ initialIndex: 0,
+ length: 3,
+ indicatorColor: getGFColor(GFColor.info),
+ unselectedLabelColor: getGFColor(GFColor.danger),
+ labelColor: getGFColor(GFColor.warning),
+ tabs: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Solid",
+ style: TextStyle(fontSize: 12),
+ ),
+ type: GFType.solid,
+ textColor: GFColor.white,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Outline",
+ style: TextStyle(fontSize: 12),
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: null,
+ text: 'Outline 2x',
+ textStyle: TextStyle(fontSize: 12, color: getGFColor(GFColor.dark)),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ ],
+ tabBarView: GFTabBarView(
+ children: [
+ Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Primary",
+ ),
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Primary",
+ ),
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Success",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Warning",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Danger",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Info",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Light",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Dark",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ shape: GFButtonShape.pills,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text("Large",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.large,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Normal",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Small",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
+ shape: GFButtonShape.pills,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Large",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.large,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Normal",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Small",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+
+ //tab 2
+ Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline,
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline,
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+
+ //tab 3
+ Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ shape: GFButtonShape.pills,
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline2x,
+ shape: GFButtonShape.pills,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+ );
+ }
+}
diff --git a/demo_app/lib/screens/button/shadow-buttons.dart b/demo_app/lib/screens/button/shadow-buttons.dart
new file mode 100644
index 00000000..7724c422
--- /dev/null
+++ b/demo_app/lib/screens/button/shadow-buttons.dart
@@ -0,0 +1,1048 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/components/typography/gf_typography.dart';
+import 'package:ui_kit/components/tabs/gf_tabs.dart';
+import 'package:ui_kit/components/button/gf_button.dart';
+import 'package:ui_kit/size/gf_size.dart';
+import 'package:ui_kit/types/gf_typography_type.dart';
+import 'package:ui_kit/types/gf_type.dart';
+import 'package:ui_kit/shape/gf_button_shape.dart';
+import 'package:ui_kit/colors/gf_color.dart';
+import 'package:ui_kit/components/card/gf_card.dart';
+import 'package:ui_kit/components/tabs/gf_tabBarView.dart';
+
+class ShadowButtons extends StatefulWidget {
+ @override
+ _ShadowButtonsState createState() => _ShadowButtonsState();
+}
+
+class _ShadowButtonsState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ leading: GestureDetector(
+ onTap: () {
+ Navigator.pop(context);
+ },
+ child: Image.asset('lib/assets/icons/back.png')),
+ title: Text(
+ 'Shadow Buttons',
+ style: TextStyle(fontSize: 17),
+ ),
+ centerTitle: true,
+ ),
+// body: GFTabs(
+// height: MediaQuery.of(context).size.height,
+// tabBarColor: Color(0xFFD3E9ED),
+// initialIndex: 0,
+// length: 3,
+// indicatorColor: getGFColor(GFColor.info),
+// unselectedLabelColor: getGFColor(GFColor.danger),
+// labelColor: getGFColor(GFColor.warning),
+// tabs: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Solid",
+// style: TextStyle(fontSize: 12),
+// ),
+// buttonBoxShadow: true,
+// textColor: GFColor.white,
+// ),
+// GFButton(
+// onPressed: null,
+// child: Text(
+// "Outline",
+// style: TextStyle(fontSize: 12),
+// ),
+// type: GFType.outline,
+// ),
+// GFButton(
+// onPressed: null,
+// text: 'Outline 2x',
+// textStyle: TextStyle(fontSize: 12, color: getGFColor(GFColor.dark)),
+// type: GFType.outline2x,
+// ),
+// ],
+// tabBarView: GFTabBarView(
+// children: [
+// Container(
+//// color: Colors.red,
+// child: ListView(
+// children: [
+// Padding(padding: EdgeInsets.only(left:15, top:30),
+// child: GFTypography(
+// text: 'Default',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+//
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// shape: GFButtonShape.standard,
+//
+// buttonBoxShadow: true,
+// child: Text("Primary",
+// ),
+//
+// color: GFColor.primary,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Secondary",
+// ),
+//
+// color: GFColor.secondary,
+// buttonBoxShadow: true,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Success",
+// ),
+// buttonBoxShadow: true,
+// color: GFColor.success,
+// ),
+// ],
+// ),
+//
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Warning",
+// ),
+// buttonBoxShadow: true,
+// color: GFColor.warning,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Danger",
+// ),
+// buttonBoxShadow: true,
+// color: GFColor.danger,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Info",
+// ),
+// buttonBoxShadow: true,
+// color: GFColor.info,
+// ),
+// ],
+// ),
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Light",
+// ),
+// buttonBoxShadow: true,
+// color: GFColor.light,
+// ),
+//
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Dark",
+// style:
+// TextStyle(color: getGFColor(GFColor.white)),
+// ),
+// buttonBoxShadow: true,
+// color: GFColor.dark,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Link",
+// ),
+// buttonBoxShadow: false,
+// color: GFColor.transparent,
+// ),
+// ],
+// ),
+//SizedBox(
+// height: 10,
+//)
+//
+// ],
+// ),
+// ),
+//
+//
+//
+//
+// Padding(padding: EdgeInsets.only(left:15, top:10),
+// child: GFTypography(
+// text: 'Button Sizes',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+//
+//
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text("Large",
+// ),
+// color: GFColor.primary,
+// size: GFSize.large,
+// buttonBoxShadow: true,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Normal",
+// ),
+// color: GFColor.primary,
+// size: GFSize.medium,
+// buttonBoxShadow: true,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Small",
+// ),
+// color: GFColor.primary,
+// size: GFSize.small,
+// buttonBoxShadow: true,
+// ),
+// ],
+// ),
+// SizedBox(
+// height: 10,
+// ),
+//
+// ],
+// ),
+// ),
+//
+//
+// Padding(padding: EdgeInsets.only(left:15, top:10),
+// child: GFTypography(
+// text: 'Block Buttons',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+//
+//
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Large",
+// style: TextStyle(
+// color: getGFColor(GFColor.white))),
+// color: GFColor.primary,
+// size: GFSize.large,
+// buttonBoxShadow: true,
+// ),
+//
+// SizedBox(
+// height: 10,
+// ),
+//
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Normal",
+// style: TextStyle(
+// color: getGFColor(GFColor.white))),
+// color: GFColor.primary,
+// size: GFSize.medium,
+// buttonBoxShadow: true,
+// ),
+//
+// SizedBox(
+// height: 10,
+// ),
+//
+//
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Small",
+// style: TextStyle(
+// color: getGFColor(GFColor.white))),
+// color: GFColor.primary,
+// size: GFSize.small,
+// buttonBoxShadow: true,
+// ),
+// SizedBox(
+// height: 10,
+// ),
+//
+// ],
+// ),
+// ),
+// ],
+// ),
+// ),
+//
+//
+// //tab 2
+// Container(
+//// color: Colors.red,
+// child: ListView(
+// children: [
+//
+// Padding(padding: EdgeInsets.only(left:15, top:30),
+// child: GFTypography(
+// text: 'Default',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Primary",
+//
+// ),
+//
+// type: GFType.outline,
+//
+// ),
+//
+//
+// GFButton(
+// onPressed: (){},
+// child: Text("Secondary"),
+// type: GFType.outline,
+// color: GFColor.secondary,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Success",
+// ),
+// type: GFType.outline,
+// color: GFColor.success,
+// ),
+// ],
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Warning",
+// ),
+// type: GFType.outline,
+// color: GFColor.warning,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Danger",
+// ),
+// type: GFType.outline,
+// color: GFColor.danger,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Info",
+// ),
+// type: GFType.outline,
+// color: GFColor.info,
+// ),
+// ],
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Light",
+// ),
+// type: GFType.outline,
+// color: GFColor.light,
+// ),
+//
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Dark",
+// ),
+// type: GFType.outline,
+// color: GFColor.dark,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Link",
+// ),
+// color: GFColor.transparent,
+// ),
+// ],
+// ),
+// ],
+// ),
+// ),
+//
+//
+//
+// Padding(padding: EdgeInsets.only(left:15, top:10),
+// child: GFTypography(
+// text: 'Button Sizes',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+//
+//
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text("Large",
+// ),
+// color: GFColor.primary,
+// size: GFSize.large,
+// type: GFType.outline,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Normal",
+// ),
+// color: GFColor.primary,
+// size: GFSize.medium,
+// type: GFType.outline,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Small",
+// ),
+// color: GFColor.primary,
+// size: GFSize.small,
+// type: GFType.outline,
+// ),
+// ],
+// ),
+//
+// ],
+// ),
+// ),
+//
+//
+// Padding(padding: EdgeInsets.only(left:15, top:10),
+// child: GFTypography(
+// text: 'Block Buttons',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+//
+//
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Large",
+// ),
+// color: GFColor.primary,
+// size: GFSize.large,
+// type: GFType.outline,
+// ),
+//
+// SizedBox(
+// height: 10,
+// ),
+//
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Normal",
+// ),
+// color: GFColor.primary,
+// size: GFSize.medium,
+// type: GFType.outline,
+// ),
+//
+// SizedBox(
+// height: 10,
+// ),
+//
+//
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Small",
+// ),
+// color: GFColor.primary,
+// size: GFSize.small,
+// type: GFType.outline,
+// ),
+//
+// ],
+// ),
+// ),
+//
+// ],
+// ),
+// ),
+//
+//
+// //tab 3
+// Container(
+//// color: Colors.red,
+// child: ListView(
+// children: [
+//
+// Padding(padding: EdgeInsets.only(left:15, top:30),
+// child: GFTypography(
+// text: 'Default',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Primary",
+//
+// ),
+//
+// type: GFType.outline2x,
+//
+// ),
+//
+//
+// GFButton(
+// onPressed: (){},
+// child: Text("Secondary"),
+// type: GFType.outline2x,
+// color: GFColor.secondary,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Success",
+// ),
+// type: GFType.outline2x,
+// color: GFColor.success,
+// ),
+// ],
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Warning",
+// ),
+// type: GFType.outline2x,
+// color: GFColor.warning,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Danger",
+// ),
+// type: GFType.outline2x,
+// color: GFColor.danger,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Info",
+// ),
+// type: GFType.outline2x,
+// color: GFColor.info,
+// ),
+// ],
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Light",
+// ),
+// type: GFType.outline2x,
+// color: GFColor.light,
+// ),
+//
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Dark",
+// ),
+// type: GFType.outline2x,
+// color: GFColor.dark,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text(
+// "Link",
+// ),
+//
+// color: GFColor.transparent,
+// ),
+// ],
+// ),
+// ],
+// ),
+// ),
+//
+//
+//
+// Padding(padding: EdgeInsets.only(left:15, top:10),
+// child: GFTypography(
+// text: 'Button Sizes',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+//
+//
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// Row(
+// mainAxisAlignment: MainAxisAlignment.spaceBetween,
+// children: [
+// GFButton(
+// onPressed: (){},
+// child: Text("Large",
+// ),
+// color: GFColor.primary,
+// size: GFSize.large,
+// type: GFType.outline2x,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Normal",
+// ),
+// color: GFColor.primary,
+// size: GFSize.medium,
+// type: GFType.outline2x,
+// ),
+// GFButton(
+// onPressed: (){},
+// child: Text("Small",
+// ),
+// color: GFColor.primary,
+// size: GFSize.small,
+// type: GFType.outline2x,
+// ),
+// ],
+// ),
+//
+// ],
+// ),
+// ),
+//
+//
+// Padding(padding: EdgeInsets.only(left:15, top:10),
+// child: GFTypography(
+// text: 'Block Buttons',
+// type: GFTypographyType.typo5,
+// dividerWidth: 25,
+// dividerColor: Color(0xFF19CA4B),
+//
+// ),
+// ),
+//
+//
+// GFCard(
+// content: Column(
+// mainAxisAlignment: MainAxisAlignment.start,
+// crossAxisAlignment: CrossAxisAlignment.start,
+// children: [
+// SizedBox(
+// height: 10,
+// ),
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Large",
+// ),
+// color: GFColor.primary,
+// size: GFSize.large,
+// type: GFType.outline2x,
+// ),
+//
+// SizedBox(
+// height: 10,
+// ),
+//
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Normal",
+// ),
+// color: GFColor.primary,
+// size: GFSize.medium,
+// type: GFType.outline2x,
+// ),
+//
+// SizedBox(
+// height: 10,
+// ),
+//
+//
+// GFButton(
+// onPressed: (){},
+// blockButton: true,
+// child: Text("Small",
+// ),
+// color: GFColor.primary,
+// size: GFSize.small,
+// type: GFType.outline2x,
+// ),
+//
+// ],
+// ),
+// ),
+//
+// ],
+// ),
+// ),
+// ],
+// ),
+// ),
+
+ body: Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.standard,
+ buttonBoxShadow: true,
+ child: Text(
+ "Primary",
+ ),
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ buttonBoxShadow: true,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ buttonBoxShadow: true,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ buttonBoxShadow: true,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ buttonBoxShadow: true,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ buttonBoxShadow: true,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ style: TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ buttonBoxShadow: true,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ buttonBoxShadow: false,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ )
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ buttonBoxShadow: true,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Large",
+ style: TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.large,
+ buttonBoxShadow: true,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Normal",
+ style: TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ buttonBoxShadow: true,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Small",
+ style: TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
+ buttonBoxShadow: true,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+ );
+ }
+}
diff --git a/demo_app/lib/screens/button/social-buttons.dart b/demo_app/lib/screens/button/social-buttons.dart
new file mode 100644
index 00000000..0d8bf3ea
--- /dev/null
+++ b/demo_app/lib/screens/button/social-buttons.dart
@@ -0,0 +1,331 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/colors/gf_color.dart';
+import 'package:ui_kit/components/typography/gf_typography.dart';
+import 'package:ui_kit/types/gf_typography_type.dart';
+import 'package:ui_kit/components/button/gf_button.dart';
+import 'package:ui_kit/components/button/gf_icon_button.dart';
+import 'package:ui_kit/components/card/gf_card.dart';
+import 'package:ui_kit/shape/gf_icon_button_shape.dart';
+import 'package:ui_kit/types/gf_type.dart';
+import 'package:ui_kit/size/gf_size.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+
+class SocialButtons extends StatefulWidget {
+ @override
+ _SocialButtonsState createState() => _SocialButtonsState();
+}
+
+class _SocialButtonsState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ leading: GestureDetector(
+ onTap: () {
+ Navigator.pop(context);
+ },
+ child: Image.asset('lib/assets/icons/back.png')),
+ title: Text(
+ 'Social Buttons',
+ style: TextStyle(fontSize: 17),
+ ),
+ centerTitle: true,
+ ),
+ body: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Social Buttons Full',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GFButton(
+ buttonBoxShadow: true,
+ color: Color(0xFF3B5998),
+ onPressed: () {},
+ child: Text(
+ "FB",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/fb.svg')),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text("Twitter"),
+ icon: SvgPicture.asset('lib/assets/icons/twitter.svg'),
+ color: Color(0xFF00ACEE),
+ buttonBoxShadow: true,
+ ),
+ ),
+ SizedBox(
+ width: 6,
+ ),
+ Expanded(
+ child: GFButton(
+ onPressed: () {},
+ child: Text(
+ "Whatsap",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/whatsapp.svg'),
+ color: Color(0xFF25D366),
+ buttonBoxShadow: true,
+ ),
+ )
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Google +",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/google.svg'),
+ color: Color(0xFFDD4B39),
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dribble",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/dribble.svg'),
+ color: Color(0xFFEA4C89),
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "LinkedIn",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/linkedin.svg'),
+ color: Color(0xFF0E76A8),
+ buttonBoxShadow: true,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Youtube",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/youtube.svg'),
+ color: Color(0xFFC4302B),
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Slack",
+ style: TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/slack.svg'),
+ color: Color(0XFF2EB67D),
+ buttonBoxShadow: true,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Pinterest",
+ ),
+ icon: SvgPicture.asset('lib/assets/icons/pinterest.svg'),
+ color: Color(0XFFC8232C),
+ buttonBoxShadow: true,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Social Buttons Icons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ color: Color(0xFF3B5998),
+ icon: SvgPicture.asset('lib/assets/icons/fb.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFF00ACEE),
+ icon: SvgPicture.asset('lib/assets/icons/twitter.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFF25D366),
+ icon: SvgPicture.asset('lib/assets/icons/whatsapp.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFFDD4B39),
+ icon: SvgPicture.asset('lib/assets/icons/google.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFFEA4C89),
+ icon: SvgPicture.asset('lib/assets/icons/dribble.svg'),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ color: Color(0xFF0E76A8),
+ icon: SvgPicture.asset('lib/assets/icons/linkedin.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFFC4302B),
+ icon: SvgPicture.asset('lib/assets/icons/youtube.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0XFF2EB67D),
+ icon: SvgPicture.asset('lib/assets/icons/slack.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0XFFC8232C),
+ icon:
+ SvgPicture.asset('lib/assets/icons/pinterest.svg'),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Floating Social Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ color: Color(0xFF3B5998),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/fb.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFF00ACEE),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/twitter.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFF25D366),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/whatsapp.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFFDD4B39),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/google.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFFEA4C89),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/dribble.svg'),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 20,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFIconButton(
+ color: Color(0xFF0E76A8),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/linkedin.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0xFFC4302B),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/youtube.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0XFF2EB67D),
+ shape: GFIconButtonShape.pills,
+ icon: SvgPicture.asset('lib/assets/icons/slack.svg'),
+ onPressed: () {}),
+ GFIconButton(
+ color: Color(0XFFC8232C),
+ shape: GFIconButtonShape.pills,
+ icon:
+ SvgPicture.asset('lib/assets/icons/pinterest.svg'),
+ onPressed: () {}),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ );
+ }
+}
diff --git a/demo_app/lib/screens/buttons.dart b/demo_app/lib/screens/button/square-buttons.dart
similarity index 53%
rename from demo_app/lib/screens/buttons.dart
rename to demo_app/lib/screens/button/square-buttons.dart
index 851a7fa2..6c875bd6 100644
--- a/demo_app/lib/screens/buttons.dart
+++ b/demo_app/lib/screens/button/square-buttons.dart
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:ui_kit/components/typography/gf_typography.dart';
import 'package:ui_kit/components/tabs/gf_tabs.dart';
import 'package:ui_kit/components/button/gf_button.dart';
+import 'package:ui_kit/size/gf_size.dart';
import 'package:ui_kit/types/gf_typography_type.dart';
import 'package:ui_kit/types/gf_type.dart';
import 'package:ui_kit/shape/gf_button_shape.dart';
@@ -9,21 +10,27 @@ import 'package:ui_kit/colors/gf_color.dart';
import 'package:ui_kit/components/card/gf_card.dart';
import 'package:ui_kit/components/tabs/gf_tabBarView.dart';
-class Buttons extends StatefulWidget {
+class SquareButtons extends StatefulWidget {
@override
- _ButtonsState createState() => _ButtonsState();
+ _SquareButtonsState createState() => _SquareButtonsState();
}
-class _ButtonsState extends State {
+class _SquareButtonsState extends State {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: getGFColor(GFColor.dark),
+ leading: GestureDetector(
+ onTap: () {
+ Navigator.pop(context);
+ },
+ child: Image.asset('lib/assets/icons/back.png')),
title: Text(
- 'Buttons',
- style: TextStyle(fontSize: 14),
+ 'Square Buttons',
+ style: TextStyle(fontSize: 17),
),
+ centerTitle: true,
),
body: GFTabs(
height: MediaQuery.of(context).size.height,
@@ -40,8 +47,8 @@ class _ButtonsState extends State {
"Solid",
style: TextStyle(fontSize: 12),
),
- type: GFType.solid,
textColor: GFColor.white,
+ shape: GFButtonShape.square,
),
GFButton(
onPressed: null,
@@ -50,13 +57,14 @@ class _ButtonsState extends State {
style: TextStyle(fontSize: 12),
),
type: GFType.outline,
- shape: GFButtonShape.pills,
+ shape: GFButtonShape.square,
),
GFButton(
onPressed: null,
- text: 'Transparent',
+ text: 'Outline 2x',
textStyle: TextStyle(fontSize: 12, color: getGFColor(GFColor.dark)),
- type: GFType.transparent,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
),
],
tabBarView: GFTabBarView(
@@ -65,15 +73,20 @@ class _ButtonsState extends State {
// color: Colors.red,
child: ListView(
children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
GFCard(
content: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFTypography(
- text: 'Standard',
- type: GFTypographyType.typo6,
- ),
SizedBox(
height: 10,
),
@@ -81,116 +94,114 @@ class _ButtonsState extends State {
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
- child: Text("Primary",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
- type: GFType.solid,
+ onPressed: () {},
+ shape: GFButtonShape.square,
+ child: Text(
+ "Primary",
+ ),
color: GFColor.primary,
),
GFButton(
- onPressed: null,
- child: Text("Secondary",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
- type: GFType.solid,
+ onPressed: () {},
+ child: Text(
+ "Secondary",
+ ),
color: GFColor.secondary,
+ shape: GFButtonShape.square,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Success",
),
- type: GFType.solid,
+ shape: GFButtonShape.square,
color: GFColor.success,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Warning",
),
- type: GFType.solid,
+ shape: GFButtonShape.square,
color: GFColor.warning,
),
GFButton(
- onPressed: null,
- child: Text("Danger",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
- type: GFType.solid,
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ shape: GFButtonShape.square,
color: GFColor.danger,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Light",
+ "Info",
),
- type: GFType.solid,
- color: GFColor.light,
+ shape: GFButtonShape.square,
+ color: GFColor.info,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Info",
+ "Light",
),
- type: GFType.solid,
- color: GFColor.info,
- ),
- GFButton(
- onPressed: null,
- child: Text("Alt",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
- type: GFType.solid,
- color: GFColor.alt,
+ shape: GFButtonShape.square,
+ color: GFColor.light,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Dark",
- style:
- TextStyle(color: getGFColor(GFColor.white)),
),
- type: GFType.solid,
+ shape: GFButtonShape.square,
color: GFColor.dark,
),
- ],
- ),
- Row(
- mainAxisAlignment: MainAxisAlignment.spaceBetween,
- children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Transparent",
+ "Link",
),
- type: GFType.solid,
color: GFColor.transparent,
),
],
- )
+ ),
+ SizedBox(
+ height: 10,
+ ),
],
),
),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
GFCard(
content: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFTypography(
- text: 'Pills',
- type: GFTypographyType.typo6,
- ),
SizedBox(
height: 10,
),
@@ -199,30 +210,33 @@ class _ButtonsState extends State {
children: [
GFButton(
onPressed: null,
- child: Text("Primary",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
+ shape: GFButtonShape.square,
+ child: Text(
+ "Primary",
+ ),
color: GFColor.primary,
- shape: GFButtonShape.pills,
),
GFButton(
onPressed: null,
- child: Text("Secondary",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
+ child: Text(
+ "Secondary",
+ ),
color: GFColor.secondary,
- shape: GFButtonShape.pills,
+ shape: GFButtonShape.square,
),
GFButton(
onPressed: null,
child: Text(
"Success",
),
- shape: GFButtonShape.pills,
+ shape: GFButtonShape.square,
color: GFColor.success,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
@@ -231,83 +245,78 @@ class _ButtonsState extends State {
child: Text(
"Warning",
),
- shape: GFButtonShape.pills,
+ shape: GFButtonShape.square,
color: GFColor.warning,
),
GFButton(
onPressed: null,
- child: Text("Danger",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
- shape: GFButtonShape.pills,
+ child: Text(
+ "Danger",
+ ),
+ shape: GFButtonShape.square,
color: GFColor.danger,
),
GFButton(
onPressed: null,
child: Text(
- "Light",
+ "Info",
),
- shape: GFButtonShape.pills,
- color: GFColor.light,
+ shape: GFButtonShape.square,
+ color: GFColor.info,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
onPressed: null,
child: Text(
- "Info",
+ "Light",
),
- shape: GFButtonShape.pills,
- color: GFColor.info,
- ),
- GFButton(
- onPressed: null,
- child: Text("Alt",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
- shape: GFButtonShape.pills,
- color: GFColor.alt,
+ shape: GFButtonShape.square,
+ color: GFColor.light,
),
GFButton(
onPressed: null,
child: Text(
"Dark",
- style:
- TextStyle(color: getGFColor(GFColor.white)),
),
- shape: GFButtonShape.pills,
+ shape: GFButtonShape.square,
color: GFColor.dark,
),
- ],
- ),
- Row(
- mainAxisAlignment: MainAxisAlignment.spaceBetween,
- children: [
GFButton(
onPressed: null,
child: Text(
- "Transparent",
+ "link",
),
- shape: GFButtonShape.pills,
color: GFColor.transparent,
),
],
- )
+ ),
+ SizedBox(
+ height: 10,
+ ),
],
),
),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
GFCard(
content: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFTypography(
- text: 'Square',
- type: GFTypographyType.typo6,
- ),
SizedBox(
height: 10,
),
@@ -315,123 +324,122 @@ class _ButtonsState extends State {
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
- child: Text("Primary",
+ onPressed: () {},
+ child: Text("Large",
style: TextStyle(
color: getGFColor(GFColor.white))),
color: GFColor.primary,
+ size: GFSize.large,
shape: GFButtonShape.square,
),
GFButton(
- onPressed: null,
- child: Text("Secondary",
+ onPressed: () {},
+ child: Text("Normal",
style: TextStyle(
color: getGFColor(GFColor.white))),
- color: GFColor.secondary,
- shape: GFButtonShape.square,
- ),
- GFButton(
- onPressed: null,
- child: Text(
- "Success",
- ),
- shape: GFButtonShape.square,
- color: GFColor.success,
- ),
- ],
- ),
- Row(
- mainAxisAlignment: MainAxisAlignment.spaceBetween,
- children: [
- GFButton(
- onPressed: null,
- child: Text(
- "Warning",
- ),
+ color: GFColor.primary,
+ size: GFSize.medium,
shape: GFButtonShape.square,
- color: GFColor.warning,
),
GFButton(
- onPressed: null,
- child: Text("Danger",
+ onPressed: () {},
+ child: Text("Small",
style: TextStyle(
color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
shape: GFButtonShape.square,
- color: GFColor.danger,
- ),
- GFButton(
- onPressed: null,
- child: Text(
- "Light",
- ),
- shape: GFButtonShape.square,
- color: GFColor.light,
),
],
),
- Row(
- mainAxisAlignment: MainAxisAlignment.spaceBetween,
- children: [
- GFButton(
- onPressed: null,
- child: Text(
- "Info",
- ),
- shape: GFButtonShape.square,
- color: GFColor.info,
- ),
- GFButton(
- onPressed: null,
- child: Text("Alt",
- style: TextStyle(
- color: getGFColor(GFColor.white))),
- shape: GFButtonShape.square,
- color: GFColor.alt,
- ),
- GFButton(
- onPressed: null,
- child: Text(
- "Dark",
- style:
- TextStyle(color: getGFColor(GFColor.white)),
- ),
- shape: GFButtonShape.square,
- color: GFColor.dark,
- ),
- ],
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 20),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Large",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.large,
+ shape: GFButtonShape.square,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Normal",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ shape: GFButtonShape.square,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Small",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
+ shape: GFButtonShape.square,
+ ),
+ SizedBox(
+ height: 10,
),
- Row(
- mainAxisAlignment: MainAxisAlignment.spaceBetween,
- children: [
- GFButton(
- onPressed: null,
- child: Text(
- "Transparent",
- ),
- shape: GFButtonShape.square,
- color: GFColor.transparent,
- ),
- ],
- )
],
),
),
],
),
),
+
+ //tab 2
Container(
// color: Colors.red,
child: ListView(
children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
GFCard(
content: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFTypography(
- text: 'Standard',
- type: GFTypographyType.typo6,
- ),
SizedBox(
height: 10,
),
@@ -439,98 +447,122 @@ class _ButtonsState extends State {
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
+ shape: GFButtonShape.square,
child: Text(
"Primary",
),
type: GFType.outline,
+ color: GFColor.primary,
),
GFButton(
- onPressed: null,
- child: Text("Secondary"),
- type: GFType.outline,
+ onPressed: () {},
+ child: Text(
+ "Secondary",
+ ),
color: GFColor.secondary,
+ type: GFType.outline,
+ shape: GFButtonShape.square,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Success",
),
type: GFType.outline,
+ shape: GFButtonShape.square,
color: GFColor.success,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Warning",
),
type: GFType.outline,
+ shape: GFButtonShape.square,
color: GFColor.warning,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Danger",
),
type: GFType.outline,
+ shape: GFButtonShape.square,
color: GFColor.danger,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Light",
+ "Info",
),
type: GFType.outline,
- color: GFColor.light,
+ shape: GFButtonShape.square,
+ color: GFColor.info,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Info",
+ "Light",
),
type: GFType.outline,
- color: GFColor.info,
+ shape: GFButtonShape.square,
+ color: GFColor.light,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Alt",
+ "Dark",
),
type: GFType.outline,
- color: GFColor.alt,
+ shape: GFButtonShape.square,
+ color: GFColor.dark,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Dark",
+ "Link",
),
- type: GFType.outline,
- color: GFColor.dark,
+ color: GFColor.transparent,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
],
),
),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
GFCard(
content: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFTypography(
- text: 'Pills',
- type: GFTypographyType.typo6,
- ),
SizedBox(
height: 10,
),
@@ -539,12 +571,12 @@ class _ButtonsState extends State {
children: [
GFButton(
onPressed: null,
+ shape: GFButtonShape.square,
child: Text(
"Primary",
),
type: GFType.outline,
color: GFColor.primary,
- shape: GFButtonShape.pills,
),
GFButton(
onPressed: null,
@@ -552,20 +584,23 @@ class _ButtonsState extends State {
"Secondary",
),
color: GFColor.secondary,
- shape: GFButtonShape.pills,
type: GFType.outline,
+ shape: GFButtonShape.square,
),
GFButton(
onPressed: null,
child: Text(
"Success",
),
- shape: GFButtonShape.pills,
- color: GFColor.success,
type: GFType.outline,
+ shape: GFButtonShape.square,
+ color: GFColor.success,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
@@ -574,74 +609,212 @@ class _ButtonsState extends State {
child: Text(
"Warning",
),
- shape: GFButtonShape.pills,
- color: GFColor.warning,
type: GFType.outline,
+ shape: GFButtonShape.square,
+ color: GFColor.warning,
),
GFButton(
onPressed: null,
child: Text(
"Danger",
),
- shape: GFButtonShape.pills,
+ type: GFType.outline,
+ shape: GFButtonShape.square,
color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Info",
+ ),
type: GFType.outline,
+ shape: GFButtonShape.square,
+ color: GFColor.info,
),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
GFButton(
onPressed: null,
child: Text(
"Light",
),
- shape: GFButtonShape.pills,
+ type: GFType.outline,
+ shape: GFButtonShape.square,
color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Dark",
+ ),
type: GFType.outline,
+ shape: GFButtonShape.square,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ color: GFColor.transparent,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Info",
+ "Large",
),
- shape: GFButtonShape.pills,
- color: GFColor.info,
+ color: GFColor.primary,
+ size: GFSize.large,
type: GFType.outline,
+ shape: GFButtonShape.square,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Alt",
+ "Normal",
),
- shape: GFButtonShape.pills,
- color: GFColor.alt,
+ color: GFColor.primary,
+ size: GFSize.medium,
type: GFType.outline,
+ shape: GFButtonShape.square,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
- "Dark",
+ "Small",
),
- shape: GFButtonShape.pills,
- color: GFColor.dark,
+ color: GFColor.primary,
+ size: GFSize.small,
type: GFType.outline,
+ shape: GFButtonShape.square,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
],
),
),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
GFCard(
content: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFTypography(
- text: 'Square',
- type: GFTypographyType.typo6,
+ SizedBox(
+ height: 10,
),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline,
+ shape: GFButtonShape.square,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline,
+ shape: GFButtonShape.square,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline,
+ shape: GFButtonShape.square,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+
+ //tab 3
+ Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
SizedBox(
height: 10,
),
@@ -649,199 +822,354 @@ class _ButtonsState extends State {
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
+ shape: GFButtonShape.square,
child: Text(
"Primary",
),
- type: GFType.outline,
+ type: GFType.outline2x,
color: GFColor.primary,
- shape: GFButtonShape.square,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Secondary",
),
color: GFColor.secondary,
+ type: GFType.outline2x,
shape: GFButtonShape.square,
- type: GFType.outline,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Success",
),
+ type: GFType.outline2x,
shape: GFButtonShape.square,
color: GFColor.success,
- type: GFType.outline,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Warning",
),
+ type: GFType.outline2x,
shape: GFButtonShape.square,
color: GFColor.warning,
- type: GFType.outline,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
child: Text(
"Danger",
),
+ type: GFType.outline2x,
shape: GFButtonShape.square,
color: GFColor.danger,
- type: GFType.outline,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
child: Text(
"Light",
),
+ type: GFType.outline2x,
shape: GFButtonShape.square,
color: GFColor.light,
- type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ shape: GFButtonShape.square,
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Secondary",
+ ),
+ color: GFColor.secondary,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ color: GFColor.success,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ color: GFColor.danger,
+ ),
GFButton(
onPressed: null,
child: Text(
"Info",
),
+ type: GFType.outline2x,
shape: GFButtonShape.square,
color: GFColor.info,
- type: GFType.outline,
),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
GFButton(
onPressed: null,
child: Text(
- "Alt",
+ "Light",
),
+ type: GFType.outline2x,
shape: GFButtonShape.square,
- color: GFColor.alt,
- type: GFType.outline,
+ color: GFColor.light,
),
GFButton(
onPressed: null,
child: Text(
"Dark",
),
+ type: GFType.outline2x,
shape: GFButtonShape.square,
color: GFColor.dark,
- type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ color: GFColor.transparent,
),
],
),
+ SizedBox(
+ height: 10,
+ ),
],
),
),
- ],
- ),
- ),
- Container(
- margin: EdgeInsets.only(top: 20, right: 20, left: 20),
- height: 100,
- child: Column(
- children: [
- GFTypography(
- text: 'Transparent',
- type: GFTypographyType.typo6,
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
),
- Row(
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFButton(
- onPressed: null,
- child: Text(
- "Primary",
- ),
- type: GFType.transparent,
- textColor: GFColor.primary,
+ SizedBox(
+ height: 10,
),
- GFButton(
- onPressed: null,
- child: Text(
- "Secondary",
- ),
- type: GFType.transparent,
- textColor: GFColor.secondary,
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ ),
+ ],
),
- GFButton(
- onPressed: null,
- child: Text(
- "Success",
- ),
- type: GFType.transparent,
- textColor: GFColor.success,
+ SizedBox(
+ height: 10,
),
],
),
- Row(
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
children: [
- GFButton(
- onPressed: null,
- child: Text(
- "Warning",
- ),
- type: GFType.transparent,
- textColor: GFColor.warning,
+ SizedBox(
+ height: 10,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
+ blockButton: true,
child: Text(
- "Danger",
+ "Large",
),
- type: GFType.transparent,
- textColor: GFColor.danger,
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
),
- GFButton(
- onPressed: null,
- child: Text(
- "Dark",
- ),
- type: GFType.transparent,
- textColor: GFColor.dark,
+ SizedBox(
+ height: 10,
),
- ],
- ),
- Row(
- children: [
GFButton(
- onPressed: null,
+ onPressed: () {},
+ blockButton: true,
child: Text(
- "Light",
+ "Normal",
),
- type: GFType.transparent,
- textColor: GFColor.light,
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
),
- GFButton(
- onPressed: null,
- child: Text(
- "Info",
- ),
- type: GFType.transparent,
- textColor: GFColor.info,
+ SizedBox(
+ height: 10,
),
GFButton(
- onPressed: null,
+ onPressed: () {},
+ blockButton: true,
child: Text(
- "Alt",
+ "Small",
),
- type: GFType.transparent,
- textColor: GFColor.alt,
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline2x,
+ shape: GFButtonShape.square,
+ ),
+ SizedBox(
+ height: 10,
),
],
),
- ],
- ))
+ ),
+ ],
+ ),
+ ),
],
),
),
diff --git a/demo_app/lib/screens/button/standard-buttons.dart b/demo_app/lib/screens/button/standard-buttons.dart
new file mode 100644
index 00000000..0f1e3b70
--- /dev/null
+++ b/demo_app/lib/screens/button/standard-buttons.dart
@@ -0,0 +1,1213 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/components/typography/gf_typography.dart';
+import 'package:ui_kit/components/tabs/gf_tabs.dart';
+import 'package:ui_kit/components/button/gf_button.dart';
+import 'package:ui_kit/size/gf_size.dart';
+import 'package:ui_kit/types/gf_typography_type.dart';
+import 'package:ui_kit/types/gf_toggle_type.dart';
+import 'package:ui_kit/types/gf_type.dart';
+import 'package:ui_kit/shape/gf_button_shape.dart';
+import 'package:ui_kit/colors/gf_color.dart';
+import 'package:ui_kit/components/card/gf_card.dart';
+import 'package:ui_kit/components/tabs/gf_tabBarView.dart';
+
+class StandardButtons extends StatefulWidget {
+ @override
+ _StandardButtonsState createState() => _StandardButtonsState();
+}
+
+class _StandardButtonsState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ leading: GestureDetector(
+ onTap: () {
+ Navigator.pop(context);
+ },
+ child: Image.asset('lib/assets/icons/back.png')),
+ title: Text(
+ 'Standard Buttons',
+ style: TextStyle(fontSize: 17),
+ ),
+ centerTitle: true,
+ ),
+ body: GFTabs(
+ height: MediaQuery.of(context).size.height,
+ tabBarColor: Color(0xFFD3E9ED),
+ initialIndex: 0,
+ length: 3,
+ indicatorColor: getGFColor(GFColor.info),
+ unselectedLabelColor: getGFColor(GFColor.danger),
+ labelColor: getGFColor(GFColor.warning),
+ tabs: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Solid",
+ style: TextStyle(fontSize: 12),
+ ),
+ type: GFType.solid,
+ textColor: GFColor.white,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Outline",
+ style: TextStyle(fontSize: 12),
+ ),
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: null,
+ text: 'Outline 2x',
+ textStyle: TextStyle(fontSize: 12, color: getGFColor(GFColor.dark)),
+ type: GFType.outline2x,
+ ),
+ ],
+ tabBarView: GFTabBarView(
+ children: [
+ Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ shape: GFButtonShape.standard,
+ child: Text("Primary",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Secondary",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.secondary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Danger",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ style:
+ TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.solid,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ shape: GFButtonShape.standard,
+ child: Text("Primary",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text("Secondary",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.secondary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Success",
+ ),
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Warning",
+ ),
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text("Danger",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Info",
+ ),
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Light",
+ ),
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Dark",
+ style:
+ TextStyle(color: getGFColor(GFColor.white)),
+ ),
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.solid,
+ color: GFColor.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Transparent Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.primary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Secondary",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.secondary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.success,
+ ),
+ ],
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.info,
+ ),
+ ],
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.transparent,
+ textColor: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text("Large",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.large,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Normal",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Small",
+ style: TextStyle(
+ color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Large",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.large,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Normal",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text("Small",
+ style:
+ TextStyle(color: getGFColor(GFColor.white))),
+ color: GFColor.primary,
+ size: GFSize.small,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+
+ //tab 2
+ Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Secondary"),
+ type: GFType.outline,
+ color: GFColor.secondary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text("Secondary"),
+ type: GFType.outline,
+ color: GFColor.secondary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+
+ //tab 3
+ Container(
+// color: Colors.red,
+ child: ListView(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 30),
+ child: GFTypography(
+ text: 'Default',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline2x,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text("Secondary"),
+ type: GFType.outline2x,
+ color: GFColor.secondary,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Disabled State',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Primary",
+ ),
+ type: GFType.outline2x,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text("Secondary"),
+ type: GFType.outline2x,
+ color: GFColor.secondary,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Success",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.success,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Warning",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.warning,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Danger",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.danger,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Info",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.info,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Light",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.light,
+ ),
+ GFButton(
+ onPressed: null,
+ child: Text(
+ "Dark",
+ ),
+ type: GFType.outline2x,
+ color: GFColor.dark,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Link",
+ ),
+ type: GFType.transparent,
+ ),
+ ],
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Button Sizes',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline2x,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline2x,
+ ),
+ GFButton(
+ onPressed: () {},
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline2x,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ],
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(left: 15, top: 10),
+ child: GFTypography(
+ text: 'Block Buttons',
+ type: GFTypographyType.typo5,
+ dividerWidth: 25,
+ dividerColor: Color(0xFF19CA4B),
+ ),
+ ),
+ GFCard(
+ content: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Large",
+ ),
+ color: GFColor.primary,
+ size: GFSize.large,
+ type: GFType.outline2x,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Normal",
+ ),
+ color: GFColor.primary,
+ size: GFSize.medium,
+ type: GFType.outline2x,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ GFButton(
+ onPressed: () {},
+ blockButton: true,
+ child: Text(
+ "Small",
+ ),
+ color: GFColor.primary,
+ size: GFSize.small,
+ type: GFType.outline2x,
+ ),
+ SizedBox(
+ height: 10,
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+ ],
+ ),
+ ),
+ );
+ }
+}
diff --git a/demo_app/lib/screens/home.dart b/demo_app/lib/screens/home.dart
index 09eec93d..2f3add5e 100644
--- a/demo_app/lib/screens/home.dart
+++ b/demo_app/lib/screens/home.dart
@@ -1,15 +1,17 @@
-//import 'package:demo_app/screens/cards.dart';
-//import 'package:demo_app/screens/icon-button.dart';
-//import 'package:demo_app/screens/list-tiles.dart';
+import 'package:demo_app/screens/button/button-types.dart';
+import 'package:demo_app/screens/cards.dart';
+import 'package:demo_app/screens/icon-button.dart';
+import 'package:demo_app/screens/list-tiles.dart';
import 'package:flutter/material.dart';
import 'package:ui_kit/colors/gf_color.dart';
import 'package:ui_kit/components/card/gf_card.dart';
import 'avatars.dart';
-import 'buttons.dart';
import 'toggles.dart';
import 'headers.dart';
import 'toasts.dart';
-import 'badges.dart';
+import '../screens/badges/badges.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import '../screens/button/standard-buttons.dart';
class HomePage extends StatefulWidget {
@override
@@ -20,308 +22,669 @@ class _HomePageState extends State {
@override
Widget build(BuildContext context) {
return Scaffold(
- appBar: AppBar(
- backgroundColor: getGFColor(GFColor.dark),
- title: Text(
- 'GET FLUTTER',
- style: TextStyle(fontSize: 14),
+ appBar: AppBar(
+ backgroundColor: getGFColor(GFColor.dark),
+ title: Image.asset('lib/assets/logo/logo.png'),
+ centerTitle: true,
),
- centerTitle: true,
- ),
-// body: Container(
-// child: Row(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Expanded(child: GestureDetector(
-// onTap: (){
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Buttons()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.bubble_chart),
-// Text('Buttons')
-// ],
-// ),
-// ),
-// )),
-// Expanded(child: GestureDetector(
-// onTap: (){
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Avatars()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.warning),
-// content: Column(
-// children: [
-// Icon(Icons.face),
-// Text('Avatar')
-// ],
-// ),
-// ),
-// ),)
-// ],
-// ),
-// )
-
- body:Text("Dcfs")
-
-// Column(
-// children: [
-// Row(
-// children: [
-// Expanded(
-// child: Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Buttons()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.bubble_chart,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'Buttons',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// ))),
-// Expanded(
-// child: Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Avatars()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.face, color: getGFColor(GFColor.white)),
-// Text(
-// 'Avatar',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// )),
-// ),
-// Expanded(
-// child: Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Toggles()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.all_inclusive,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'Toggle',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// )))
-// ],
-// ),
-
-// Row(
-// children: [
-// Expanded(child:Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Headers()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.menu,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'Header',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// )) ),
-// Expanded(child:Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Toasts()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.call_to_action,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'Toast',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// )) ),
-// Expanded(child:Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Cards()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.credit_card,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'Card',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// )) )
-// ],
-// ),
-//
-// Row(
-// children: [
-// Expanded(child:Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => IconButtons()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.insert_emoticon,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'Icon Button',
-// style: TextStyle(color: getGFColor(GFColor.white), fontSize: 12),
-// )
-// ],
-// ),
-// ),
-// )) ),
-// Expanded(child:Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => ListTiles()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.list,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'ListTile',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// )) ),
-// Expanded(child:Container(
-// height: 100,
-// child: GestureDetector(
-// onTap: () {
-// Navigator.push(
-// context,
-// MaterialPageRoute(
-// builder: (BuildContext context) => Badges()),
-// );
-// },
-// child: GFCard(
-// color: getGFColor(GFColor.success),
-// content: Column(
-// mainAxisAlignment: MainAxisAlignment.spaceBetween,
-// children: [
-// Icon(Icons.apps,
-// color: getGFColor(GFColor.white)),
-// Text(
-// 'Badges',
-// style: TextStyle(color: getGFColor(GFColor.white)),
-// )
-// ],
-// ),
-// ),
-// ))
-// )
-// ],
-// )
-// ],
-// ),
- );
+ body: Container(
+ margin: EdgeInsets.only(left: 15, right: 15),
+ child: ListView(
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ Expanded(
+ child: GestureDetector(
+ onTap: () {
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => ButtonTypes()),
+ );
+ },
+ child: Container(
+ height: 160,
+ margin: EdgeInsets.only(top: 23),
+ decoration: BoxDecoration(
+// color:getGFColor( GFColor.dark,),
+ color: Color(0xFF333333),
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ boxShadow: [
+ new BoxShadow(
+ color: Colors.black.withOpacity(0.61),
+ blurRadius: 8.0,
+ spreadRadius: 0.0),
+ ]),
+ child: Column(
+ mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Image.asset('lib/assets/icons/buttons.png'),
+ Text(
+ 'Buttons',
+ style: TextStyle(
+ fontSize: 20,
+ color: getGFColor(
+ GFColor.white,
+ )),
+ )
+ ],
+ ),
+ ),
+ ),
+ ),
+ SizedBox(
+ width: 23,
+ ),
+ Expanded(
+ child: GestureDetector(
+ onTap: () {
+ Navigator.push(
+ context,
+ MaterialPageRoute(
+ builder: (BuildContext context) => Cards()),
+ );
+ },
+ child: Container(
+ margin: EdgeInsets.only(top: 23),
+ decoration: BoxDecoration(
+// color:getGFColor( GFColor.dark,),
+ color: Color(0xFF333333),
+ borderRadius: BorderRadius.all(Radius.circular(7)),
+ boxShadow: [
+ new BoxShadow(
+ color: Colors.black.withOpacity(0.61),
+ blurRadius: 8.0,
+ spreadRadius: 0.0),
+ ]),
+ height: 160,
+ child: Column(
+ mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+ children: [
+ SizedBox(
+ height: 10,
+ ),
+ Image.asset('lib/assets/icons/card.png'),
+// SvgPicture.asset('lib/assets/icons/buttons.svg', color: getGFColor(GFColor.success),),
+ Text(
+ 'Cards',
+ style: TextStyle(
+ fontSize: 20,
+ color: getGFColor(
+ GFColor.white,
+ )),
+ )
+ ],
+ ),
+ ),
+ ))
+ ],
+ ),
+ Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: