part of 'pages.dart';

class AccordionPage extends StatefulWidget {
  const AccordionPage({ Key? key }) : super(key: key);
  static const routeName = '/accordion_page';

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

class _AccordionPageState extends State<AccordionPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: LLSColors.PRIMARY,
        leading: InkWell(
          onTap: () {
            Navigator.pop(context);
          },
          child: Icon(
            CupertinoIcons.back,
            color: LLSColors.WHITE,
          ),
        ),
        title: const Text(
          'Accordion',
          style: TextStyle(fontSize: 17),
        ),
        centerTitle: true,
      ),
      body: ListView(
        children: <Widget>[
          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Basic Accordion',
              type: LLSLabelType.typo4,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSAccordion(
              titleBorder: Border(
                top: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                left: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                right: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                bottom: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
              ),
              titleExpandedBorderRadius: BorderRadius.only(
                topRight: Radius.circular(8),
                topLeft: Radius.circular(8)
              ),
              titleCollapsedBorderRadius: BorderRadius.all(Radius.circular(8)),
              contentBorder: Border(
                top: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                bottom: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                left: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                right: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
              ),
              contentBorderRadius: BorderRadius.only(
                bottomRight: Radius.circular(8),
                bottomLeft: Radius.circular(8)
              ),
              title: 'What is Locator Logic?',
              content:
                  'Locator Logic is a powerful and unique analytic tool, created based on Indonesian market demand. Becoming and remaining successful in a constantly changing environment, requires more and better data.'),
          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Accordion with Text',
              type: LLSLabelType.typo5,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSAccordion(
              titleBorder: Border(
                top: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                left: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                right: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                bottom: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
              ),
              titleExpandedBorderRadius: BorderRadius.only(
                topRight: Radius.circular(8),
                topLeft: Radius.circular(8)
              ),
              titleCollapsedBorderRadius: BorderRadius.all(Radius.circular(8)),
              contentBorder: Border(
                top: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                bottom: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                left: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
                right: BorderSide(
                    color: Colors.black.withOpacity(0.2), width: 0.5),
              ),
              contentBorderRadius: BorderRadius.only(
                bottomRight: Radius.circular(8),
                bottomLeft: Radius.circular(8)
              ),
              title: 'What is Locator Logic?',
              content:
                  'Locator Logic is a powerful and unique analytic tool, created based on Indonesian market demand. Becoming and remaining successful in a constantly changing environment, requires more and better data.',
              collapsedIcon: const Text('Show'),
              expandedIcon: const Text(
                'Hide',
                style: TextStyle(color: Colors.red),
              )),
          const Padding(
            padding: EdgeInsets.only(left: 15, top: 30),
            child: LLSLabel(
              text: 'Accordion with Icon',
              type: LLSLabelType.typo5,
              dividerWidth: 25,
              dividerColor: LLSColors.SECONDARY,
            ),
          ),
          LLSAccordion(
            titleBorder: Border(
              top: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
              left: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
              right: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
              bottom: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
            ),
            titleExpandedBorderRadius: BorderRadius.only(
              topRight: Radius.circular(8),
              topLeft: Radius.circular(8)
            ),
            titleCollapsedBorderRadius: BorderRadius.all(Radius.circular(8)),
            contentBorder: Border(
              top: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
              bottom: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
              left: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
              right: BorderSide(
                  color: Colors.black.withOpacity(0.2), width: 0.5),
            ),
            contentBorderRadius: BorderRadius.only(
              bottomRight: Radius.circular(8),
              bottomLeft: Radius.circular(8)
            ),
            title: 'What is Locator Logic?',
            content:
                'Locator Logic is a powerful and unique analytic tool, created based on Indonesian market demand. Becoming and remaining successful in a constantly changing environment, requires more and better data.',
            collapsedIcon: Icon(Icons.add_circle_outline),
            expandedIcon: Icon(
              Icons.remove_circle_outline,
              color: Colors.red,
            ),
          ),
        ],
      ),
    );
  }
}