Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

149 Zeilen
8.8 KiB

  1. import React from 'react';
  2. import {
  3. Accordion,
  4. AccordionItem,
  5. AccordionItemHeading,
  6. AccordionItemPanel,
  7. AccordionItemButton
  8. } from 'react-accessible-accordion';
  9. const OrderSummary = () => {
  10. return (
  11. <>
  12. <div className="faq-area ptb-80">
  13. <div className="container">
  14. <div className="faq-accordion">
  15. <Accordion allowZeroExpanded preExpanded={['a']}>
  16. <AccordionItem uuid="a">
  17. <AccordionItemHeading>
  18. <AccordionItemButton>
  19. <span>
  20. Nomer Pemesanan - Pesanan Sedang di Proses
  21. </span>
  22. </AccordionItemButton>
  23. </AccordionItemHeading>
  24. <AccordionItemPanel>
  25. <p>
  26. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua.
  27. </p>
  28. </AccordionItemPanel>
  29. </AccordionItem>
  30. <AccordionItem uuid="b">
  31. <AccordionItemHeading>
  32. <AccordionItemButton>
  33. <span>
  34. Is Smart Lock required for instant apps?
  35. </span>
  36. </AccordionItemButton>
  37. </AccordionItemHeading>
  38. <AccordionItemPanel>
  39. <p>
  40. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua.
  41. </p>
  42. </AccordionItemPanel>
  43. </AccordionItem>
  44. <AccordionItem uuid="c">
  45. <AccordionItemHeading>
  46. <AccordionItemButton>
  47. <span>
  48. Can I have multiple activities in a single feature?
  49. </span>
  50. </AccordionItemButton>
  51. </AccordionItemHeading>
  52. <AccordionItemPanel>
  53. <p>
  54. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua.
  55. </p>
  56. </AccordionItemPanel>
  57. </AccordionItem>
  58. <AccordionItem uuid="d">
  59. <AccordionItemHeading>
  60. <AccordionItemButton>
  61. <span>
  62. Can I share resources between features?
  63. </span>
  64. </AccordionItemButton>
  65. </AccordionItemHeading>
  66. <AccordionItemPanel>
  67. <p>
  68. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua.
  69. </p>
  70. </AccordionItemPanel>
  71. </AccordionItem>
  72. <AccordionItem uuid="e">
  73. <AccordionItemHeading>
  74. <AccordionItemButton>
  75. <span>
  76. Is multidex supported for instant apps?
  77. </span>
  78. </AccordionItemButton>
  79. </AccordionItemHeading>
  80. <AccordionItemPanel>
  81. <p>
  82. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua.
  83. </p>
  84. </AccordionItemPanel>
  85. </AccordionItem>
  86. <AccordionItem uuid="f">
  87. <AccordionItemHeading>
  88. <AccordionItemButton>
  89. <span>
  90. Can I share resources between features?
  91. </span>
  92. </AccordionItemButton>
  93. </AccordionItemHeading>
  94. <AccordionItemPanel>
  95. <p>
  96. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. incididunt ut labore et dolore magna aliqua.
  97. </p>
  98. </AccordionItemPanel>
  99. </AccordionItem>
  100. </Accordion>
  101. </div>
  102. <div className="faq-contact">
  103. <h3>Ask Your Question</h3>
  104. <form>
  105. <div className="row">
  106. <div className="col-lg-6 col-md-6">
  107. <div className="form-group">
  108. <input type="text" placeholder="Name" className="form-control" />
  109. </div>
  110. </div>
  111. <div className="col-lg-6 col-md-6">
  112. <div className="form-group">
  113. <input type="email" placeholder="Email" className="form-control" />
  114. </div>
  115. </div>
  116. <div className="col-lg-12 col-md-12">
  117. <div className="form-group">
  118. <input type="text" placeholder="Subject" className="form-control" />
  119. </div>
  120. </div>
  121. <div className="col-lg-12 col-md-12">
  122. <div className="form-group">
  123. <textarea name="message" cols="30" rows="6" placeholder="Message" className="form-control"></textarea>
  124. </div>
  125. </div>
  126. <div className="col-lg-12 col-md-12">
  127. <button className="btn btn-primary" type="submit">Submit Now!</button>
  128. </div>
  129. </div>
  130. </form>
  131. </div>
  132. </div>
  133. </div>
  134. </>
  135. )
  136. }
  137. export default OrderSummary;