Sin descripción
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

zeno-aio-landing.html 16KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310
  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 href="./dist/css/plugins/aos.css" rel="stylesheet" />
  8. <link rel="stylesheet" href="./all.css" />
  9. <script src="https://cdn.tailwindcss.com"></script>
  10. <title>Anwi</title>
  11. </head>
  12. <body>
  13. <!-- navbar -->
  14. <!-- <auth-loader></auth-loader> -->
  15. <div id="navbar-head" class=""></div>
  16. <!-- end-navbar -->
  17. <!-- main-body -->
  18. <main class="main-body home-main-container loading-main" id="home-main-container">
  19. <!-- banner section -->
  20. <section>
  21. <div class="container">
  22. <img src="./dist/assets/imgs/zeno/aio/banner-1-DT.jpg" alt="">
  23. <h2 class="text-7xl text-center font-semibold">Anwi Zeno AIO</h2>
  24. <h4 class="text-5xl text-center my-3">Sleek Elegance,<span class="font-semibold"> Powerful
  25. Performance</span>
  26. </h4>
  27. <p class="text-center max-w-5xl text-2xl m-auto my-5"><strong>We don’t just build machines;</strong> we
  28. create tools that
  29. make
  30. your
  31. life easier and better. Every product is made with love, understanding what
  32. you really need.</p>
  33. </div>
  34. </section>
  35. <!-- stand section -->
  36. <section>
  37. <div class="container bg-black py-24">
  38. <div class="md:grid grid-cols-5 max-w-7xl my-5 mx-auto">
  39. <div class="text-white col-span-2 flex flex-col justify-center">
  40. <h2 class="text-3xl font-semibold">Adapts to you</h2>
  41. <p class="text-xl mt-3">Versatile stands give you the freedom to use your display at the angle
  42. with
  43. tilt, height, and
  44. swivel functionality that can adapt to a range of working styles--whether sitting at a desk,
  45. or standing to serve customers, you´ll always have the best view.</p>
  46. </div>
  47. <div class="col-span-3 flex justify-center">
  48. <img src="./dist/assets/imgs/zeno/aio/stand.png" alt="" class="w-4/6">
  49. </div>
  50. </div>
  51. </div>
  52. </section>
  53. <!-- display section -->
  54. <section>
  55. <div class="container">
  56. <div class=" max-w-7xl m-auto text-center my-5 relative">
  57. <h2 class="text-2xl uppercase "><span
  58. class="text-cyan-700 tracking-widest border-t-2 border-cyan-700 pt-2">Display</span>
  59. </h2>
  60. <h3 class="text-5xl font-semibold my-4"><span>Display of brilliance</span></h3>
  61. <div class="mx-44 text-xl font-medium">The space-saving ANWI M3402WFA is remarkably slim and light,
  62. and
  63. its NanoEdge
  64. display<sup class="footnote-num"><a href="#footnote-3" aria-label="Footnote 3">3</a></sup>
  65. features
  66. a
  67. thin bezel for edge-to-edge viewing and an impressive up to 88% screen-to-body ratio. This
  68. stunning widescreen display includes 178<sup class="sign-deg">°</sup> viewing angles and 100%
  69. sRGB color gamut for vivid and realistic-looking colors. The 24-inch touchscreen<sup
  70. class="footnote-num"><a href="#footnote-2" aria-label="Footnote 2">2</a></sup> also boasts
  71. 1920x1080 resolution and features an anti-glare coating and certified by TÜV Rheinland for eye
  72. comfort and low blue-light emissions — so your eyes stay fresh during long viewing sessions.
  73. </div>
  74. <div class="grid grid-cols-5 my-12">
  75. <div class="" data-gaid="" data-index="1">
  76. <div class="text-5xl font-medium text-cyan-700">24”</div>
  77. <div class=""><span>FHD NanoEdge display</span>
  78. </div>
  79. </div>
  80. <div class="" data-gaid="" data-index="2">
  81. <div class="text-5xl font-medium text-cyan-700">88%</div>
  82. <div class=""><span>screen-to-body ratio</span>
  83. </div>
  84. </div>
  85. <div class="" data-gaid="" data-index="3">
  86. <div class="text-5xl font-medium text-cyan-700">100%</div>
  87. <div class=""><span>sRGB color gamut</span>
  88. </div>
  89. </div>
  90. <div class="" data-gaid="" data-index="4">
  91. <div class=""><img class="img img__icon img__icon4"
  92. src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII="
  93. alt="An icon for TÜV Rheinland-certified eye care">
  94. </div>
  95. <div class=""><span>TÜV Rheinland-certified eye care</span>
  96. </div>
  97. </div>
  98. <div class="" data-gaid="" data-index="5">
  99. <div class=""><img class="img img__icon img__icon5"
  100. src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII="
  101. alt="An icon for anti-glare display">
  102. </div>
  103. <div class=""><span>anti-glare display</span>
  104. </div>
  105. </div>
  106. </div>
  107. </div>
  108. <div class="mt-[-300px]">
  109. <img src="./dist/assets/imgs/zeno/aio/Banner-2-DT.jpg" alt="">
  110. </div>
  111. </div>
  112. </section>
  113. <!-- audio section -->
  114. <section>
  115. <div class="relative container">
  116. <div>
  117. <img src="./dist/assets/imgs/zeno/aio/audio.jpg" alt="">
  118. </div>
  119. <div class="absolute left-2/3 bottom-1/3">
  120. <h2 class="uppercase tracking-widest"><span
  121. class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Audio</span>
  122. </h2>
  123. <h3 class="text-5xl font-semibold leading-snug my-4"><span>High-fidelity SonicMaster sound, expertly
  124. optimized</span>
  125. </h3>
  126. <div class="font-medium text-xl">ANWI SonicMaster, developed by the ANWI Golden Ear team, empowers
  127. ANWI
  128. M3402WFA with
  129. quality audio that delivers wider frequency range for clearer vocals and rich, deep bass.
  130. SonicMaster is a tailored mix of superior hardware and clever software designed to give you full
  131. audio controls for truly immersive sound for movies, music and games.</div>
  132. </div>
  133. </div>
  134. </section>
  135. <!-- beginners section -->
  136. <section>
  137. <div class="container">
  138. <div class="grid grid-cols-2 gap-5 mx-3">
  139. <div class=""><img
  140. src="https://in-files.apjonlinecdn.com/landingpages/content-pages/hp-aio-desktop/images/w100_everyday_img2_v2.jpg"
  141. alt="Desktops For Beginners" data-src="" class="img_width_100">
  142. <div class=" show-in-mobile"></div>
  143. </div>
  144. <div class="md:me-44">
  145. <h3 class="text-blue-800 text-xl">Desktops For Beginners</h3>
  146. <h5 class="text-2xl font-medium">Comfortable viewing experience for the little ones.
  147. </h5>
  148. <ul class="space-y-3 divide-y-2 divide-black">
  149. <li>Designed for eye comfort</li>
  150. <li>Big, anti-glare screen</li>
  151. <li>Safe for kids privacy with HD Wide Vision
  152. Camera</li>
  153. <li class="mt-4 pt-4">
  154. Starting from <span class="lowest_price">
  155. <span class="price">₹36,499</span> </span>
  156. </li>
  157. </ul>
  158. <div class="mt-8">
  159. <a href="#" class="bg-black text-white px-3 py-2 mt-8" tabindex="0">Shop
  160. Now</a>
  161. </div>
  162. </div>
  163. </div>
  164. </div>
  165. </section>
  166. <!-- ports section -->
  167. <section>
  168. <div class="container">
  169. <div class="mt-5 pt-5">
  170. <h2 class="uppercase tracking-widest text-center"><span
  171. class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Connectivity</span>
  172. </h2>
  173. <h3 class="text-4xl font-semibold text-center my-3">
  174. <span>Fast, reliable connectivity</span>
  175. </h3>
  176. <div class="max-w-4xl m-auto text-xl font-medium text-center">
  177. ANWI M3402WFA is loaded with the latest connectivity, including an HDMI-in port that lets you
  178. hook up video and audio from an external source — enabling amazing big-screen experiences for
  179. your laptop, mobile device, game console or even a set-top TV box. There are also three USB 3.2
  180. Gen 1 ports for connecting all your peripherals, an HDMI-out port for attaching an external
  181. display and an SD card reader<sup class="footnote-num"><a href="#"
  182. aria-label="Footnote 2">2</a></sup> for everyday convenience. ANWI M3402WFA also has
  183. integrated security, with a built-in Kensington lock slot for simple and effective physical
  184. protection.</div>
  185. <div class="grid grid-cols-4 max-w-3xl mx-auto text-center my-24 font-medium">
  186. <div class="">
  187. <div class="text-5xl font-medium text-cyan-700"><img class="m-auto"
  188. src="./dist/assets/imgs/zeno/aio/icon_typea.png"
  189. alt="An icon for USB 3.2 Gen 1 Type-A x 3">
  190. </div>
  191. <div class="wd__feature__describe"><span>USB 3.2 Gen 1 Type-A x 3</span>
  192. </div>
  193. </div>
  194. <div class="">
  195. <div class="text-5xl font-medium text-cyan-700"><img class="img img__icon img__icon1"
  196. src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII="
  197. alt="An icon for USB-C® 3.2 Gen 1">
  198. </div>
  199. <div class=""><span>USB-C<sup role="img" aria-label="registered" class="sign-reg">®</sup>
  200. 3.2 Gen 1</span>
  201. </div>
  202. </div>
  203. <div class="">
  204. <div class="text-3xl font-medium text-cyan-700 ">10x</div>
  205. <div class=""><span>faster than USB 2.0</span>
  206. </div>
  207. </div>
  208. <div class="">
  209. <div class="text-5xl font-medium text-cyan-700 text-center"><img class="m-auto"
  210. src="./dist/assets/imgs/zeno/aio/icon_typed.png" alt="An icon for HDMI-in Port">
  211. </div>
  212. <div class=""><span>HDMI-in Port</span>
  213. </div>
  214. </div>
  215. </div>
  216. </div>
  217. <img src="./dist/assets/imgs/zeno/aio/ports.png" alt="" class="mt-5">
  218. </div>
  219. </section>
  220. <!-- secure section -->
  221. <section>
  222. <div class="container">
  223. <div class="relative">
  224. <img src="./dist/assets/imgs/zeno/aio/security.jpg" alt="" class="">
  225. <div class="absolute top-16 max-w-xl right-16">
  226. <h2 class="uppercase tracking-widest"><span
  227. class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Security</span>
  228. </h2>
  229. <h3 class="my-6 text-5xl font-semibold">
  230. <span>Secure your crucial data</span>
  231. </h3>
  232. <div class="text-xl font-medium">Remote working is
  233. accelerating, and with it the need to keep your crucial data safe. That’s why ANWI M3402WFA
  234. is equipped with first-class security. The camera’s shutter slides across in a moment for
  235. instant privacy, whenever you need it. There’s also the all-new Microsoft Pluton chip that
  236. bakes security into the CPU core, ensuring both code integrity and the latest protection —
  237. virtually eliminating the risk of leaks through hacking. ANWI M3402WFA also has a Kensington
  238. slot that provides a way to physically safeguard the machine, preventing theft of the PC
  239. from unsupervised locations.</div>
  240. </div>
  241. </div>
  242. </div>
  243. </section>
  244. <section>
  245. <div class="container p-3" style="background: #e2e2e2;">
  246. <h2 class="text-center font-weight-600 my-4">
  247. Zeno: Experience Desktop Power
  248. </h2>
  249. <div class="d-flex">
  250. <h3 class="font-weight-lighter">
  251. Upgradability in <br>
  252. <div style="white-space: nowrap; font-weight: 800;" class="pt-4">Sleek
  253. All-in-One</div> Design
  254. </h3>
  255. <div class="ms-5">
  256. <img src="./dist/assets/imgs/zeno/aio/aio1.jpeg" alt="" class="w-100">
  257. </div>
  258. </div>
  259. </div>
  260. </section>
  261. <section>
  262. <div class="container">
  263. <img src="./dist/assets/imgs/zeno/aio/front.jpeg" alt="">
  264. </div>
  265. </section>
  266. <section>
  267. <div class="container">
  268. <img src="./dist/assets/imgs/zeno/aio/inner-panel.jpeg" alt="">
  269. </div>
  270. </section>
  271. <section>
  272. <div class="container">
  273. <img src="./dist/assets/imgs/zeno/aio/rear.jpeg" alt="">
  274. </div>
  275. </section>
  276. </main>
  277. <!-- footer -->
  278. <div id="footer-head"></div>
  279. <!-- end-footer -->
  280. <!-- <script src="https://player.vimeo.com/api/player.js"></script> -->
  281. <script src="./dist/js/components/authloader/authloader.js"></script>
  282. <script src="./dist/js/jquery.min.js"></script>
  283. <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
  284. <script src="./dist/js/vendor/modernizr-3.11.7.min.js"></script>
  285. <script src="./dist/js/vendor/jquery-v3.6.0.min.js"></script>
  286. <script src="./dist/js/vendor/jquery-migrate-v3.3.2.min.js"></script>
  287. <script src="./dist/js/plugins/jquery-ui.js"></script>
  288. <script src="./dist/js/plugins/magnific-popup.js"></script>
  289. <script src="./dist/js/navbar.js"></script>
  290. <script src="./dist/js/footer.js"></script>
  291. <script src="./dist/js/main.js"></script>
  292. <script src="./dist/js/plugins/aos.js"></script>
  293. <script>
  294. AOS.init();
  295. </script>
  296. </body>
  297. </html>