選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

58 行
2.7 KiB

  1. import React from 'react';
  2. import * as Icon from 'react-feather';
  3. const QuickViewModal = () => {
  4. return (
  5. <div className="modal fade" id="productsModalCenter">
  6. <div className="modal-dialog modal-dialog-centered">
  7. <div className="modal-content">
  8. <button type="button" className="close">
  9. <span aria-hidden="true">&times;</span>
  10. </button>
  11. <div className="row align-items-center">
  12. <div className="col-lg-6 col-md-6 col-sm-6">
  13. <div className="products-image">
  14. <img src="/images/shop-image/shop-image1.jpg" alt="image" />
  15. </div>
  16. </div>
  17. <div className="col-lg-6 col-md-6 col-sm-6">
  18. <div className="products-content">
  19. <h3>Wood Pencil</h3>
  20. <div className="price">
  21. <span>$200.00</span> $191.00
  22. </div>
  23. <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
  24. <form>
  25. <div className="quantity">
  26. <div className="input-counter">
  27. <span className="minus-btn">
  28. <Icon.Minus />
  29. </span>
  30. <input type="text" min="1" value="1" />
  31. <span className="plus-btn">
  32. <Icon.Plus />
  33. </span>
  34. </div>
  35. </div>
  36. <button type="submit">Add to Cart</button>
  37. </form>
  38. <div className="product-meta">
  39. <span>Category: <a href="#">Pencil</a></span>
  40. <span>Tag: <a href="#">Prints</a></span>
  41. </div>
  42. </div>
  43. </div>
  44. </div>
  45. </div>
  46. </div>
  47. </div>
  48. )
  49. }
  50. export default QuickViewModal;