part of '../pages.dart';

class IconsButtonsPage extends StatefulWidget {
  const IconsButtonsPage({ Key? key }) : super(key: key);
  static const routeName = '/buttons_page/icons_buttons_page';

  @override
  _IconsButtonsPageState createState() => _IconsButtonsPageState();
}

class _IconsButtonsPageState extends State<IconsButtonsPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: LLSColors.PRIMARY,
        leading: InkWell(
          onTap: () {
            Navigator.of(context).pop();
          },
          child: Container(
            child: Icon(
              CupertinoIcons.back,
              color: LLSColors.WHITE,
            ),
          ),
        ),
        title: const Text(
          'Icons Buttons',
          style: TextStyle(fontSize: 17),
        ),
        centerTitle: true,
      ),
      body: ListView(
        children: <Widget>[
          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Solid Icons',
              type: LLSLabelType.typo5,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSCard(
            content: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                const SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Primary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Secondary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.SECONDARY,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Success'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.SUCCESS,
                      ),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Warning'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.WARNING,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Danger'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.DANGER,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Info'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.INFO,
                      ),
                    )
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Light'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        type: LLSButtonType.solid,
                        color: LLSColors.LIGHT,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text(
                          'Dark',
                          style: TextStyle(color: LLSColors.WHITE),
                        ),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.DARK,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Link'),
                        icon: const Icon(
                          Icons.save,
                        ),
                        color: LLSColors.TRANSPARENT,
                      ),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
              ],
            ),
          ),

          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Outline Icons',
              type: LLSLabelType.typo5,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSCard(
            content: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                const SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        type: LLSButtonType.outline,
                        child: const Text('Primary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.PRIMARY,
                        ),
                        widthBorderOutline: 2.0
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Secondary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.SECONDARY,
                        ),
                        widthBorderOutline: 2.0,
                        color: LLSColors.SECONDARY,
                        type: LLSButtonType.outline,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Success'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.SUCCESS,
                        ),
                        widthBorderOutline: 2.0,
                        color: LLSColors.SUCCESS,
                        type: LLSButtonType.outline,
                      ),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Warning'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WARNING,
                        ),
                        widthBorderOutline: 2.0,
                        color: LLSColors.WARNING,
                        type: LLSButtonType.outline,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Danger'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.DANGER,
                        ),
                        widthBorderOutline: 2.0,
                        color: LLSColors.DANGER,
                        type: LLSButtonType.outline,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Info'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.INFO,
                        ),
                        widthBorderOutline: 2.0,
                        color: LLSColors.INFO,
                        type: LLSButtonType.outline,
                      ),
                    )
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Light'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.LIGHT,
                        ),
                        widthBorderOutline: 2.0,
                        type: LLSButtonType.outline,
                        color: LLSColors.LIGHT,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Dark'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.DARK,
                        ),
                        widthBorderOutline: 2.0,
                        color: LLSColors.DARK,
                        type: LLSButtonType.outline,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Link'),
                        icon: const Icon(
                          Icons.save
                        ),
                        widthBorderOutline: 2.0,
                        color: LLSColors.TRANSPARENT,
                        type: LLSButtonType.outline,
                      ),
                    )
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
              ],
            ),
          ),

          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Square Icons',
              type: LLSLabelType.typo5,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSCard(
            content: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                const SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Primary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        shape: LLSButtonShape.square,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Secondary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.SECONDARY,
                        shape: LLSButtonShape.square,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Success'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.SUCCESS,
                        shape: LLSButtonShape.square,
                      ),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Warning'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.WARNING,
                        shape: LLSButtonShape.square,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Danger'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.DANGER,
                        shape: LLSButtonShape.square,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Info'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.INFO,
                        shape: LLSButtonShape.square,
                      ),
                    )
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Light'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        type: LLSButtonType.solid,
                        color: LLSColors.LIGHT,
                        shape: LLSButtonShape.square,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text(
                          'Dark',
                          style: TextStyle(color: LLSColors.WHITE),
                        ),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.DARK,
                        shape: LLSButtonShape.square,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Link'),
                        icon: const Icon(
                          Icons.save,
                        ),
                        color: LLSColors.TRANSPARENT,
                        shape: LLSButtonShape.square,
                      ),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
              ],
            ),
          ),

          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Rounded Icons',
              type: LLSLabelType.typo5,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSCard(
            content: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                const SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Primary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Secondary'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.SECONDARY,
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Success'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.SUCCESS,
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Warning'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.WARNING,
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Danger'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.DANGER,
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Info'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.INFO,
                        shape: LLSButtonShape.rounded,
                      ),
                    )
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Light'),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        type: LLSButtonType.solid,
                        color: LLSColors.LIGHT,
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text(
                          'Dark',
                          style: TextStyle(color: LLSColors.WHITE),
                        ),
                        icon: const Icon(
                          Icons.save,
                          color: LLSColors.WHITE,
                        ),
                        color: LLSColors.DARK,
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    Expanded(
                      child: LLSButton(
                        onPressed: () {},
                        child: const Text('Link'),
                        icon: const Icon(
                          Icons.save,
                        ),
                        color: LLSColors.TRANSPARENT,
                        shape: LLSButtonShape.rounded,
                      ),
                    ),
                  ],
                ),
                const SizedBox(
                  height: 10,
                ),
              ],
            ),
          ),

          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Icons Only',
              type: LLSLabelType.typo5,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSCard(
            content: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    const SizedBox(
                      width: 6,
                    ),
                    LLSIconButton(
                      icon: const Icon(
                        Icons.save,
                      ),
                      onPressed: () {},
                      size: LLSSize.SMALL
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    LLSIconButton(
                      icon: const Icon(
                        Icons.save,
                      ),
                      onPressed: () {},
                      size: LLSSize.SMALL,
                      shape: LLSIconButtonShape.circle,
                      color: LLSColors.SECONDARY
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    LLSIconButton(
                      icon: const Icon(
                        Icons.save,
                      ),
                      onPressed: () {},
                      size: LLSSize.SMALL,
                      shape: LLSIconButtonShape.square,
                      color: LLSColors.WARNING
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    LLSIconButton(
                      icon: const Icon(
                        Icons.save,
                      ),
                      onPressed: () {},
                      size: LLSSize.SMALL,
                      color: LLSColors.SUCCESS,
                      type: LLSButtonType.outline
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                    LLSIconButton(
                      icon: const Icon(
                        Icons.save,
                      ),
                      onPressed: () {},
                      size: LLSSize.SMALL,
                      type: LLSButtonType.transparent
                    ),
                    const SizedBox(
                      width: 6,
                    ),
                  ]
                )
                
              ]
            )
          )
        ]
      )
    );
  }
}