diff --git a/example/lib/main.dart b/example/lib/main.dart index f6e48b06..cf51763d 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -1,11 +1,14 @@ import 'package:flutter/material.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/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/avatar/gf_avatar.dart'; -import 'package:ui_kit/components/counter/gf_counter.dart'; +import 'package:ui_kit/components/badge/gf_badge.dart'; import 'package:ui_kit/components/card/gf_card.dart'; +import 'package:ui_kit/components/header_bar/gf_title_bar.dart'; +import 'package:ui_kit/components/image/gf_image_overlay.dart'; +import 'package:ui_kit/types/gf_type.dart'; void main() => runApp(MyApp()); @@ -40,9 +43,35 @@ class _MyHomePageState extends State { ), body: SingleChildScrollView( child: Column( - mainAxisAlignment: MainAxisAlignment.spaceEvenly, + mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ + + GFTitleBar( + avatar: GFAvatar( + child: Text("tb"), + ), + title: Text('title'), + subTitle: Text('subtitle'), + icon: GFIconButton( + icon: Icon(Icons.favorite_border), + ), + ), + + GFCard( + avatar: GFAvatar( + child: Text("tb"), + ), + title: Text('title'), + subTitle: Text('subtitle'), + icon: GFIconButton( + icon: Icon(Icons.favorite_border), + type: GFType.transparent, + ), + ), + + + // GFCard( // headertype: GFAtb(), // po @@ -75,7 +104,7 @@ class _MyHomePageState extends State { onPressed: null, icon: Icon(Icons.ac_unit), ), - counterChild: GFCounter( + counterChild: GFBadge( text: '12', // color: GFColor.dark, // shape: GFShape.circle, @@ -104,7 +133,7 @@ class _MyHomePageState extends State { // 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), ), - GFBadges( + GFButtonBadge( onPressed: null, // position: GFIconPosition.start, // borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), @@ -114,7 +143,7 @@ class _MyHomePageState extends State { // shape: GFShape.pills, // type: GFType.outline, // size: GFSize.small, - counterChild: GFCounter( + counterChild: GFBadge( child: Text("12"), // color: GFColor.dark, // shape: GFShape.circle, @@ -124,7 +153,7 @@ class _MyHomePageState extends State { // textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), ), ), - GFCounter( + GFBadge( text: '12', // color: GFColor.dark, // shape: GFShape.circle, diff --git a/lib/components/badge/gf_badge.dart b/lib/components/badge/gf_badge.dart index 24ac2700..1b33c3dc 100644 --- a/lib/components/badge/gf_badge.dart +++ b/lib/components/badge/gf_badge.dart @@ -1,123 +1,122 @@ import 'package:flutter/material.dart'; import 'package:ui_kit/shape/gf_shape.dart'; import 'package:ui_kit/size/gf_size.dart'; -import 'package:ui_kit/types/gf_type.dart'; -import 'package:ui_kit/position/gf_position.dart'; import 'package:ui_kit/colors/color.dart'; -import 'package:ui_kit/components/button/gf_button.dart'; -class GFBadges extends StatefulWidget { +class GFBadge extends StatefulWidget { - /// Called when the badge is tapped or otherwise activated. - final VoidCallback onPressed; + /// The border side for the button's [Material]. + final BorderSide border; - /// Defines the default text style, with [Material.textStyle], for the button's [child]. - final TextStyle textStyle; - - /// The border side for the badge's [Material]. - final BorderSide borderSide; - - /// The internal padding for the badge's [child]. - final EdgeInsetsGeometry padding; - - /// The shape of the badge's [Material]. + /// Typically the counter button's shape. final ShapeBorder borderShape; - /// Badge type of [GFType] i.e, solid, outline, transparent - final GFType type; - - /// Badge type of [GFShape] i.e, standard, pills, square + /// Counter type of [GFShape] i.e, standard, pills, square, final GFShape shape; /// Pass [GFColor] or [Color] final dynamic color; - /// Pass [GFColor] or [Color] - final dynamic textColor; - /// size of [double] or [GFSize] i.e, 1.2, small, medium, large etc. - final dynamic size; + final GFSize size; /// text of type [String] is alternative to child. text will get priority over child - final String text; + final Widget child; /// text of type [String] is alternative to child. text will get priority over child - final Widget counterChild; + final String text; + + /// text style of counter text + final TextStyle textStyle; - /// icon type of [GFPosition] i.e, start, end - final GFPosition position; + /// Pass [GFColor] or [Color] + final dynamic textColor; - /// Create badges of all types. check out gfIconBadges for icon badges - const GFBadges({ + /// Create counter of all types, check out [GFBadge] for button badges and [GFIconBadge] for icon badges + + const GFBadge({ Key key, - @required this.onPressed, this.textStyle, - this.padding = const EdgeInsets.symmetric(horizontal: 8.0), this.borderShape, - this.type = GFType.solid, this.shape = GFShape.standard, - this.color = GFColor.primary, + this.color = GFColor.secondary, this.textColor = GFColor.dark, - this.position = GFPosition.end, this.size = GFSize.medium, - this.borderSide, - @required this.text, - @required this.counterChild, + this.border, + this.text, + @required this.child, }) : - assert(shape != null, 'Badge shape can not be null',), - assert(padding != null), + assert(shape != null, 'Counter shape can not be null',), super(key: key); @override - _GFBadgesState createState() => _GFBadgesState(); + _GFBadgeState createState() => _GFBadgeState(); } -class _GFBadgesState extends State { +class _GFBadgeState extends State { Color color; Color textColor; Widget child; - Widget icon; - Function onPressed; - GFType type; - GFShape shape; - double size; - GFPosition position; + GFShape counterShape; + GFSize size; + double height; + double width; + double fontSize; @override void initState() { this.color = getGFColor(widget.color); this.textColor = getGFColor(widget.textColor); - this.onPressed = widget.onPressed; - this.type = widget.type; - this.shape = widget.shape; - this.size = getGFSize(widget.size); - this.position = widget.position; + this.child = widget.child == null ? Text(widget.text) : widget.child; + this.counterShape = widget.shape; + this.size = widget.size; super.initState(); } @override Widget build(BuildContext context) { - return ConstrainedBox( - constraints: BoxConstraints(minHeight: 26.0, minWidth: 98.0), - child: Container( - height: this.size, - child: GFButton( - textStyle: widget.textStyle, - borderSide: widget.borderSide, - color: this.color, - textColor: this.textColor, - text: widget.text, - onPressed: this.onPressed, - type: this.type, - shape: this.shape, - position: this.position, - size: this.size, - borderShape: widget.borderShape, - icon: widget.counterChild + final Color themeColor = Theme.of(context).colorScheme.onSurface.withOpacity(0.12); + final BorderSide shapeBorder = widget.border != null ? widget.border : BorderSide(color: this.color, width: 0.0,); + + ShapeBorder shape; + + if(this.counterShape == GFShape.pills){ + shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(50.0), side: shapeBorder); + }else if(this.counterShape == GFShape.square){ + shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(0.0), side: shapeBorder); + }else if(this.counterShape == GFShape.standard){ + shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0), side: shapeBorder); + }else if(this.counterShape == GFShape.circle) { + shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(100.0), side: shapeBorder); + } + + if(this.size == GFSize.small){ + this.height = 18.0; this.width = 24.0; this.fontSize = 10.0; + }else if(this.size == GFSize.medium){ + this.height = 20.0; this.width = 26.0; this.fontSize = 12.0; + }else if(this.size == GFSize.large){ + this.height = 24.0; this.width = 30.0; this.fontSize = 12.0; + } + + + return Container( + height: this.height, + width: this.counterShape == GFShape.circle ? this.height : this.width, + child: Material( + textStyle: this.textColor != null ? TextStyle(color: this.textColor, fontSize: this.fontSize): widget.textStyle, + shape: widget.borderShape == null ? shape : widget.borderShape, + color: this.color, + type: MaterialType.button, + child: Container( + child: Center( + widthFactor: 1.0, + heightFactor: 1.0, + child: this.child, + ), ), ), ); } -} \ No newline at end of file +} diff --git a/lib/components/badge/gf_button_badge.dart b/lib/components/badge/gf_button_badge.dart new file mode 100644 index 00000000..b5e278af --- /dev/null +++ b/lib/components/badge/gf_button_badge.dart @@ -0,0 +1,123 @@ +import 'package:flutter/material.dart'; +import 'package:ui_kit/shape/gf_shape.dart'; +import 'package:ui_kit/size/gf_size.dart'; +import 'package:ui_kit/types/gf_type.dart'; +import 'package:ui_kit/position/gf_position.dart'; +import 'package:ui_kit/colors/color.dart'; +import 'package:ui_kit/components/button/gf_button.dart'; + +class GFButtonBadge extends StatefulWidget { + + /// Called when the badge is tapped or otherwise activated. + final VoidCallback onPressed; + + /// Defines the default text style, with [Material.textStyle], for the button's [child]. + final TextStyle textStyle; + + /// The border side for the badge's [Material]. + final BorderSide borderSide; + + /// The internal padding for the badge's [child]. + final EdgeInsetsGeometry padding; + + /// The shape of the badge's [Material]. + final ShapeBorder borderShape; + + /// Badge type of [GFType] i.e, solid, outline, transparent + final GFType type; + + /// Badge type of [GFShape] i.e, standard, pills, square + final GFShape shape; + + /// Pass [GFColor] or [Color] + final dynamic color; + + /// Pass [GFColor] or [Color] + final dynamic textColor; + + /// size of [double] or [GFSize] i.e, 1.2, small, medium, large etc. + final dynamic size; + + /// text of type [String] is alternative to child. text will get priority over child + final String text; + + /// text of type [String] is alternative to child. text will get priority over child + final Widget counterChild; + + /// icon type of [GFPosition] i.e, start, end + final GFPosition position; + + /// Create badges of all types. check out [GFIconBadge] for icon badges + + const GFButtonBadge({ + Key key, + @required this.onPressed, + this.textStyle, + this.padding = const EdgeInsets.symmetric(horizontal: 8.0), + this.borderShape, + this.type = GFType.solid, + this.shape = GFShape.standard, + this.color = GFColor.primary, + this.textColor = GFColor.dark, + this.position = GFPosition.end, + this.size = GFSize.medium, + this.borderSide, + @required this.text, + @required this.counterChild, + }) : + assert(shape != null, 'Badge shape can not be null',), + assert(padding != null), + super(key: key); + + @override + _GFButtonBadgeState createState() => _GFButtonBadgeState(); +} + +class _GFButtonBadgeState extends State { + Color color; + Color textColor; + Widget child; + Widget icon; + Function onPressed; + GFType type; + GFShape shape; + double size; + GFPosition position; + + @override + void initState() { + this.color = getGFColor(widget.color); + this.textColor = getGFColor(widget.textColor); + this.onPressed = widget.onPressed; + this.type = widget.type; + this.shape = widget.shape; + this.size = getGFSize(widget.size); + this.position = widget.position; + super.initState(); + } + + @override + Widget build(BuildContext context) { + + return ConstrainedBox( + constraints: BoxConstraints(minHeight: 26.0, minWidth: 98.0), + child: Container( + height: this.size, + child: GFButton( + textStyle: widget.textStyle, + borderSide: widget.borderSide, + color: this.color, + textColor: this.textColor, + text: widget.text, + onPressed: this.onPressed, + type: this.type, + shape: this.shape, + position: this.position, + size: this.size, + borderShape: widget.borderShape, + icon: widget.counterChild + ), + ), + ); + } +} \ No newline at end of file diff --git a/lib/components/badge/gf_icon_badge.dart b/lib/components/badge/gf_icon_badge.dart index 5f33fb6d..830795ac 100644 --- a/lib/components/badge/gf_icon_badge.dart +++ b/lib/components/badge/gf_icon_badge.dart @@ -18,7 +18,7 @@ class GFIconBadges extends StatefulWidget { final EdgeInsetsGeometry padding; - /// Create badges of all types, check out gfBadges for button badges + /// Create badges of all types, check out [GFBadge] for button badges const GFIconBadges({ Key key, diff --git a/lib/components/button/gf_button.dart b/lib/components/button/gf_button.dart index a5d9f21f..b1e4d1f6 100644 --- a/lib/components/button/gf_button.dart +++ b/lib/components/button/gf_button.dart @@ -117,7 +117,7 @@ class GFButton extends StatefulWidget { /// on true state default box shadow appears around button final bool buttonBoxShadow; - /// Create buttons of all types. check out gfIconButton for icon buttons + /// Create buttons of all types. check out [GFIconButton] for icon buttons const GFButton({ Key key, diff --git a/lib/components/button/gf_icon_button.dart b/lib/components/button/gf_icon_button.dart index 45ae7d99..11a2542a 100644 --- a/lib/components/button/gf_icon_button.dart +++ b/lib/components/button/gf_icon_button.dart @@ -72,7 +72,7 @@ class GFIconButton extends StatefulWidget { /// The border side for the button's [Material]. final BorderSide borderSide; - /// Create icon buttons of all types. check out gfButton for buttons + /// Create icon buttons of all types. check out [GFButton] for buttons const GFIconButton({ Key key, diff --git a/lib/components/card/gf_card.dart b/lib/components/card/gf_card.dart index 67e422a0..1118875a 100644 --- a/lib/components/card/gf_card.dart +++ b/lib/components/card/gf_card.dart @@ -1,6 +1,7 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:ui_kit/components/avatar/gf_avatar.dart'; +import 'package:ui_kit/components/header_bar/gf_title_bar.dart'; enum GFCardType { basic, social, image} @@ -24,6 +25,7 @@ class GFCard extends StatelessWidget { this.titleTextStyle, this.content, this.image, + this.icon }) : assert(elevation == null || elevation >= 0.0), assert(borderOnForeground != null), super(key: key); @@ -60,11 +62,14 @@ class GFCard extends StatelessWidget { /// gfAvatar used to create rounded user profile final GFAvatar avatar; - /// pass [string] as title - final String title; + /// The title to display inside the [GFTitleBar]. see [Text] + final Widget title; - /// pass [string] as subTitle - final String subTitle; + /// The subTitle to display inside the [GFTitleBar]. see [Text] + final Widget subTitle; + + /// The icon to display inside the [GFTitleBar]. see [Icon] + final Widget icon; /// pass [style] as title's textStyle final TextStyle titleTextStyle; @@ -85,43 +90,11 @@ class GFCard extends StatelessWidget { Widget build(BuildContext context) { final CardTheme cardTheme = CardTheme.of(context); - Text gfTitle = Text(title, - style: titleTextStyle == null ? TextStyle(color: Colors.black87, fontSize: 18.0, fontWeight: FontWeight.w600) : titleTextStyle, - ); - Text gfSubTitle = Text(subTitle, - style: subTitleTextStyle == null ? TextStyle(color: Colors.black45, fontSize: 14.0, fontWeight: FontWeight.w400) : subTitleTextStyle, - ); - -// -// Widget avatarHeader = Container( -// padding: padding, -// child: Row( -// crossAxisAlignment: CrossAxisAlignment.center, -// children: [ -// avatar, -// const SizedBox(width: 12.0), -// Column( -// mainAxisAlignment: MainAxisAlignment.center, -// crossAxisAlignment: CrossAxisAlignment.start, -// children: [ -// gfTitle, -// gfSubTitle, -// ], -// ) -// ], -// ), +// Text gfTitle = Text(title, +// style: titleTextStyle == null ? TextStyle(color: Colors.black87, fontSize: 18.0, fontWeight: FontWeight.w600) : titleTextStyle, // ); -// -// Widget titleBar = Container( -// padding: padding, -// child: Column( -// mainAxisAlignment: MainAxisAlignment.start, -// crossAxisAlignment: CrossAxisAlignment.center, -// children: [ -// gfTitle, -// gfSubTitle, -// ], -// ), +// Text gfSubTitle = Text(subTitle, +// style: subTitleTextStyle == null ? TextStyle(color: Colors.black45, fontSize: 14.0, fontWeight: FontWeight.w400) : subTitleTextStyle, // ); return Container( @@ -137,12 +110,17 @@ class GFCard extends StatelessWidget { clipBehavior: clipBehavior ?? cardTheme.clipBehavior ?? _defaultClipBehavior, child: Column( children: [ - image, - - Padding( - padding: padding, - child: content, - ) + GFTitleBar( + avatar: avatar, + title: title, + subTitle: subTitle, + icon: icon, + ), +// image, +// Padding( +// padding: padding, +// child: content, +// ) ], ), ), diff --git a/lib/components/counter/gf_counter.dart b/lib/components/counter/gf_counter.dart deleted file mode 100644 index 44e412e3..00000000 --- a/lib/components/counter/gf_counter.dart +++ /dev/null @@ -1,122 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:ui_kit/shape/gf_shape.dart'; -import 'package:ui_kit/size/gf_size.dart'; -import 'package:ui_kit/colors/color.dart'; - -class GFCounter extends StatefulWidget { - - /// The border side for the button's [Material]. - final BorderSide border; - - /// Typically the counter button's shape. - final ShapeBorder borderShape; - - /// Counter type of [GFShape] i.e, standard, pills, square, - final GFShape shape; - - /// Pass [GFColor] or [Color] - final dynamic color; - - /// size of [double] or [GFSize] i.e, 1.2, small, medium, large etc. - final GFSize size; - - /// text of type [String] is alternative to child. text will get priority over child - final Widget child; - - /// text of type [String] is alternative to child. text will get priority over child - final String text; - - /// text style of counter text - final TextStyle textStyle; - - /// Pass [GFColor] or [Color] - final dynamic textColor; - - - /// Create counter of all types, check out gfBadges for button badges and gfIconBadges for icon badges - - const GFCounter({ - Key key, - this.textStyle, - this.borderShape, - this.shape = GFShape.standard, - this.color = GFColor.secondary, - this.textColor = GFColor.dark, - this.size = GFSize.medium, - this.border, - this.text, - @required this.child, - }) : - assert(shape != null, 'Counter shape can not be null',), - super(key: key); - - @override - _GFCounterState createState() => _GFCounterState(); -} - -class _GFCounterState extends State { - Color color; - Color textColor; - Widget child; - GFShape counterShape; - GFSize size; - double height; - double width; - double fontSize; - - @override - void initState() { - this.color = getGFColor(widget.color); - this.textColor = getGFColor(widget.textColor); - this.child = widget.child == null ? Text(widget.text) : widget.child; - this.counterShape = widget.shape; - this.size = widget.size; - super.initState(); - } - - @override - Widget build(BuildContext context) { - - final Color themeColor = Theme.of(context).colorScheme.onSurface.withOpacity(0.12); - final BorderSide shapeBorder = widget.border != null ? widget.border : BorderSide(color: this.color, width: 0.0,); - - ShapeBorder shape; - - if(this.counterShape == GFShape.pills){ - shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(50.0), side: shapeBorder); - }else if(this.counterShape == GFShape.square){ - shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(0.0), side: shapeBorder); - }else if(this.counterShape == GFShape.standard){ - shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(5.0), side: shapeBorder); - }else if(this.counterShape == GFShape.circle) { - shape = RoundedRectangleBorder(borderRadius: BorderRadius.circular(100.0), side: shapeBorder); - } - - if(this.size == GFSize.small){ - this.height = 18.0; this.width = 24.0; this.fontSize = 10.0; - }else if(this.size == GFSize.medium){ - this.height = 20.0; this.width = 26.0; this.fontSize = 12.0; - }else if(this.size == GFSize.large){ - this.height = 24.0; this.width = 30.0; this.fontSize = 12.0; - } - - - return Container( - height: this.height, - width: this.counterShape == GFShape.circle ? this.height : this.width, - child: Material( - textStyle: this.textColor != null ? TextStyle(color: this.textColor, fontSize: this.fontSize): widget.textStyle, - shape: widget.borderShape == null ? shape : widget.borderShape, - color: this.color, - type: MaterialType.button, - child: Container( - child: Center( - widthFactor: 1.0, - heightFactor: 1.0, - child: this.child, - ), - ), - ), - ); - } -} diff --git a/lib/components/header_bar/avatar_title_bar.dart b/lib/components/header_bar/avatar_title_bar.dart deleted file mode 100644 index 8f4ece2b..00000000 --- a/lib/components/header_bar/avatar_title_bar.dart +++ /dev/null @@ -1,64 +0,0 @@ -import 'package:flutter/cupertino.dart'; -import 'package:flutter/material.dart'; -import 'package:ui_kit/components/avatar/gf_avatar.dart'; - -class GFAvatarTitleBar extends StatelessWidget { - - const GFAvatarTitleBar({ - Key key, - this.color, - this.padding, - this.margin, - this.avatar, - this.title, - this.subTitle, - }) : super(key: key); - - /// The card's background color. - final Color color; - - /// The empty space that surrounds the card. Defines the card's outer [Container.margin]. - final EdgeInsetsGeometry margin; - - /// The empty space that surrounds the card. Defines the card's outer [Container.margin].. - final EdgeInsetsGeometry padding; - - /// gfAvatar used to create rounded user profile - final GFAvatar avatar; - - /// any widget can be used as title - final Widget title; - - /// any widget can be used as subTitle - final Widget subTitle; - - @override - Widget build(BuildContext context) { - - return Container( - margin: margin ?? const EdgeInsets.all(16.0), - padding: padding ?? const EdgeInsets.all(12.0), - child: Container( - padding: padding, - child: Row( - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - avatar, - const SizedBox(width: 12.0), - Column( - mainAxisAlignment: MainAxisAlignment.center, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - title, - subTitle, - ], - ) - ], - ), - ), - ); - } -} - - - diff --git a/lib/components/header_bar/gf_title_bar.dart b/lib/components/header_bar/gf_title_bar.dart new file mode 100644 index 00000000..c38a28d9 --- /dev/null +++ b/lib/components/header_bar/gf_title_bar.dart @@ -0,0 +1,56 @@ +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; +import 'package:ui_kit/components/avatar/gf_avatar.dart'; + +class GFTitleBar extends StatelessWidget { + + const GFTitleBar({ + Key key, + this.color, + this.padding, + this.margin, + this.avatar, + this.title, + this.subTitle, + this.icon + }) : super(key: key); + + /// The card's background color. + final Color color; + + /// The empty space that surrounds the card. Defines the card's outer [Container.margin]. + final EdgeInsetsGeometry margin; + + /// The empty space that surrounds the card. Defines the card's outer [Container.padding]. + final EdgeInsetsGeometry padding; + + /// [GFAvatar] used to create rounded user profile + final GFAvatar avatar; + + /// The title to display inside the [GFTitleBar]. see [Text] + final Widget title; + + /// The subTitle to display inside the [GFTitleBar]. see [Text] + final Widget subTitle; + + /// The icon to display inside the [GFTitleBar]. see [Icon] + final Widget icon; + + @override + Widget build(BuildContext context) { + + return Container( +// margin: margin ?? const EdgeInsets.all(16.0), +// padding: padding ?? const EdgeInsets.all(12.0), + child: ListTile( + leading: avatar, + title: title, + subtitle: subTitle, + trailing: icon, + ), + ); + } +} + + + diff --git a/lib/components/image/image_overlay.dart b/lib/components/image/gf_image_overlay.dart similarity index 100% rename from lib/components/image/image_overlay.dart rename to lib/components/image/gf_image_overlay.dart