{"version":3,"sources":["webpack://appvity-website/./src/components/ContextAwareToggle.js","webpack://appvity-website/./src/pages/services/software-development.js"],"names":["children","eventKey","callback","currentEventKey","useContext","AccordionContext","decoratedOnClick","useAccordionToggle","isCurrentEventKey","className","type","onClick","Software","props","componentDidMount","document","querySelector","classList","add","render","data","this","introduction","allMarkdownRemark","nodes","web_portal","msteam_platform","azure_logic","mobile","cycle","world_trusted_technologies","sample_projects","settings","dots","speed","autoplay","infinite","slidesToShow","slidesToScroll","title","description","meta","name","content","pathname","data-sal","data-sal-duration","data-sal-delay","data-sal-easing","xs","md","lg","map","res","dangerouslySetInnerHTML","__html","html","key","id","src","alt","frontmatter","slug","onMouseOver","remove","onFocus","thumb","publicURL","defaultActiveKey","variant","fluid","childImageSharp","React"],"mappings":"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","file":"component---src-pages-services-software-development-js-1740318605e41f78f0ae.js","sourcesContent":["import React, { useContext } from \"react\";\r\nimport { useAccordionToggle, AccordionContext } from 'react-bootstrap'\r\n\r\nconst ContextAwareToggle = ({ children, eventKey, callback }) => {\r\n    const currentEventKey = useContext(AccordionContext);\r\n  \r\n    const decoratedOnClick = useAccordionToggle(\r\n      eventKey,\r\n      () => callback && callback(eventKey),\r\n    );\r\n  \r\n    const isCurrentEventKey = currentEventKey === eventKey;\r\n  \r\n    return (\r\n        <ul>\r\n            <li className={isCurrentEventKey ? 'active' : ''}>\r\n                <button\r\n                    type=\"button\"\r\n                    className={isCurrentEventKey ? 'active' : ''}\r\n                    onClick={decoratedOnClick}\r\n                >\r\n                    {children}\r\n                </button>\r\n            </li>\r\n      </ul>\r\n    );\r\n}\r\n\r\nexport default ContextAwareToggle","import React from \"react\";\r\nimport { graphql } from \"gatsby\";\r\nimport { Container, Row, Col, Tab, Nav, Accordion } from \"react-bootstrap\";\r\nimport Layout from \"../../components/Layout\";\r\nimport Slider from \"react-slick\";\r\nimport Img from \"gatsby-image\";\r\nimport ContextAwareToggle from \"../../components/ContextAwareToggle\";\r\nimport SEO from \"../../components/SEO\";\r\n\r\nclass Software extends React.Component {\r\n    constructor(props) {\r\n        super(props);\r\n    }\r\n\r\n    componentDidMount() {\r\n        document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.add('active');\r\n    }\r\n\r\n    render() {    \r\n        const { data } = this.props;\r\n        const introduction = data.allMarkdownRemark.nodes;\r\n        const web_portal = data.web_portal.nodes;\r\n        const msteam_platform = data.msteam_platform.nodes;\r\n        const azure_logic = data.azure_logic.nodes;\r\n        const mobile = data.mobile.nodes;\r\n        const cycle = data.cycle.nodes;\r\n        const world_trusted_technologies = data.world_trusted_technologies.nodes;\r\n        const sample_projects = data.sample_projects.nodes;\r\n\r\n        const settings = {\r\n            dots: false,\r\n            speed: 500,\r\n            autoplay: false,\r\n            infinite: false,\r\n            slidesToShow: 1,\r\n            slidesToScroll: 1\r\n        };\r\n\r\n        return (\r\n            <Layout>\r\n                <SEO title=\"Software Development Service\" description=\"Appvity provides full-cycle consulting from business analysis, requirements, development, and support. Our development service focuses on Office 365, Azure, SharePoint, and Power platform.\" meta={[{ name: `keywords`, content: [\"SharePoint based app\", \"Appvity software developement service\", \"app on Microsoft technologies\", \"build tools on Microsoft Teams\", \"task management\"] }]} pathname=\"/services/software-development\" />\r\n                <div className=\"main-content-padding\">\r\n                    <div className=\"app-general-seciton app-software-development-introduction\" data-sal=\"fade\" data-sal-duration=\"1000\" data-sal-delay=\"100\" data-sal-easing=\"ease\">\r\n                        <Container>\r\n                            <div className=\"app-software-development-introduction-detail\">\r\n                                <Row className=\"app-software-development-introduction-row-custom\">\r\n                                    <Col className=\"app-software-development-introduction-col-custom\" xs={12} md={12} lg={5}>\r\n                                        {introduction.map((res) => (\r\n                                            <div className=\"app-software-development-introduction-left\" dangerouslySetInnerHTML={{ __html: res.html }} key={res.id} />\r\n                                        ))}\r\n                                    </Col>\r\n                                    <Col xs={12} md={12} lg={1}></Col>\r\n                                    <Col className=\"app-software-development-introduction-col-custom\" xs={12} md={12} lg={6}>\r\n                                        <div className=\"app-software-development-introduction-right\">\r\n                                            <img className=\"app-software-development-introduction-img\" src=\"/app-software-development-introduction.png\" alt=\"software development introduction\" />\r\n                                        </div>\r\n                                    </Col>\r\n                                </Row>\r\n                            </div>\r\n                        </Container>\r\n                    </div>\r\n                    <div className=\"app-general-seciton app-software-core-competencies\" data-sal=\"fade\" data-sal-duration=\"1000\" data-sal-delay=\"100\" data-sal-easing=\"ease\">\r\n                        <Container>\r\n                            <div className=\"app-title\">\r\n                                <h2>Software Core Competencies</h2>\r\n                            </div>\r\n                            <div className=\"app-software-core-competencies-detail\">\r\n                                <Row>\r\n                                    <Col xs={12} md={12} lg={6}>\r\n                                        <Row>\r\n                                            <Col xs={12} md={12} lg={6}>\r\n                                                {web_portal.map((res) => (\r\n                                                    <div className=\"app-software-core-competencies-detail-content app-web-portal\" dangerouslySetInnerHTML={{ __html: res.html }} key={res.id} />\r\n                                                ))}\r\n                                            </Col>\r\n                                            <Col xs={12} md={12} lg={6}>\r\n                                                {msteam_platform.map((res) => (\r\n                                                    <div className=\"app-software-core-competencies-detail-content app-msteam-platform\" dangerouslySetInnerHTML={{ __html: res.html }} key={res.id} />\r\n                                                ))}\r\n                                            </Col>\r\n                                        </Row>\r\n                                    </Col>\r\n                                    <Col xs={12} md={12} lg={6}>\r\n                                        <Row>\r\n                                            <Col xs={12} md={12} lg={6}>\r\n                                                {azure_logic.map((res) => (\r\n                                                    <div className=\"app-software-core-competencies-detail-content app-azure-logic\" dangerouslySetInnerHTML={{ __html: res.html }} key={res.id} />\r\n                                                ))}\r\n                                            </Col>\r\n                                            <Col xs={12} md={12} lg={6}>\r\n                                                {mobile.map((res) => (\r\n                                                    <div className=\"app-software-core-competencies-detail-content app-mobile\" dangerouslySetInnerHTML={{ __html: res.html }} key={res.id} />\r\n                                                ))}\r\n                                            </Col>\r\n                                        </Row>\r\n                                    </Col>\r\n                                </Row>\r\n                            </div>\r\n                        </Container>\r\n                    </div>\r\n                    <div className=\"app-general-seciton app-development-cycle\" data-sal=\"fade\" data-sal-duration=\"1000\" data-sal-delay=\"100\" data-sal-easing=\"ease\">\r\n                        <Container>\r\n                            <div className=\"app-title\">\r\n                                <h2>Development Cycle</h2>\r\n                            </div>\r\n                            <div className=\"app-development-cycle-detail\">\r\n                                <div className=\"app-development-cycle-pc\">\r\n                                    <Row>\r\n                                        <Col xs={12} md={12} lg={8}>\r\n                                            {cycle.map((res) => (\r\n                                                <div \r\n                                                    className={res.frontmatter.slug + \" \" + \"app-development-cycle-pc-item\"} \r\n                                                    key={res.id}\r\n                                                    onMouseOver={() => {\r\n                                                        if (res.frontmatter.slug === \"discovery-analyze\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"design\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"development\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"quality-assurance\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"migration\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"training-support\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.add('active');\r\n                                                        }\r\n                                                    }}\r\n                                                    onFocus={() => {\r\n                                                        if (res.frontmatter.slug === \"discovery-analyze\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"design\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"development\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"quality-assurance\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"migration\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.add('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.remove('active');\r\n                                                        } else if (res.frontmatter.slug === \"training-support\") {\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.discovery-analyze').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.design').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.development').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.quality-assurance').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.migration').classList.remove('active');\r\n                                                            document.querySelector('.app-development-cycle .app-development-cycle-detail .app-development-cycle-pc img.training-support').classList.add('active');\r\n                                                        }\r\n                                                    }}\r\n                                                >\r\n                                                    <h4>{res.frontmatter.title}</h4>\r\n                                                    <div dangerouslySetInnerHTML={{ __html: res.html }} />\r\n                                                </div>\r\n                                            ))}\r\n                                        </Col>\r\n                                        <Col xs={12} md={12} lg={4}>\r\n                                            {cycle.map((res) => (\r\n                                                <img className={res.frontmatter.slug} src={res.frontmatter.thumb.publicURL} alt=\"app software development service cycle img\" key={res.id} />\r\n                                            ))}\r\n                                        </Col>\r\n                                    </Row>\r\n                                </div>\r\n                                <div className=\"app-development-cycle-mobile-tablet\">\r\n                                    <Slider {...settings}>\r\n                                        {cycle.map((res) => (\r\n                                            <div className=\"app-development-cycle-mobile-tablet-item\" key={res.id}>\r\n                                                <h4>{res.frontmatter.title}</h4>\r\n                                                <div dangerouslySetInnerHTML={{ __html: res.html }} />\r\n                                                <img src={res.frontmatter.thumb.publicURL} alt=\"app software development service cycle img\" />\r\n                                            </div>\r\n                                        ))}\r\n                                    </Slider>\r\n                                </div>\r\n                            </div>\r\n                        </Container>\r\n                    </div>\r\n                    <div className=\"app-general-seciton app-world-trusted-technologies\" data-sal=\"fade\" data-sal-duration=\"1000\" data-sal-delay=\"100\" data-sal-easing=\"ease\">\r\n                        <Container>\r\n                            <div className=\"app-title\">\r\n                                <h2>Implemented by World Trusted Technologies</h2>\r\n                            </div>\r\n                            <div className=\"app-world-trusted-technologies-detail\">\r\n                                <Row>\r\n                                    {world_trusted_technologies.map((res) => (\r\n                                        <Col xs={12} md={12} lg={4} key={res.id}>\r\n                                            <div className=\"app-world-trusted-technologies-detail-content\" dangerouslySetInnerHTML={{ __html: res.html }} />\r\n                                        </Col>\r\n                                    ))}\r\n                                </Row>\r\n                            </div>\r\n                        </Container>\r\n                    </div>\r\n                    <div className=\"app-general-seciton app-sample-software-development-projects\" data-sal=\"fade\" data-sal-duration=\"1000\" data-sal-delay=\"100\" data-sal-easing=\"ease\">\r\n                        <Container>\r\n                            <div className=\"app-title\">\r\n                                <h2>Sample Software Development Projects</h2>\r\n                            </div>\r\n                            <div className=\"app-sample-software-development-projects-detail\">\r\n                                <div className=\"app-sample-software-development-projects-pc\">\r\n                                    <Tab.Container id=\"left-tabs-example\" defaultActiveKey=\"collaboration-portal\">\r\n                                        <Row>\r\n                                            <Col xs={12} md={12} lg={3}>\r\n                                                <Nav variant=\"pills\" className=\"flex-column\">\r\n                                                    {sample_projects.map((res) => (\r\n                                                        <Nav.Item key={res.id}>\r\n                                                            <Nav.Link eventKey={res.frontmatter.slug}>{res.frontmatter.title}</Nav.Link>\r\n                                                        </Nav.Item>\r\n                                                    ))}\r\n                                                </Nav>\r\n                                            </Col>\r\n                                            <Col xs={12} md={12} lg={1}></Col>\r\n                                            <Col xs={12} md={12} lg={8}>\r\n                                                <Tab.Content>\r\n                                                    {sample_projects.map((res) => (\r\n                                                        <Tab.Pane eventKey={res.frontmatter.slug} key={res.id}>\r\n                                                            <Row>\r\n                                                                <Col xs={12} md={12} lg={7}>\r\n                                                                    <div dangerouslySetInnerHTML={{ __html: res.html }} />\r\n                                                                </Col>\r\n                                                                <Col xs={12} md={12} lg={5}>\r\n                                                                    <Img\r\n                                                                        fluid={\r\n                                                                            res.frontmatter\r\n                                                                                .thumb\r\n                                                                                .childImageSharp\r\n                                                                                .fluid\r\n                                                                        }\r\n                                                                    />\r\n                                                                </Col>\r\n                                                            </Row>\r\n                                                        </Tab.Pane>\r\n                                                    ))}\r\n                                                </Tab.Content>\r\n                                            </Col>\r\n                                        </Row>\r\n                                    </Tab.Container>\r\n                                </div>\r\n                                <div className=\"app-sample-software-development-projects-mobile-tablet\">\r\n                                    <Accordion defaultActiveKey=\"collaboration-portal\">\r\n                                        {sample_projects.map((res) => (\r\n                                            <div className=\"app-sample-software-development-projects-mobile-tablet-content\" key={res.id}>\r\n                                                <div className=\"app-sample-software-development-projects-mobile-tablet-header\">\r\n                                                    <ContextAwareToggle\r\n                                                        eventKey={res.frontmatter.slug}\r\n                                                    >\r\n                                                        <h6>{res.frontmatter.title}</h6>\r\n                                                    </ContextAwareToggle>\r\n                                                </div>\r\n                                                <Accordion.Collapse eventKey={res.frontmatter.slug}>\r\n                                                    <div className=\"app-sample-software-development-projects-mobile-tablet-body\">\r\n                                                        <div dangerouslySetInnerHTML={{ __html: res.html }} />\r\n                                                        <Img\r\n                                                            fluid={\r\n                                                                res.frontmatter\r\n                                                                    .thumb\r\n                                                                    .childImageSharp\r\n                                                                    .fluid\r\n                                                            }\r\n                                                        />\r\n                                                    </div>\r\n                                                </Accordion.Collapse>\r\n                                            </div>\r\n                                        ))}\r\n                                    </Accordion>\r\n                                </div>\r\n                            </div>\r\n                        </Container>\r\n                    </div>\r\n                </div>\r\n            </Layout>\r\n        )\r\n    }\r\n}\r\n\r\nexport default Software;\r\n\r\nexport const query = graphql`\r\n    query SoftwareDevelopmentService {\r\n        allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_introduction\" } } }\r\n        ) {\r\n            nodes {\r\n                html\r\n                id\r\n            }\r\n        }\r\n        web_portal: allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_web_portal\" } } }\r\n        ) {\r\n            nodes {\r\n                html\r\n                id\r\n            }\r\n        }\r\n        msteam_platform: allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_msteam_platform\" } } }\r\n        ) {\r\n            nodes {\r\n                html\r\n                id\r\n            }\r\n        }\r\n        azure_logic: allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_azure_logic\" } } }\r\n        ) {\r\n            nodes {\r\n                html\r\n                id\r\n            }\r\n        }\r\n        mobile: allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_mobile\" } } }\r\n        ) {\r\n            nodes {\r\n                html\r\n                id\r\n            }\r\n        }\r\n        cycle: allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_cycle\" } } }\r\n            sort: { fields: frontmatter___createAt, order: ASC }\r\n        ) {\r\n            nodes {\r\n                html\r\n                frontmatter {\r\n                    title\r\n                    slug\r\n                    thumb {\r\n                        publicURL\r\n                    }\r\n                }\r\n                id\r\n            }\r\n        }\r\n        world_trusted_technologies: allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_world_trusted_technologies\" } } }\r\n            sort: { fields: frontmatter___createAt, order: ASC }\r\n        ) {\r\n            nodes {\r\n                html\r\n                id\r\n            }\r\n        }\r\n        sample_projects: allMarkdownRemark(\r\n            filter: { frontmatter: { directory: { eq: \"software_development_service_sample_projects\" } } }\r\n            sort: { fields: frontmatter___createAt, order: ASC }\r\n        ) {\r\n            nodes {\r\n                html\r\n                frontmatter {\r\n                    title\r\n                    slug\r\n                    thumb {\r\n                        childImageSharp {\r\n                            fluid {\r\n                                ...GatsbyImageSharpFluid\r\n                            }\r\n                        }\r\n                    }\r\n                }\r\n                id\r\n            }\r\n        }\r\n    }\r\n`;"],"sourceRoot":""}