Compare commits
4 Commits
03e433fc77
...
257bc5e5c7
| Author | SHA1 | Date | |
|---|---|---|---|
|
257bc5e5c7 | ||
|
41f3ab20b1 | ||
|
|
7037db4300 | ||
|
|
17725b83d9 |
BIN
assests/images/1983-Icon.png
Normal file
BIN
assests/images/1983-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
assests/images/1991-Icon.png
Normal file
BIN
assests/images/1991-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 591 B |
BIN
assests/images/2007-Icon.png
Normal file
BIN
assests/images/2007-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 599 B |
BIN
assests/images/2008-Icon.png
Normal file
BIN
assests/images/2008-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
assests/images/2013-Icon.png
Normal file
BIN
assests/images/2013-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
assests/images/2015-Icon.png
Normal file
BIN
assests/images/2015-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
BIN
assests/images/2016-Icon.png
Normal file
BIN
assests/images/2016-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 827 B |
BIN
assests/images/2022-Icon.png
Normal file
BIN
assests/images/2022-Icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 110 KiB |
29
assests/images/Our-Funds-back.svg
Normal file
29
assests/images/Our-Funds-back.svg
Normal file
@@ -0,0 +1,29 @@
|
||||
<svg width="1440" height="734" viewBox="0 0 1440 734" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2092_1695)">
|
||||
<rect width="1440" height="734" fill="white"/>
|
||||
<g opacity="0.6">
|
||||
<path d="M1096.26 391.863L647.476 -3.13708H1582.79L1582.03 300.212L1095.5 828.828L1096.26 391.863Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1556.28 291.681L1115.25 770.612L1115.91 375.328L710.559 18.5567H1556.97L1556.28 291.681Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1530.53 283.11L1134.97 712.398L1135.59 358.795L773.609 40.2118H1531.15L1530.53 283.11Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1504.78 274.576L1154.73 654.179L1155.24 342.258L836.692 61.9025H1505.3L1504.78 274.576Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1479.03 266.007L1174.44 595.965L1174.89 325.726L899.774 83.5992H1479.48L1479.03 266.007Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1453.28 257.434L1194.19 537.789L1194.57 309.19L962.857 105.251H1453.66L1453.28 257.434Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1427.5 248.902L1213.91 479.573L1214.22 292.656L1025.9 126.945H1427.81L1427.5 248.902Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1401.75 240.33L1233.66 421.356L1233.87 276.121L1088.99 148.639H1401.99L1401.75 240.33Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1376 231.798L1253.38 363.139L1253.52 259.626L1152.07 170.291H1376.17L1376 231.798Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1350.25 223.228L1273.1 304.926L1273.2 243.094L1215.15 191.988H1350.31L1350.25 223.228Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M1292.85 246.747V226.557L1278.2 213.678H1324.49V214.653L1292.85 246.747Z" stroke="#B18C4A" stroke-width="0.745536" stroke-miterlimit="10"/>
|
||||
<path d="M635.799 -40H1457.46V813.726L1051.58 830.413L635.799 813.726V-40Z" fill="url(#paint0_linear_2092_1695)"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_2092_1695" x1="1235.05" y1="653.333" x2="1682.21" y2="209.359" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="white"/>
|
||||
<stop offset="0.441851" stop-color="white" stop-opacity="0.73"/>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0.81"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_2092_1695">
|
||||
<rect width="1440" height="734" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.5 KiB |
9
assests/images/contact-banner.svg
Normal file
9
assests/images/contact-banner.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.3 MiB |
40
assests/images/desbackcard-scroll.svg
Normal file
40
assests/images/desbackcard-scroll.svg
Normal file
@@ -0,0 +1,40 @@
|
||||
<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1141 436" width="1141" height="436">
|
||||
<defs>
|
||||
<clipPath clipPathUnits="userSpaceOnUse" id="cp1">
|
||||
<path d="m280-19h843c16.57 0 30 13.43 30 30v420c0 16.57-13.43 30-30 30h-843z"/>
|
||||
</clipPath>
|
||||
<linearGradient id="g1" x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(611.14,-579.415,580.72,612.516,885.03,680.095)">
|
||||
<stop offset="0" stop-color="#ffffff" stop-opacity="1"/>
|
||||
<stop offset=".442" stop-color="#ffffff" stop-opacity=".73"/>
|
||||
<stop offset="1" stop-color="#ffffff" stop-opacity=".81"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<style>
|
||||
.s0 { fill: #ffffff }
|
||||
.s1 { fill: none;stroke: #e6e7e8 }
|
||||
.s2 { fill: none;stroke: #b18c4a;stroke-miterlimit:10 }
|
||||
.s3 { fill: url(#g1) }
|
||||
</style>
|
||||
<g>
|
||||
<path fill-rule="evenodd" class="s0" d="m15-19h1108c16.57 0 30 13.43 30 30v420c0 16.57-13.43 30-30 30h-1108c-16.57 0-30-13.43-30-30v-420c0-16.57 13.43-30 30-30z"/>
|
||||
<path fill-rule="evenodd" class="s1" d="m15-18.5h1108c16.29 0 29.5 13.21 29.5 29.5v420c0 16.29-13.21 29.5-29.5 29.5h-1108c-16.29 0-29.5-13.21-29.5-29.5v-420c0-16.29 13.21-29.5 29.5-29.5z"/>
|
||||
<g style="opacity: .4">
|
||||
<g id="Clip-Path" clip-path="url(#cp1)">
|
||||
<g>
|
||||
<path class="s2" d="m703.77 302.06l-586.51-540.61h1222.35l-0.99 415.18-635.84 723.48z"/>
|
||||
<path class="s2" d="m1304.97 164.95l-576.38 655.48 0.86-541-529.75-488.29h1106.17z"/>
|
||||
<path class="s2" d="m1271.31 153.22l-516.95 587.54 0.81-483.95-473.07-436.03h990.03z"/>
|
||||
<path class="s2" d="m1237.66 141.54l-457.48 519.54 0.67-426.91-416.31-383.7h873.8z"/>
|
||||
<path class="s2" d="m1204.01 129.81l-398.06 451.59 0.58-369.86-359.54-331.38h757.61z"/>
|
||||
<path class="s2" d="m1170.36 118.08l-338.6 383.7 0.5-312.87-302.83-279.11h641.42z"/>
|
||||
<path class="s2" d="m1136.66 106.4l-279.13 315.71 0.4-255.83-246.11-226.79h525.24z"/>
|
||||
<path class="s2" d="m1103.01 94.67l-219.67 247.76 0.27-198.78-189.34-174.47h409.05z"/>
|
||||
<path class="s2" d="m1069.35 82.99l-160.24 179.76 0.18-141.67-132.58-122.27h292.87z"/>
|
||||
<path class="s2" d="m1035.7 71.26l-100.82 111.82 0.13-84.63-75.86-69.94h176.64z"/>
|
||||
<path class="s2" d="m960.69 103.45v-27.63l-19.15-17.63h60.51v1.34z"/>
|
||||
<path fill-rule="evenodd" class="s3" d="m101.87-268.83h1073.82v1168.44h-1073.82z"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
BIN
assests/images/mobile-about-banner.png
Normal file
BIN
assests/images/mobile-about-banner.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 558 KiB |
14
assests/images/mobile-contact.svg
Normal file
14
assests/images/mobile-contact.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.3 MiB |
45
assests/images/mobilebackcard-scroll.svg
Normal file
45
assests/images/mobilebackcard-scroll.svg
Normal file
@@ -0,0 +1,45 @@
|
||||
<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 299 397" width="299" height="397">
|
||||
<defs>
|
||||
<clipPath clipPathUnits="userSpaceOnUse" id="cp1">
|
||||
<path d="m8-20h284c7.73 0 14 6.27 14 14v412c0 7.73-6.27 14-14 14h-284c-7.73 0-14-6.27-14-14v-412c0-7.73 6.27-14 14-14z"/>
|
||||
</clipPath>
|
||||
<clipPath clipPathUnits="userSpaceOnUse" id="cp2">
|
||||
<path d="m-96-79h487.03v559h-487.03z"/>
|
||||
</clipPath>
|
||||
<linearGradient id="g1" x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(340.947,-323.247,323.975,341.715,241.537,461.643)">
|
||||
<stop offset="0" stop-color="#ffffff" stop-opacity="1"/>
|
||||
<stop offset=".442" stop-color="#ffffff" stop-opacity=".73"/>
|
||||
<stop offset="1" stop-color="#ffffff" stop-opacity=".81"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<style>
|
||||
.s0 { fill: #ffffff }
|
||||
.s1 { fill: none;stroke: #b18c4a;stroke-miterlimit:10;stroke-width: .6 }
|
||||
.s2 { fill: url(#g1) }
|
||||
.s3 { fill: none;stroke: #e6e7e8 }
|
||||
</style>
|
||||
<g>
|
||||
<g id="Clip-Path" clip-path="url(#cp1)">
|
||||
<g>
|
||||
<path fill-rule="evenodd" class="s0" d="m8-20h284c7.73 0 14 6.27 14 14v412c0 7.73-6.27 14-14 14h-284c-7.73 0-14-6.27-14-14v-412c0-7.73 6.27-14 14-14z"/>
|
||||
<g id="Clip-Path" clip-path="url(#cp2)">
|
||||
<g style="opacity: .4">
|
||||
<path class="s1" d="m140.41 250.75l-327.2-301.6h681.93l-0.55 231.62-354.73 403.62z"/>
|
||||
<path class="s1" d="m475.81 174.25l-321.55 365.68 0.48-301.81-295.54-272.41h617.12z"/>
|
||||
<path class="s1" d="m457.04 167.71l-288.4 327.78 0.45-269.99-263.92-243.25h552.32z"/>
|
||||
<path class="s1" d="m438.27 161.19l-255.23 289.84 0.38-238.16-232.25-214.06h487.47z"/>
|
||||
<path class="s1" d="m419.49 154.65l-222.07 251.93 0.32-206.33-200.58-184.88h422.66z"/>
|
||||
<path class="s1" d="m400.72 148.1l-188.9 214.07 0.27-174.55-168.94-155.71h357.84z"/>
|
||||
<path class="s1" d="m381.92 141.59l-155.73 176.12 0.23-142.71-137.3-126.53h293.02z"/>
|
||||
<path class="s1" d="m363.14 135.04l-122.54 138.22 0.15-110.89-105.64-97.34h228.21z"/>
|
||||
<path class="s1" d="m344.37 128.53l-89.4 100.28 0.1-79.03-73.97-68.22h163.39z"/>
|
||||
<path class="s1" d="m325.59 121.99l-56.24 62.38 0.07-47.22-42.32-39.02h98.54z"/>
|
||||
<path class="s1" d="m283.75 139.94v-15.41l-10.69-9.84h33.76v0.75z"/>
|
||||
<path fill-rule="evenodd" class="s2" d="m-195.38-67.75h599.07v651.86h-599.07z"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<path fill-rule="evenodd" class="s3" d="m8-19.5h284c7.46 0 13.5 6.04 13.5 13.5v412c0 7.46-6.04 13.5-13.5 13.5h-284c-7.46 0-13.5-6.04-13.5-13.5v-412c0-7.46 6.04-13.5 13.5-13.5z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.5 KiB |
BIN
assests/images/new-card.png
Normal file
BIN
assests/images/new-card.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
85
assests/images/scroll1.svg
Normal file
85
assests/images/scroll1.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1017 KiB |
41
assests/images/scroll2.svg
Normal file
41
assests/images/scroll2.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.0 MiB |
46
assests/images/scroll3.svg
Normal file
46
assests/images/scroll3.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.0 MiB |
54
assests/images/scroll4.svg
Normal file
54
assests/images/scroll4.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1016 KiB |
64
assests/images/scroll5.svg
Normal file
64
assests/images/scroll5.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.1 MiB |
76
css/contact.css
Normal file
76
css/contact.css
Normal file
@@ -0,0 +1,76 @@
|
||||
/* Base setup */
|
||||
:root {
|
||||
--font-primary: 'Open Sans', sans-serif;
|
||||
/* default body font */
|
||||
--font-secondary: 'Larken', serif;
|
||||
/* decorative font */
|
||||
--font-tertiary: 'Inter', sans-serif;
|
||||
/* for headings or special text */
|
||||
}
|
||||
|
||||
.contact-banner {
|
||||
background-image: url(../assests/images/contact-banner.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
height: 65vh;
|
||||
}
|
||||
|
||||
.contact-aling {
|
||||
align-items: end;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
.contact-tittle-banner {
|
||||
font-family: var(--font-secondary);
|
||||
font-weight: 400;
|
||||
font-size: 50px;
|
||||
line-height: 60px;
|
||||
color: #fff;
|
||||
}
|
||||
p.contact-text-banner {
|
||||
font-family: var(--font-primary);
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
line-height: 28px;
|
||||
color: #fff;
|
||||
}
|
||||
.invest-contact {
|
||||
background-color: #b58b4b;
|
||||
clip-path: polygon(0 0, 100% 0, 100% 70%, 90% 100%, 0 100%);
|
||||
transition: all 0.3s ease;
|
||||
padding: 15px 20px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
width: 280px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.invest-contact a {
|
||||
color: #fff;
|
||||
font-family: var(--font-primary);
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
line-height: 100%;
|
||||
letter-spacing: 1.2px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.contact-banner {
|
||||
background-image: url(../assests/images/mobile-contact.svg);
|
||||
padding: 0px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.contact-banner {
|
||||
background-image: url(../assests/images/mobile-contact.svg);
|
||||
padding: 0px 20px;
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,4 @@
|
||||
@font-face {
|
||||
font-family: "Larken";
|
||||
src: url("../assests/fonts/LarkenDEMO-Regular.otf") format("opentype");
|
||||
|
||||
}
|
||||
215
css/style.css
215
css/style.css
@@ -339,9 +339,9 @@ a.color-a {
|
||||
.ask-advantage {
|
||||
padding: 60px 0;
|
||||
}
|
||||
.ask-advantage2 {
|
||||
padding: 0px 0px 60px 0px;
|
||||
}
|
||||
.ask-advantage2 {
|
||||
padding: 0px 0px 60px 0px;
|
||||
}
|
||||
|
||||
.ask-advantage h2 {
|
||||
font-family: var(--font-secondary);
|
||||
@@ -964,7 +964,7 @@ span.textaccor {
|
||||
/* our-fund */
|
||||
|
||||
.ask-advantage3 {
|
||||
padding: 60px 0;
|
||||
padding: 60px 0;
|
||||
}
|
||||
|
||||
.coming-soon-container {
|
||||
@@ -1055,7 +1055,7 @@ span.textaccor {
|
||||
font-size: 24px;
|
||||
line-height: 30px;
|
||||
font-weight: 600;
|
||||
color: #dcdcdc;
|
||||
color: white;
|
||||
font-family: var(--font-primary);
|
||||
margin-top: 18px;
|
||||
}
|
||||
@@ -1153,6 +1153,200 @@ span.textaccor {
|
||||
font-family: var(--font-secondary);
|
||||
}
|
||||
|
||||
/* ===========================
|
||||
Timeline
|
||||
=========================== */
|
||||
.timeline {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 10px;
|
||||
margin: 80px auto;
|
||||
list-style: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.timeline::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 10px;
|
||||
right: 10px;
|
||||
height: 1px;
|
||||
background: #b18b4a65;
|
||||
transform: translateY(-50%);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.timeline li::before {
|
||||
content: attr(data-year);
|
||||
position: absolute;
|
||||
top: -40px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 16px;
|
||||
color: #3E3F3F;
|
||||
font-weight: 400;
|
||||
white-space: nowrap;
|
||||
font-family: var(--font-primary);
|
||||
}
|
||||
|
||||
|
||||
/* ===========================
|
||||
Kite Style
|
||||
=========================== */
|
||||
.timeline-item .kite {
|
||||
display: block;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: #000;
|
||||
border: 1px solid gray;
|
||||
transform: rotate(45deg);
|
||||
opacity: 0.5;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
/* Active kite (fade-in) */
|
||||
.timeline-item.active .kite {
|
||||
background: #b18c4a;
|
||||
opacity: 1;
|
||||
animation: fadeIn 0.4s ease forwards;
|
||||
}
|
||||
|
||||
.timeline li.active::before {
|
||||
color: #b18c4a;
|
||||
}
|
||||
|
||||
/* Inactive kite (fade-out) */
|
||||
.timeline-item:not(.active) .kite {
|
||||
animation: fadeOut 0.4s ease forwards;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
background: #000;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
background: #b18c4a;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeOut {
|
||||
from {
|
||||
opacity: 1;
|
||||
background: #b18c4a;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
background: #000;
|
||||
}
|
||||
}
|
||||
|
||||
/* ===========================
|
||||
Line Fill
|
||||
=========================== */
|
||||
.line-fill {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 60px;
|
||||
height: 2px;
|
||||
background: #b18c4a;
|
||||
z-index: 0;
|
||||
transform-origin: left;
|
||||
width: 0;
|
||||
transition: width 0.5s linear;
|
||||
}
|
||||
|
||||
/* ===========================
|
||||
Swiper Container
|
||||
=========================== */
|
||||
.swiper {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
padding: 0 60px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.swiper-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1px; /* added subtle gap between slides */
|
||||
}
|
||||
|
||||
.swiper-slide {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
background: #131313;
|
||||
gap: 2px; /* reduced gap between slide elements */
|
||||
}
|
||||
|
||||
.swiper-slide img {
|
||||
width: 82px;
|
||||
height: 82px;
|
||||
object-fit: contain;
|
||||
display: block;
|
||||
margin: 0 auto 2px; /* small bottom margin to reduce space */
|
||||
}
|
||||
|
||||
.swiper-slide h2 {
|
||||
font-size: 40px;
|
||||
color: #b18c4a;
|
||||
margin: 0 0 10px 0; /* small margin below heading */
|
||||
}
|
||||
|
||||
.swiper-slide .heading {
|
||||
color: #b18c4a;
|
||||
text-align: center;
|
||||
line-height: 1.3; /* tighter line height */
|
||||
margin: 0 0 2px 0; /* small margin below heading */
|
||||
}
|
||||
|
||||
.swiper-slide .sub-heading-container {
|
||||
width: 420px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.swiper-slide .sub-heading-container p {
|
||||
color: #fff;
|
||||
margin: 0; /* remove default margin */
|
||||
line-height: 1.4; /* tighter line height */
|
||||
}
|
||||
|
||||
|
||||
/* ===========================
|
||||
Swiper Navigation
|
||||
=========================== */
|
||||
.swiper-button-prev,
|
||||
.swiper-button-next {
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.swiper-button-prev {
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
.swiper-button-next {
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
|
||||
/* blog */
|
||||
|
||||
.blog-banner {
|
||||
@@ -1599,6 +1793,14 @@ span.textaccor {
|
||||
.links a {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
|
||||
/* mobile about-page */
|
||||
|
||||
|
||||
/* */
|
||||
|
||||
|
||||
.blog-tittle-banner {
|
||||
font-size: 40px;
|
||||
}
|
||||
@@ -1762,5 +1964,6 @@ span.textaccor {
|
||||
}
|
||||
.container.blog-aling {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
273
css/testing.css
273
css/testing.css
@@ -1,57 +1,232 @@
|
||||
.home_services {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
/* Base setup */
|
||||
:root {
|
||||
--font-primary: 'Open Sans', sans-serif;
|
||||
/* default body font */
|
||||
--font-secondary: 'Larken', serif;
|
||||
/* decorative font */
|
||||
--font-tertiary: 'Inter', sans-serif;
|
||||
/* for headings or special text */
|
||||
}
|
||||
|
||||
.home_services_wrapper {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
section.ask-advantage-scroll {
|
||||
padding: 60px 0 0 0;
|
||||
}
|
||||
|
||||
.home_service_item {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 2rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.ask-advantage-scroll h2
|
||||
|
||||
.home_service_content {
|
||||
max-width: 50%;
|
||||
}
|
||||
{
|
||||
font-family: var(--font-secondary);
|
||||
font-weight: 400;
|
||||
font-style: Regular;
|
||||
font-size: 40px;
|
||||
line-height: 100%;
|
||||
letter-spacing: 0%;
|
||||
color: #033A49;
|
||||
}
|
||||
.ask-advantage-scroll p.lead {
|
||||
font-family: var(--font-primary);
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
line-height: 100%;
|
||||
letter-spacing: 0%;
|
||||
color: #3E3F3F;
|
||||
margin-bottom: 40px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.home_service_image img {
|
||||
max-width: 400px;
|
||||
|
||||
.cards-wrapper {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
.card-scroll {
|
||||
background-image: url("../assests/images/desbackcard-scroll.svg");
|
||||
background-repeat: no-repeat;
|
||||
|
||||
|
||||
background-position: center center; /* centers it horizontally and vertically */
|
||||
|
||||
border-radius: 30px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border: 1px solid #E6E7E8;
|
||||
box-shadow: 0px 0px 14px 0px #0000000D;
|
||||
|
||||
/* reduce side padding so image aligns better */
|
||||
padding: 50px 80px 0px 80px;
|
||||
gap: 60px;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
width: 60%;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.card-image {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.card-label span {
|
||||
color: #B18C4A;
|
||||
font-family: var(--font-primary);
|
||||
font-weight: 400;
|
||||
font-size: 24px;
|
||||
line-height: 21.9px;
|
||||
letter-spacing: 0px;
|
||||
vertical-align: middle;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.scroll-tiile {
|
||||
margin: 20px 0 10px 0;
|
||||
color: #033A49;
|
||||
font-family: var(--font-secondary);
|
||||
font-weight: 400;
|
||||
font-size: 32px;
|
||||
line-height: 100%;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
.scroll-desc{
|
||||
font-family: var(--font-primary);
|
||||
font-weight: 400;
|
||||
|
||||
font-size: 18px;
|
||||
line-height: 100%;
|
||||
color: #3E3F3F;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.scroll-ul {
|
||||
margin-left: 15px;
|
||||
padding-left: 20px;
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
.scroll-ul .scroll-li {
|
||||
|
||||
font-family: var(--font-primary);
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.card-image img {
|
||||
width: 316px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.card-scroll {
|
||||
background-image: url("../assests/images/mobilebackcard-scroll.svg") ;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover; /* fills card area */
|
||||
background-position: center center; /* show from top */
|
||||
|
||||
border-radius: 30px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #E6E7E8;
|
||||
box-shadow: 0px 0px 14px 0px #0000000D;
|
||||
padding: 30px 20px 0px 20px;
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
width: 100%;
|
||||
}
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.card-image {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
}
|
||||
.card-image img {
|
||||
width: 220px;
|
||||
display: block;
|
||||
}
|
||||
.card-label span {
|
||||
|
||||
font-size: 18px;
|
||||
|
||||
}
|
||||
.scroll-tiile {
|
||||
|
||||
font-size: 18px;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
.cards-wrapper {
|
||||
|
||||
.home_service_labels span {
|
||||
background: #002852;
|
||||
color: #fff;
|
||||
padding: 0.2rem 0.5rem;
|
||||
border-radius: 3px;
|
||||
font-size: 0.9rem;
|
||||
margin-right: 5px;
|
||||
}
|
||||
margin-top: 30px;
|
||||
}
|
||||
.scroll-desc {
|
||||
|
||||
font-size: 13px;
|
||||
|
||||
}
|
||||
.scroll-ul {
|
||||
|
||||
display: none;
|
||||
}
|
||||
.ask-advantage-scroll h2
|
||||
|
||||
.btn-primary {
|
||||
background: #B18C4A;
|
||||
border: none;
|
||||
}
|
||||
{
|
||||
|
||||
font-size: 24px;
|
||||
|
||||
}
|
||||
.ask-advantage-scroll p.lead {
|
||||
|
||||
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.cards-wrapper {
|
||||
position: relative;
|
||||
height: 600px; /* ya jitna aapko chahiye ho */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.card-scroll {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
opacity: 0;
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.card-scroll.active {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
section.ask-advantage-scroll.container {
|
||||
padding: 60px 25px 0 25px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.home_service_item {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
.home_service_content {
|
||||
max-width: 100%;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.home_service_image img {
|
||||
max-width: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
49
index.html
49
index.html
@@ -4,20 +4,22 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>My Website</title>
|
||||
|
||||
<!-- Swiper CSS -->
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"
|
||||
/>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"/>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />
|
||||
<!-- GSAP -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/gsap.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/ScrollTrigger.min.js"></script>
|
||||
<!-- Custom CSS -->
|
||||
<link rel="stylesheet" href="css/fonts.css">
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
<link rel="stylesheet" href="css/testing.css"/>
|
||||
<link rel="stylesheet" href="css/contact.css"/>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -29,32 +31,21 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<div id="footer"></div>
|
||||
<!-- jquery -->
|
||||
<script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script>
|
||||
<!-- Swiper JS -->
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
<!-- ✅ Swiper JS -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
|
||||
|
||||
<!-- Gsap -->
|
||||
<!-- <script src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/gsap.min.js?ver=6.8.3" id="gsap-js-js"
|
||||
type="o/js-lzl"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/ScrollTrigger.min.js?ver=6.8.3"
|
||||
id="gsap-scrolltrigger-js-js" type="o/js-lzl"></script> -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.13.0/gsap.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.13.0/ScrollTrigger.min.js"></script>
|
||||
|
||||
<!-- slkick slider -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js?ver=1.8.1"
|
||||
id="slick-carousel-js" type="o/js-lzl"></script>
|
||||
<script
|
||||
src="https://vestedfinance.com/wp-content/themes/vested-finance-wp/assets/js/slick-slider.js?ver=1.0.0"
|
||||
id="custom-slick-slider-js" type="o/js-lzl"></script>
|
||||
<!-- jQuery -->
|
||||
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
|
||||
|
||||
<!-- Bootstrap JS -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
<!-- Swiper JS -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
|
||||
|
||||
<!-- GSAP & ScrollTrigger -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
|
||||
|
||||
<!-- Custom JS -->
|
||||
<script src="js/main.js"></script>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
145
js/main.js
145
js/main.js
@@ -1,4 +1,4 @@
|
||||
// Load header and footer, then initialize navbar script after header injected
|
||||
// ✅ Load header and footer, then initialize navbar script after header injected
|
||||
['header', 'footer'].forEach(id => {
|
||||
const file = id === 'header' ? 'components/header.html' : 'components/footer.html';
|
||||
fetch(file)
|
||||
@@ -16,7 +16,7 @@
|
||||
});
|
||||
});
|
||||
|
||||
// Pages mapping
|
||||
// ✅ Pages mapping
|
||||
const routes = {
|
||||
"#/": "pages/home.html",
|
||||
"#/our-fund": "pages/our-fund.html",
|
||||
@@ -26,7 +26,7 @@ const routes = {
|
||||
"#/blog": "pages/blog.html",
|
||||
};
|
||||
|
||||
// ✅ Function to initialize Swiper (only if needed)
|
||||
// ✅ Initialize Swiper if present
|
||||
function initSwiper() {
|
||||
if (document.querySelector(".mySwiper")) {
|
||||
new Swiper(".mySwiper", {
|
||||
@@ -34,72 +34,121 @@ function initSwiper() {
|
||||
spaceBetween: 20,
|
||||
loop: true,
|
||||
autoplay: {
|
||||
delay: 2500, // ⏱️ 2.5 seconds between slides
|
||||
disableOnInteraction: false, // keep auto even after manual swipe
|
||||
delay: 2500,
|
||||
disableOnInteraction: false,
|
||||
},
|
||||
|
||||
});
|
||||
console.log("✅ Swiper initialized with autoplay");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// ✅ Team Drawer
|
||||
window.openDrawer = function (name, role, img, desc) {
|
||||
document.getElementById("drawerName").textContent = name;
|
||||
document.getElementById("drawerRole").textContent = role;
|
||||
document.getElementById("drawerImg").src = img;
|
||||
document.getElementById("drawerDesc").innerHTML = desc;
|
||||
|
||||
// Load page content
|
||||
// Load page content
|
||||
const drawer = bootstrap.Offcanvas.getOrCreateInstance(document.getElementById('teamDrawer'));
|
||||
drawer.show();
|
||||
};
|
||||
|
||||
// ==============================
|
||||
// 🪄 GSAP STACK SCROLL ANIMATION
|
||||
// ==============================
|
||||
let cards = [];
|
||||
let currentIndex = 0;
|
||||
let animating = false;
|
||||
let isInsideSection = false;
|
||||
|
||||
function initGsapStackScroll() {
|
||||
const section = document.querySelector('.cards-wrapper');
|
||||
if (!section) return;
|
||||
|
||||
cards = Array.from(section.querySelectorAll('.card-scroll'));
|
||||
if (!cards.length) return;
|
||||
|
||||
gsap.set(cards, { opacity: 0, y: "100%" });
|
||||
gsap.set(cards[0], { opacity: 1, y: "0%" });
|
||||
currentIndex = 0;
|
||||
|
||||
// 🎯 Mouse enter/leave detect karein
|
||||
section.addEventListener('mouseenter', () => { isInsideSection = true; });
|
||||
section.addEventListener('mouseleave', () => { isInsideSection = false; });
|
||||
|
||||
// 🌐 Global scroll listener
|
||||
window.removeEventListener('wheel', window._gsapStackHandler);
|
||||
window._gsapStackHandler = function (e) {
|
||||
if (!isInsideSection) return; // 📌 agar mouse section ke bahar hai to kuch mat karo
|
||||
|
||||
e.preventDefault(); // ✅ sirf section ke andar scroll disable karo
|
||||
if (animating) return;
|
||||
|
||||
if (e.deltaY > 0) {
|
||||
showNextGsapCard();
|
||||
} else {
|
||||
showPrevGsapCard();
|
||||
}
|
||||
};
|
||||
window.addEventListener('wheel', window._gsapStackHandler, { passive: false });
|
||||
}
|
||||
|
||||
function showNextGsapCard() {
|
||||
if (currentIndex >= cards.length - 1) return;
|
||||
animating = true;
|
||||
|
||||
const current = cards[currentIndex];
|
||||
const next = cards[currentIndex + 1];
|
||||
|
||||
gsap.to(current, { y: "-100%", opacity: 0, duration: 0.8, ease: "power2.inOut" });
|
||||
gsap.fromTo(next,
|
||||
{ y: "100%", opacity: 0 },
|
||||
{ y: "0%", opacity: 1, duration: 0.8, ease: "power2.inOut", onComplete: () => animating = false }
|
||||
);
|
||||
|
||||
currentIndex++;
|
||||
}
|
||||
|
||||
function showPrevGsapCard() {
|
||||
if (currentIndex <= 0) return;
|
||||
animating = true;
|
||||
|
||||
const current = cards[currentIndex];
|
||||
const prev = cards[currentIndex - 1];
|
||||
|
||||
gsap.to(current, { y: "100%", opacity: 0, duration: 0.8, ease: "power2.inOut" });
|
||||
gsap.fromTo(prev,
|
||||
{ y: "-100%", opacity: 0 },
|
||||
{ y: "0%", opacity: 1, duration: 0.8, ease: "power2.inOut", onComplete: () => animating = false }
|
||||
);
|
||||
|
||||
currentIndex--;
|
||||
}
|
||||
|
||||
// ✅ Load page content dynamically
|
||||
function loadPage() {
|
||||
const hash = location.hash || "#/";
|
||||
const page = routes[hash] || routes["#/"];
|
||||
|
||||
|
||||
fetch(page)
|
||||
.then(res => res.text())
|
||||
.then(html => {
|
||||
document.getElementById("page-content").innerHTML = html;
|
||||
|
||||
// ✅ Scroll to top of page after content is loaded
|
||||
// ✅ Scroll to top after page load
|
||||
window.scrollTo({ top: 0, behavior: "smooth" });
|
||||
|
||||
// ✅ Initialize Swiper after HTML is inserted
|
||||
// ✅ Re-init Swiper if present
|
||||
initSwiper();
|
||||
|
||||
// ✅ Re-init GSAP scroll stack animation
|
||||
initGsapStackScroll();
|
||||
|
||||
})
|
||||
.catch(() => {
|
||||
document.getElementById("page-content").innerHTML = "<h2>Page not found</h2>";
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Load page on hash change
|
||||
// ✅ Event listener for routing
|
||||
window.addEventListener("hashchange", loadPage);
|
||||
|
||||
// Load default page
|
||||
loadPage();
|
||||
|
||||
// Define globally so inline onclick works
|
||||
window.openDrawer = function (name, role, img, desc) {
|
||||
document.getElementById("drawerName").textContent = name;
|
||||
document.getElementById("drawerRole").textContent = role;
|
||||
document.getElementById("drawerImg").src = img;
|
||||
|
||||
// Use innerHTML to preserve paragraph breaks
|
||||
document.getElementById("drawerDesc").innerHTML = desc;
|
||||
|
||||
const drawer = bootstrap.Offcanvas.getOrCreateInstance(document.getElementById('teamDrawer'));
|
||||
drawer.show();
|
||||
};
|
||||
|
||||
|
||||
gsap.registerPlugin(ScrollTrigger);
|
||||
|
||||
const slides = gsap.utils.toArray('.home_service_item');
|
||||
|
||||
gsap.to(slides, {
|
||||
yPercent: -100 * (slides.length - 1),
|
||||
ease: "none",
|
||||
scrollTrigger: {
|
||||
trigger: ".home_services_wrapper",
|
||||
pin: true,
|
||||
scrub: 1,
|
||||
snap: 1 / (slides.length - 1),
|
||||
end: () => "+=" + document.querySelector(".home_services_wrapper").offsetHeight,
|
||||
}
|
||||
});
|
||||
loadPage(); // default page load
|
||||
|
||||
132
js/script.js
132
js/script.js
@@ -0,0 +1,132 @@
|
||||
|
||||
// ===============================
|
||||
// Timeline Data
|
||||
// ===============================
|
||||
alert("Hello World")
|
||||
|
||||
const timelineData = {
|
||||
1983: {
|
||||
icon: "../assests/images/1983-Icon.png",
|
||||
heading: "The beginning",
|
||||
sub: "The beginning — Set up by Mr. Asit Koticha and Mr. Sameer Koticha, ASK Group offers research-based Investment advisory."
|
||||
},
|
||||
1991: {
|
||||
icon: "../assests/images/1991-Icon.png",
|
||||
heading: "ASK Raymond James",
|
||||
sub: "ASK Group and Raymond James Financial enter into a Partnership."
|
||||
},
|
||||
2007: {
|
||||
icon: "../assests/images/2007-Icon.png",
|
||||
heading: "Launch of ASK Wealth Advisors",
|
||||
sub: "Raymond James Financial partnership exits."
|
||||
},
|
||||
2008: {
|
||||
icon: "../assests/images/2008-Icon.png",
|
||||
heading: "Launch of ASK multi-family office",
|
||||
sub: ""
|
||||
},
|
||||
2013: {
|
||||
icon: "../assests/images/2013-Icon.png",
|
||||
heading: "License from SEBI",
|
||||
sub: "ASK Wealth Advisors receives an Investment Advisor License from SEBI."
|
||||
},
|
||||
2015: {
|
||||
icon: "../assests/images/2015-Icon.png",
|
||||
heading: "Best Independent Wealth Advisor",
|
||||
sub: "ASK Wealth Advisors adjudged 'the best Independent Wealth Advisor, 2015' by Wealth Briefing, Asia."
|
||||
},
|
||||
2016: {
|
||||
icon: "../assests/images/2016-Icon.png",
|
||||
heading: "",
|
||||
sub: "Advent International acquires minority stake in ASK Group."
|
||||
},
|
||||
2017: {
|
||||
icon: "../assests/images/2015-Icon.png",
|
||||
heading: "",
|
||||
sub: "ASK Wealth Advisors adjudged 'One to Watch - Wealth Manager - India Domestic' - Distinction, 2017 by Asian Private Banker."
|
||||
},
|
||||
2018: {
|
||||
icon: "../assests/images/2015-Icon.png",
|
||||
heading: "ASK launches its first offshore fund - ASK Global Strategies Fund",
|
||||
sub: "TWICE IN A ROW: ASK Wealth advisors adjudged 'Best Performing Financial Advisor' - Wealth 2016-17 by UTI MF & CNBC TV18."
|
||||
},
|
||||
2019: {
|
||||
icon: "../assests/images/1983-Icon.png",
|
||||
heading: "Hall of Fame",
|
||||
sub: "ASK Wealth Advisors inducted into the 'Hall of Fame' at the Financial Advisor Awards for the Years 2018-19 and 2019-20 by UTI MF & CNBC TV18."
|
||||
},
|
||||
2020: {
|
||||
icon: "../assests/images/2015-Icon.png",
|
||||
heading: "Outstanding Private Bank",
|
||||
sub: "Outstanding Private Bank for UNHW clients at the Private Banker International Global Wealth Summit & Awards 2020, Singapore."
|
||||
},
|
||||
2022: {
|
||||
icon: "../assests/images/2022-icon.png",
|
||||
heading: "Blackstone Acquisition",
|
||||
sub: "Blackstone acquires majority stake in ASK Group. Advent International exits."
|
||||
}
|
||||
};
|
||||
|
||||
// ===============================
|
||||
// Generate Swiper Slides
|
||||
// ===============================
|
||||
const swiperWrapper = document.querySelector(".swiper-wrapper");
|
||||
const timelineItems = document.querySelectorAll(".timeline-item");
|
||||
|
||||
timelineItems.forEach((item) => {
|
||||
const year = item.dataset.year;
|
||||
const content = timelineData[year] || { icon: "", heading: "", sub: "" };
|
||||
|
||||
const slide = document.createElement("div");
|
||||
slide.classList.add("swiper-slide");
|
||||
|
||||
slide.innerHTML = `
|
||||
${content.icon ? `<img src="${content.icon}" alt="icon" />` : ""}
|
||||
<h2>${year}</h2>
|
||||
${content.heading ? `<p class="heading">${content.heading}</p>` : ""}
|
||||
${content.sub ? `<div class="sub-heading-container"><p>${content.sub}</p></div>` : ""}
|
||||
`;
|
||||
|
||||
swiperWrapper.appendChild(slide);
|
||||
});
|
||||
|
||||
// ===============================
|
||||
// Timeline Line Fill
|
||||
// ===============================
|
||||
const lineFill = document.querySelector(".line-fill");
|
||||
const totalKites = timelineItems.length;
|
||||
|
||||
function updateTimeline(index) {
|
||||
timelineItems.forEach((item, i) => {
|
||||
item.classList.toggle("active", i === index);
|
||||
});
|
||||
|
||||
const timelineWidth = document.querySelector(".timeline").offsetWidth - 40; // adjust for padding
|
||||
const newWidth = (timelineWidth / (totalKites - 1)) * index;
|
||||
lineFill.style.width = newWidth + "px";
|
||||
}
|
||||
|
||||
// ===============================
|
||||
// Initialize Swiper
|
||||
// ===============================
|
||||
const swiper = new Swiper(".mySwiper", {
|
||||
spaceBetween: 20,
|
||||
centeredSlides: true,
|
||||
effect: "fade",
|
||||
autoplay: {
|
||||
delay: 2500,
|
||||
disableOnInteraction: false
|
||||
},
|
||||
navigation: {
|
||||
nextEl: ".swiper-button-next",
|
||||
prevEl: ".swiper-button-prev"
|
||||
}
|
||||
});
|
||||
|
||||
// Update timeline on slide change
|
||||
swiper.on("slideChange", () => {
|
||||
updateTimeline(swiper.realIndex);
|
||||
});
|
||||
|
||||
// Initial timeline update
|
||||
updateTimeline(0);
|
||||
@@ -1,3 +1,20 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
|
||||
<!-- Swiper CSS -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"/>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
|
||||
|
||||
<!-- Custom CSS -->
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<section class="hero_banner">
|
||||
<div class="banner_overlay">
|
||||
<div class="hero_content">
|
||||
@@ -69,6 +86,43 @@
|
||||
<section class="history_animation">
|
||||
<div class="container">
|
||||
<h1 class="title">Our History</h1>
|
||||
|
||||
<!-- Timeline -->
|
||||
<ul class="timeline">
|
||||
<li class="timeline-item" data-year="1983"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="1991"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2007"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2008"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2013"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2015"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2016"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2017"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2018"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2019"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2020"><span class="kite"></span></li>
|
||||
<li class="timeline-item" data-year="2022"><span class="kite"></span></li>
|
||||
<div class="line-fill"></div>
|
||||
</ul>
|
||||
|
||||
<!-- Swiper -->
|
||||
<div class="swiper mySwiper">
|
||||
<div class="swiper-wrapper" id="swiper-content">
|
||||
<!-- Slides will be generated dynamically -->
|
||||
</div>
|
||||
<div class="swiper-button-next"></div>
|
||||
<div class="swiper-button-prev"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Bootstrap JS -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
<!-- Swiper JS -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
|
||||
|
||||
<script src="/js/script.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
@@ -1,6 +1,16 @@
|
||||
<section class="py-5 text-center">
|
||||
<div class="container">
|
||||
<h1>Contact Us</h1>
|
||||
<p>Get in touch via email or phone.</p>
|
||||
<section class="contact-banner">
|
||||
<div class="container contact-aling" >
|
||||
<div class="row">
|
||||
<div class="col-md-12 ">
|
||||
<h1 class="contact-tittle-banner">Contact Us</h1>
|
||||
<p class="contact-text-banner">We're here to guide you on your wealth-building journey.</p>
|
||||
<div class="button-to">
|
||||
<span class="invest-contact">
|
||||
<a href="#" class="">write to us</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
257
pages/home.html
257
pages/home.html
File diff suppressed because one or more lines are too long
@@ -1,4 +1,4 @@
|
||||
<section class="ask-advantage3 container">
|
||||
<section class="ask-advantage3">
|
||||
<div class="coming-soon-container">
|
||||
<div class="content">
|
||||
<img src="../assests/images/Coming-Soon.svg" alt="Growth Icon" class="icon" />
|
||||
|
||||
Reference in New Issue
Block a user