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

productcatlogue.html 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  7. <link rel="shortcut icon" type="image/x-icon" href="./dist/assets/imgs/favicon.gif">
  8. <link rel="stylesheet" href="./libs/bootstrap/css/bootstrap.min.css" />
  9. <link rel="stylesheet" href="./dist/css/main.css" />
  10. <link rel="stylesheet" href="./style.css">
  11. <link rel="stylesheet" href="./libs/owlcarousel/Css/owl.carousel.min.css">
  12. <link rel="stylesheet" href="./libs/owlcarousel/Css/owl.theme.default.min.css">
  13. <link rel="stylesheet" href="./dist/css/vendor/bootstrap.min.css">
  14. <link rel="stylesheet" href="./dist/css/vendor/bootstrap.min.css">
  15. <link rel="stylesheet" href="./dist/css/vendor/vandella.css">
  16. <link rel="stylesheet" href="./dist/css/vendor/jellybelly.css">
  17. <link rel="stylesheet" href="./dist/css/vendor/fontello.css">
  18. <link rel="stylesheet" href="./dist/css/plugins/easyzoom.css">
  19. <link rel="stylesheet" href="./dist/css/plugins/slick.css">
  20. <link rel="stylesheet" href="./dist/css/plugins/nice-select.css">
  21. <link rel="stylesheet" href="./dist/css/plugins/animate.css">
  22. <link rel="stylesheet" href="./dist/css/plugins/magnific-popup.css">
  23. <link rel="stylesheet" href="./dist/css/plugins/jquery-ui.css">
  24. <link rel="stylesheet" href="./dist/css/style.css">
  25. <link rel="stylesheet" href="./dist/css/fontawesome.all.min.css">
  26. <link rel="stylesheet" href="./dist/css/fontawesome.min.css">
  27. <title>Press Releases | Anwi</title>
  28. <style>
  29. .card:hover{
  30. box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
  31. }
  32. .card:hover img{
  33. transform: scale(1.1);
  34. /* rotate: 10deg; */
  35. }
  36. .card:hover .btn{
  37. background-color: #000 !important;
  38. color:#ffff !important;
  39. }
  40. .card-title{
  41. font-size: 1.2rem;
  42. }
  43. </style>
  44. </head>
  45. <body class="media_page">
  46. <!-- navbar -->
  47. <div id="navbar-head" class=></div>
  48. <!-- end-navbar -->
  49. <!-- main-body -->
  50. <main class="main-body home-main-container">
  51. <section class="pt-2 ramsContainer " id="ora_products">
  52. <div class="products-container container pb-5" id="pills-tabContent">
  53. <div class="text-center pb-md-5 mb-md-5">
  54. <span class="bg-black fs-5 px-md-4 py-md-2 py-2 px-4 rounded-3 text-white">Join the future with Anwi Systems</span>
  55. </div>
  56. <div class="row product_card_section">
  57. <div class="col-lg-4 col-md-6 col-md-6 product_catlogue_card cursor-pointer pb-md-4" data_product="zenosleekbook14">
  58. <div class="card border bg-gray-3 rounded-3 p-1 h-100">
  59. <img src="./dist/assets/imgs/allin_imgs/preview-front1.png" class="card-img-top" alt="...">
  60. <div class="card-body">
  61. <h5 class="card-title satoshi_font mb-0">Zeno Sleekbook 14.1 inch </h5>
  62. </div>
  63. <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
  64. <li class="border-0 py-0">
  65. <span class="satoshi_font">8GB DDR4</span>
  66. </li>
  67. <li class="border-0 py-0">
  68. <span class="satoshi_font">3200 Mhz</span>
  69. </li>
  70. </ul>
  71. <div class="card-body text-center">
  72. <a href="#" class="btn bg-white font-1-2 px-5 w-100 satoshi_font">Details </a>
  73. </div>
  74. </div>
  75. </div>
  76. <div class="col-lg-4 col-md-6 col-md-6 product_catlogue_card cursor-pointer pb-md-4" data_product="zenosleekbook14touch">
  77. <div class="card border bg-gray-3 rounded-3 p-1 h-100">
  78. <img src="./dist/assets/imgs/allin_imgs/preview-front1.png" class="card-img-top" alt="...">
  79. <div class="card-body">
  80. <h5 class="card-title satoshi_font mb-0">Zeno Sleekbook 14.1 inch Touch Screen 360<sup>o</sup> flip</h5>
  81. </div>
  82. <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
  83. <li class="border-0 py-0">
  84. <span class="satoshi_font">8GB DDR4</span>
  85. </li>
  86. <li class="border-0 py-0">
  87. <span class="satoshi_font">3200 Mhz</span>
  88. </li>
  89. </ul>
  90. <div class="card-body text-center">
  91. <a href="#" class="btn bg-white font-1-2 px-5 w-100 satoshi_font">Details </a>
  92. </div>
  93. </div>
  94. </div>
  95. <div class="col-lg-4 col-md-6 col-md-6 product_catlogue_card cursor-pointer pb-md-4" data_product="zenosleekbook15">
  96. <div class="card border bg-gray-3 rounded-3 p-1 h-100">
  97. <img src="./dist/assets/imgs/allin_imgs/preview-front1.png" class="card-img-top" alt="...">
  98. <div class="card-body">
  99. <h5 class="card-title satoshi_font mb-0">Zeno Sleekbook 15.6 inch</h5>
  100. </div>
  101. <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
  102. <li class="border-0 py-0">
  103. <span class="satoshi_font">8GB DDR4</span>
  104. </li>
  105. <li class="border-0 py-0">
  106. <span class="satoshi_font">3200 Mhz</span>
  107. </li>
  108. </ul>
  109. <div class="card-body text-center">
  110. <a href="#" class="btn bg-white font-1-2 px-5 w-100 satoshi_font">Details </a>
  111. </div>
  112. </div>
  113. </div>
  114. <div class="col-lg-4 col-md-6 col-md-6 product_catlogue_card cursor-pointer pb-md-4" data_product="zenodualbook16">
  115. <div class="card border bg-gray-3 rounded-3 p-1 h-100">
  116. <img src="./dist/assets/imgs/allin_imgs/preview-front1.png" class="card-img-top" alt="...">
  117. <div class="card-body">
  118. <h5 class="card-title satoshi_font mb-0">Zeno Dualbook 16 inch</h5>
  119. </div>
  120. <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
  121. <li class="border-0 py-0">
  122. <span class="satoshi_font">8GB DDR4</span>
  123. </li>
  124. <li class="border-0 py-0">
  125. <span class="satoshi_font">3200 Mhz</span>
  126. </li>
  127. </ul>
  128. <div class="card-body text-center">
  129. <a href="#" class="btn bg-white font-1-2 px-5 w-100 satoshi_font">Details </a>
  130. </div>
  131. </div>
  132. </div>
  133. <div class="col-lg-4 col-md-6 col-md-6 product_catlogue_card cursor-pointer pb-md-4" data_product="zenodualbook21">
  134. <div class="card border bg-gray-3 rounded-3 p-1 h-100">
  135. <img src="./dist/assets/imgs/allin_imgs/preview-front1.png" class="card-img-top" alt="...">
  136. <div class="card-body">
  137. <h5 class="card-title satoshi_font mb-0">Zeno Dualbook 16 inch</h5>
  138. </div>
  139. <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
  140. <li class="border-0 py-0">
  141. <span class="satoshi_font">8GB DDR4</span>
  142. </li>
  143. <li class="border-0 py-0">
  144. <span class="satoshi_font">3200 Mhz</span>
  145. </li>
  146. </ul>
  147. <div class="card-body text-center">
  148. <a href="#" class="btn bg-white font-1-2 px-5 w-100 satoshi_font">Details </a>
  149. </div>
  150. </div>
  151. </div>
  152. <div class="col-lg-4 col-md-6 col-md-6 product_catlogue_card cursor-pointer pb-md-4" data_product="zenodualbook23">
  153. <div class="card border bg-gray-3 rounded-3 p-1 h-100">
  154. <img src="./dist/assets/imgs/allin_imgs/preview-front1.png" class="card-img-top" alt="...">
  155. <div class="card-body">
  156. <h5 class="card-title satoshi_font mb-0">Zeno Dualbook 16 inch</h5>
  157. </div>
  158. <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
  159. <li class="border-0 py-0">
  160. <span class="satoshi_font">8GB DDR4</span>
  161. </li>
  162. <li class="border-0 py-0">
  163. <span class="satoshi_font">3200 Mhz</span>
  164. </li>
  165. </ul>
  166. <div class="card-body text-center">
  167. <a href="#" class="btn bg-white font-1-2 px-5 w-100 satoshi_font">Details </a>
  168. </div>
  169. </div>
  170. </div>
  171. </div>
  172. </div>
  173. </section>
  174. </main>
  175. <!-- footer -->
  176. <div id="footer-head" class=""></div>
  177. <!-- end-footer -->
  178. <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
  179. <script src="./dist/js/jquery.min.js"></script>
  180. <script src="./libs/owlcarousel/js/owl.carousel.min.js"></script>
  181. <script src="./dist/js/axios.min.js"></script>
  182. <script src="./dist/js/footer.js"></script>
  183. <script src="./libs/cookies.min.js"></script>
  184. <script src="./dist/js/fontawesome.all.js"></script>
  185. <script src="./dist/js/fontawesome.min.js"></script>
  186. <script src="./dist/js/vendor/modernizr-3.11.7.min.js"></script>
  187. <script src="./dist/js/vendor/jquery-v3.6.0.min.js"></script>
  188. <script src="./dist/js/vendor/jquery-migrate-v3.3.2.min.js"></script>
  189. <script src="./dist/js/vendor/bootstrap.min.js"></script>
  190. <script src="./dist/js/plugins/slick.js"></script>
  191. <script src="./dist/js/plugins/wow.js"></script>
  192. <script src="./dist/js/plugins/svg-injector.min.js"></script>
  193. <script src="./dist/js/plugins/jquery.nice-select.min.js"></script>
  194. <script src="./dist/js/plugins/mouse-parallax.js"></script>
  195. <script src="./dist/js/plugins/images-loaded.js"></script>
  196. <script src="./dist/js/plugins/isotope.js"></script>
  197. <script src="./dist/js/plugins/jquery-ui.js"></script>
  198. <script src="./dist/js/plugins/magnific-popup.js"></script>
  199. <script src="./dist/js/navbar.js"></script>
  200. <!-- Main JS -->
  201. <script src="./dist/js/main.js"></script>
  202. <script>
  203. $(".header-area").addClass("bg-gradient-anwi");
  204. $(".product_card_section").find(".product_catlogue_card").each(function(){
  205. $(this).click(function(){
  206. let name = $(this).attr("data_product");
  207. let product_catlogue_obj = {
  208. product:name
  209. }
  210. localStorage.setItem("product_catlogue_obj",JSON.stringify(product_catlogue_obj));
  211. window.location.href="/productcatloguedetails.html";
  212. })
  213. });
  214. </script>
  215. </body>
  216. </html>