shop-product.html 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. {{template "header.html" .}}
  2. <nav aria-label="breadcrumb">
  3. <ol class="breadcrumb">
  4. <li class="breadcrumb-item"><a href="/shop/">Shop</a></li>
  5. <li class="breadcrumb-item active"><a href="{{$.Data.Shop.Product.Permalink}}">{{$.Data.Shop.Product.Name}}</a></li>
  6. </ol>
  7. </nav>
  8. <div class="card mb-4">
  9. <div class="card-body product-full">
  10. <h2 class="card-title">{{$.Data.Shop.Product.Name}}</h2>
  11. <ul class="nav nav-tabs" id="myTab" role="tablist">
  12. <li class="nav-item">
  13. <a class="nav-link active" id="all-tab" data-toggle="tab" href="#all" role="tab" aria-controls="all" aria-selected="true">All about product</a>
  14. </li>
  15. <li class="nav-item">
  16. <a class="nav-link" id="specifications-tab" data-toggle="tab" href="#specifications" role="tab" aria-controls="specifications" aria-selected="false">Specifications</a>
  17. </li>
  18. </ul>
  19. <div class="tab-content" id="myTabContent">
  20. <div class="tab-pane no-fade pt-3 show active" id="all" role="tabpanel" aria-labelledby="all-tab">
  21. <div class="row">
  22. <div class="col-md-6">
  23. <div class="card">
  24. <img class="card-img-top" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22286%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20286%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16c7e5ac360%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A14pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16c7e5ac360%22%3E%3Crect%20width%3D%22286%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22107.0078125%22%20y%3D%2296.234375%22%3E286x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" alt="Card image cap">
  25. </div>
  26. </div>
  27. <div class="col-md-6">
  28. <div class="card mt-3 mt-sm-3 mt-md-0 mt-lg-0">
  29. <div class="card-body">
  30. <h3 class="price mb-0 mr-4">{{$.Data.Shop.Product.PriceFormat "%.2f"}} {{$.Data.Shop.Product.Currency.Code}}</h3><a href="" class="btn btn-success btn-buy">Buy</a>
  31. </div>
  32. </div>
  33. <div class="card mt-3">
  34. <div class="card-header">Payment</div>
  35. <div class="card-body">
  36. <p class="card-text">Non-cash, Cash</p>
  37. </div>
  38. </div>
  39. </div>
  40. </div>
  41. {{if ne $.Data.Shop.Product.Content ""}}
  42. <hr>
  43. <h3>Description</h3>
  44. <hr>
  45. <div class="product-description">
  46. {{$.Data.Shop.Product.Content}}
  47. </div>
  48. {{end}}
  49. <hr>
  50. <h3>Specifications</h3>
  51. <hr>
  52. <!-- <table class="table table-striped table-bordered mb-0 table-specifications">
  53. <tbody>
  54. <tr>
  55. <td class="tcol-1">Диагональ экрана</td>
  56. <td class="tcol-2">15.6" (1920x1080) Full HD</td>
  57. </tr>
  58. <tr>
  59. <td class="tcol-1">Процессор</td>
  60. <td class="tcol-2">Шестиядерный Intel Core i7-8750H (2.2 - 4.1 ГГц)</td>
  61. </tr>
  62. <tr>
  63. <td class="tcol-1">Частота обновления экрана</td>
  64. <td class="tcol-2">60 Гц</td>
  65. </tr>
  66. <tr>
  67. <td class="tcol-1">Объем оперативной памяти</td>
  68. <td class="tcol-2">8 ГБ</td>
  69. </tr>
  70. <tr>
  71. <td class="tcol-1">Операционная система</td>
  72. <td class="tcol-2">Windows 10 Home 64bit</td>
  73. </tr>
  74. <tr>
  75. <td class="tcol-1">Цвет</td>
  76. <td class="tcol-2">Черный</td>
  77. </tr>
  78. <tr>
  79. <td class="tcol-1">Поколение процессора Intel</td>
  80. <td class="tcol-2">8-ое Coffee Lake</td>
  81. </tr>
  82. <tr>
  83. <td class="tcol-1">Объём накопителя</td>
  84. <td class="tcol-2">1 ТБ + SSD 128 ГБ</td>
  85. </tr>
  86. </tbody>
  87. </table> -->
  88. </div>
  89. <div class="tab-pane no-fade pt-3" id="specifications" role="tabpanel" aria-labelledby="specifications-tab">
  90. <div class="row">
  91. <div class="col-md-8">
  92. <!-- <table class="table table-striped table-bordered mb-0 table-specifications">
  93. <tbody>
  94. <tr>
  95. <td class="tcol-1">Диагональ экрана</td>
  96. <td class="tcol-2">15.6" (1920x1080) Full HD</td>
  97. </tr>
  98. <tr>
  99. <td class="tcol-1">Процессор</td>
  100. <td class="tcol-2">Шестиядерный Intel Core i7-8750H (2.2 - 4.1 ГГц)</td>
  101. </tr>
  102. <tr>
  103. <td class="tcol-1">Частота обновления экрана</td>
  104. <td class="tcol-2">60 Гц</td>
  105. </tr>
  106. <tr>
  107. <td class="tcol-1">Объем оперативной памяти</td>
  108. <td class="tcol-2">8 ГБ</td>
  109. </tr>
  110. <tr>
  111. <td class="tcol-1">Операционная система</td>
  112. <td class="tcol-2">Windows 10 Home 64bit</td>
  113. </tr>
  114. <tr>
  115. <td class="tcol-1">Цвет</td>
  116. <td class="tcol-2">Черный</td>
  117. </tr>
  118. <tr>
  119. <td class="tcol-1">Поколение процессора Intel</td>
  120. <td class="tcol-2">8-ое Coffee Lake</td>
  121. </tr>
  122. <tr>
  123. <td class="tcol-1">Объём накопителя</td>
  124. <td class="tcol-2">1 ТБ + SSD 128 ГБ</td>
  125. </tr>
  126. </tbody>
  127. </table> -->
  128. </div>
  129. <div class="col-md-4">
  130. <div class="card mt-3 mt-sm-3 mt-md-0 mt-lg-0">
  131. <div class="card-body">
  132. <img class="card-img-top" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22286%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20286%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16c7e5ac360%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A14pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16c7e5ac360%22%3E%3Crect%20width%3D%22286%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22107.0078125%22%20y%3D%2296.234375%22%3E286x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" alt="Card image cap">
  133. </div>
  134. </div>
  135. <div class="card mt-3">
  136. <div class="card-body">
  137. <h3 class="price mb-0 mr-4">{{$.Data.Shop.Product.PriceFormat "%.2f"}} {{$.Data.Shop.Product.Currency.Code}}</h3><a href="" class="btn btn-success btn-buy">Buy</a>
  138. </div>
  139. </div>
  140. </div>
  141. </div>
  142. </div>
  143. </div>
  144. </div>
  145. </div>
  146. {{template "footer.html" .}}