rahul.katari/anwisystems
1
0
Fork 0
程式碼 問題 合併請求 版本發布 Wiki 動態

aio landing responsiveness

瀏覽代碼
此提交包含在：
Rahul Katari
2024-04-04 16:08:33 +05:30
父節點 d3532c6cb8
當前提交 f10b93141d
共有 2 個檔案被更改，包括 41 行新增 和 39 行删除
下載 Patch 檔 下載差異檔 展開所有檔案 折疊所有檔案
dist/css/style.css
已供應
+1 -1
查看文件
@@ -89,7 +89,7 @@ button {
line-height: inherit; line-height: inherit;
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
color: #333333; color: #333333 !important;
} }
a, a,
zeno-aio-landing.html
+40 -38
查看文件
@@ -25,11 +25,13 @@
<section> <section>
<div class="container"> <div class="container">
<img src="./dist/assets/imgs/zeno/aio/banner-1-DT.jpg" alt=""> <img src="./dist/assets/imgs/zeno/aio/banner-1-DT.jpg" alt="">
<h2 class="text-7xl text-center font-semibold">Anwi Zeno AIO</h2> <h2 class="md:text-7xl text-4xl text-center font-semibold">Anwi Zeno AIO</h2>
<h4 class="text-5xl text-center my-3">Sleek Elegance,<span class="font-semibold"> Powerful <h4 class="md:text-5xl text-2xl text-center my-3">Sleek Elegance,<span class="font-semibold"> Powerful
Performance</span> Performance</span>
</h4> </h4>
<p class="text-center max-w-5xl text-2xl m-auto my-5"><strong>We don’t just build machines;</strong> we <p class="text-center max-w-5xl md:text-2xl m-auto md:my-5 my-2"><strong>We don’t just build
machines;</strong>
we
create tools that create tools that
make make
your your
@@ -39,17 +41,13 @@
</section> </section>
<!-- stand section --> <!-- stand section -->
<section> <section>
<div class="container bg-black py-24"> <div class="container bg-black md:py-24 py-12">
<div class="md:grid grid-cols-5 max-w-7xl my-5 mx-auto"> <div class="md:grid grid-cols-5 max-w-7xl my-5 mx-auto">
<div class="text-white col-span-2 flex flex-col justify-center"> <div class="text-white col-span-2 flex flex-col justify-center">
<h2 class="text-3xl font-semibold">Adapts to you</h2> <h2 class="text-3xl font-semibold">View Flexibly</h2>
<p class="text-xl mt-3">Versatile stands give you the freedom to use your display at the angle <p class="text-xl mt-3">Rotate Zeno's Screen 180°, Horizontal to Landscape.</p>
with
tilt, height, and
swivel functionality that can adapt to a range of working styles--whether sitting at a desk,
or standing to serve customers, you´ll always have the best view.</p>
</div> </div>
<div class="col-span-3 flex justify-center"> <div class="col-span-3 flex justify-center max-sm:mt-24">
<img src="./dist/assets/imgs/zeno/aio/stand.png" alt="" class="w-4/6"> <img src="./dist/assets/imgs/zeno/aio/stand.png" alt="" class="w-4/6">
</div> </div>
</div> </div>
@@ -58,12 +56,13 @@
<!-- display section --> <!-- display section -->
<section> <section>
<div class="container"> <div class="container">
<div class=" max-w-7xl m-auto text-center my-5 relative"> <div class=" max-w-7xl m-auto md:text-center my-5 relative">
<h2 class="text-2xl uppercase "><span <h2 class="text-2xl uppercase "><span
class="text-cyan-700 tracking-widest border-t-2 border-cyan-700 pt-2">Display</span> class="text-cyan-700 tracking-widest border-t-2 border-cyan-700 pt-2">Display</span>
</h2> </h2>
<h3 class="text-5xl font-semibold my-4"><span>Display of brilliance</span></h3> <h3 class="md:text-5xl text-3xl font-semibold my-4"><span>Display of brilliance</span></h3>
<div class="mx-44 text-xl font-medium">The space-saving ANWI M3402WFA is remarkably slim and light, <div class="md:mx-44 md:text-xl font-medium">The space-saving ANWI M3402WFA is remarkably slim and
light,
and and
its NanoEdge its NanoEdge
display<sup class="footnote-num"><a href="#footnote-3" aria-label="Footnote 3">3</a></sup> display<sup class="footnote-num"><a href="#footnote-3" aria-label="Footnote 3">3</a></sup>
@@ -77,19 +76,19 @@
comfort and low blue-light emissions — so your eyes stay fresh during long viewing sessions. comfort and low blue-light emissions — so your eyes stay fresh during long viewing sessions.
</div> </div>
<div class="grid grid-cols-5 my-12"> <div class="grid md:grid-cols-5 grid-cols-2 my-12">
<div class="" data-gaid="" data-index="1"> <div class="" data-gaid="" data-index="1">
<div class="text-5xl font-medium text-cyan-700">24”</div> <div class="md:text-5xl text-3xl font-medium text-cyan-700">24”</div>
<div class=""><span>FHD NanoEdge display</span> <div class=""><span>FHD NanoEdge display</span>
</div> </div>
</div> </div>
<div class="" data-gaid="" data-index="2"> <div class="" data-gaid="" data-index="2">
<div class="text-5xl font-medium text-cyan-700">88%</div> <div class="md:text-5xl text-3xl font-medium text-cyan-700">88%</div>
<div class=""><span>screen-to-body ratio</span> <div class=""><span>screen-to-body ratio</span>
</div> </div>
</div> </div>
<div class="" data-gaid="" data-index="3"> <div class="" data-gaid="" data-index="3">
<div class="text-5xl font-medium text-cyan-700">100%</div> <div class="md:text-5xl text-3xl font-medium text-cyan-700">100%</div>
<div class=""><span>sRGB color gamut</span> <div class=""><span>sRGB color gamut</span>
</div> </div>
</div> </div>
@@ -111,7 +110,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="mt-[-300px]"> <div class="md:mt-[-300px] mt-[-100px]">
<img src="./dist/assets/imgs/zeno/aio/Banner-2-DT.jpg" alt=""> <img src="./dist/assets/imgs/zeno/aio/Banner-2-DT.jpg" alt="">
</div> </div>
</div> </div>
@@ -122,14 +121,16 @@
<div> <div>
<img src="./dist/assets/imgs/zeno/aio/audio.jpg" alt=""> <img src="./dist/assets/imgs/zeno/aio/audio.jpg" alt="">
</div> </div>
<div class="absolute left-2/3 bottom-1/3"> <div class="md:absolute left-2/3 bottom-1/3">
<h2 class="uppercase tracking-widest"><span <h2 class="uppercase tracking-widest"><span
class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Audio</span> class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Audio</span>
</h2> </h2>
<h3 class="text-5xl font-semibold leading-snug my-4"><span>High-fidelity SonicMaster sound, expertly <h3 class="md:text-5xl text-3xl font-semibold leading-snug my-4"><span>High-fidelity SonicMaster
sound, expertly
optimized</span> optimized</span>
</h3> </h3>
<div class="font-medium text-xl">ANWI SonicMaster, developed by the ANWI Golden Ear team, empowers <div class="font-medium md:text-xl">ANWI SonicMaster, developed by the ANWI Golden Ear team,
empowers
ANWI ANWI
M3402WFA with M3402WFA with
quality audio that delivers wider frequency range for clearer vocals and rich, deep bass. quality audio that delivers wider frequency range for clearer vocals and rich, deep bass.
@@ -140,17 +141,17 @@
</section> </section>
<!-- beginners section --> <!-- beginners section -->
<section> <section>
<div class="container"> <div class="container my-5">
<div class="grid grid-cols-2 gap-5 mx-3"> <div class="grid md:grid-cols-2 gap-5 mx-3">
<div class=""><img <div class=""><img
src="https://in-files.apjonlinecdn.com/landingpages/content-pages/hp-aio-desktop/images/w100_everyday_img2_v2.jpg" src="https://in-files.apjonlinecdn.com/landingpages/content-pages/hp-aio-desktop/images/w100_everyday_img2_v2.jpg"
alt="Desktops For Beginners" data-src="" class="img_width_100"> alt="Desktops For Beginners" data-src="" class="img_width_100">
<div class=" show-in-mobile"></div> <div class=" show-in-mobile"></div>
</div> </div>
<div class="md:me-44"> <div class="md:me-44">
<h3 class="text-blue-800 text-xl">Desktops For Beginners</h3> <h3 class="text-blue-800 text-xl">Engage More</h3>
<h5 class="text-2xl font-medium">Comfortable viewing experience for the little ones. <h5 class="text-2xl font-medium">Optional Touchscreen Perfect for Interactive
</h5> Displays, Kiosks.</h5>
<ul class="space-y-3 divide-y-2 divide-black"> <ul class="space-y-3 divide-y-2 divide-black">
<li>Designed for eye comfort</li> <li>Designed for eye comfort</li>
<li>Big, anti-glare screen</li> <li>Big, anti-glare screen</li>
@@ -173,14 +174,14 @@
<!-- ports section --> <!-- ports section -->
<section> <section>
<div class="container"> <div class="container">
<div class="mt-5 pt-5"> <div class="md:mt-5 pt-5 md:text-center">
<h2 class="uppercase tracking-widest text-center"><span <h2 class="uppercase tracking-widest"><span
class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Connectivity</span> class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Connectivity</span>
</h2> </h2>
<h3 class="text-4xl font-semibold text-center my-3"> <h3 class="md:text-5xl text-3xl font-semibold my-3">
<span>Fast, reliable connectivity</span> <span>Fast, reliable connectivity</span>
</h3> </h3>
<div class="max-w-4xl m-auto text-xl font-medium text-center"> <div class="max-w-4xl m-auto md:text-xl font-medium">
ANWI M3402WFA is loaded with the latest connectivity, including an HDMI-in port that lets you ANWI M3402WFA is loaded with the latest connectivity, including an HDMI-in port that lets you
hook up video and audio from an external source — enabling amazing big-screen experiences for hook up video and audio from an external source — enabling amazing big-screen experiences for
your laptop, mobile device, game console or even a set-top TV box. There are also three USB 3.2 your laptop, mobile device, game console or even a set-top TV box. There are also three USB 3.2
@@ -190,7 +191,8 @@
integrated security, with a built-in Kensington lock slot for simple and effective physical integrated security, with a built-in Kensington lock slot for simple and effective physical
protection.</div> protection.</div>
<div class="grid grid-cols-4 max-w-3xl mx-auto text-center my-24 font-medium"> <div
class="grid md:grid-cols-4 grid-cols-2 gap-8 text-center max-w-3xl mx-auto md:my-24 my-8 font-medium">
<div class=""> <div class="">
<div class="text-5xl font-medium text-cyan-700"><img class="m-auto" <div class="text-5xl font-medium text-cyan-700"><img class="m-auto"
src="./dist/assets/imgs/zeno/aio/icon_typea.png" src="./dist/assets/imgs/zeno/aio/icon_typea.png"
@@ -227,17 +229,17 @@
</section> </section>
<!-- secure section --> <!-- secure section -->
<section> <section>
<div class="container"> <div class="container max-sm:my-12">
<div class="relative"> <div class="relative">
<img src="./dist/assets/imgs/zeno/aio/security.jpg" alt="" class=""> <img src="./dist/assets/imgs/zeno/aio/security.jpg" alt="" class="">
<div class="absolute top-16 max-w-xl right-16"> <div class="md:absolute top-16 max-w-xl right-16">
<h2 class="uppercase tracking-widest"><span <h2 class="uppercase tracking-widest"><span
class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Security</span> class="text-cyan-700 border-t-2 border-cyan-700 text-2xl">Secure Your Data</span>
</h2> </h2>
<h3 class="my-6 text-5xl font-semibold"> <h3 class="my-6 md:text-5xl text-3xl font-semibold">
<span>Secure your crucial data</span> <span>Optional Fingerprint Scanner for Peace of Mind.</span>
</h3> </h3>
<div class="text-xl font-medium">Remote working is <div class="md:text-xl font-medium">Remote working is
accelerating, and with it the need to keep your crucial data safe. That’s why ANWI M3402WFA accelerating, and with it the need to keep your crucial data safe. That’s why ANWI M3402WFA
is equipped with first-class security. The camera’s shutter slides across in a moment for is equipped with first-class security. The camera’s shutter slides across in a moment for
instant privacy, whenever you need it. There’s also the all-new Microsoft Pluton chip that instant privacy, whenever you need it. There’s also the all-new Microsoft Pluton chip that