diff --git a/package.json b/package.json index 11fbbaa..da2e6ad 100644 --- a/package.json +++ b/package.json @@ -13,15 +13,19 @@ }, "devDependencies": { "@sveltejs/adapter-auto": "^2.0.0", + "@sveltejs/adapter-static": "^1.0.0-next.50", "@sveltejs/kit": "^1.20.4", "autoprefixer": "^10.4.16", "eslint": "^8.28.0", "eslint-config-prettier": "^8.5.0", "eslint-plugin-svelte": "^2.30.0", + "gsap": "^3.12.2", "postcss": "^8.4.31", "prettier": "^3.0.3", "prettier-plugin-svelte": "^3.0.3", "sass": "^1.68.0", + "scrollmagic": "^2.0.8", + "scrollmagic-plugin-gsap": "^1.0.4", "svelte": "^4.0.5", "svelte-check": "^3.4.3", "tailwindcss": "^3.3.3", @@ -31,6 +35,7 @@ "type": "module", "dependencies": { "@splidejs/splide-extension-auto-scroll": "^0.5.3", - "@splidejs/svelte-splide": "^0.2.9" + "@splidejs/svelte-splide": "^0.2.9", + "scrollmagic-with-ssr": "^1.0.2" } } diff --git a/src/components/FAQ.svelte b/src/components/FAQ.svelte index ba3e1bf..c97881d 100644 --- a/src/components/FAQ.svelte +++ b/src/components/FAQ.svelte @@ -38,15 +38,16 @@ -
- +

Frequently asked questions

Explore FAQs about Da One Global Ventures: Focus, Funding, Support

{#each faqItems as faqItem, index (faqItem.question)}
@@ -85,4 +86,12 @@
+ + + diff --git a/src/components/Footer.svelte b/src/components/Footer.svelte index c311a67..cf972c8 100644 --- a/src/components/Footer.svelte +++ b/src/components/Footer.svelte @@ -10,18 +10,24 @@ -
- +
-
-

+
+ +
+

© 2023 Da One Global Venutres

diff --git a/src/components/Funding.svelte b/src/components/Funding.svelte index 62980b3..f2285d9 100644 --- a/src/components/Funding.svelte +++ b/src/components/Funding.svelte @@ -3,28 +3,31 @@ -
- +
+
-
-

+
+

We take you from Seed to Series A

-

- At Da One, we're your ultimate partner in turning startup dreams into Series A - reality. Our secret sauce? A laser-focused approach, a vast network of investors, and - hands-on support, tailored to your unique journey. +

+ At Da One, we're your ultimate partner in turning startup dreams into Series A reality. + Our secret sauce? A laser-focused approach, a vast network of investors, and hands-on + support, tailored to your unique journey.

-

- With us, you're not just another - startup; you're the future success story. +

+ With us, you're not just another startup; you're the future success story.

-
- -
+
+ +

diff --git a/src/components/GeneralPartners.svelte b/src/components/GeneralPartners.svelte index 4f3c3ed..41878be 100644 --- a/src/components/GeneralPartners.svelte +++ b/src/components/GeneralPartners.svelte @@ -1,17 +1,66 @@ -
-
-

Shikhar Dhawan

-

- Shikhar Dhawan is an Indian cricketer. A left-handed opening batsman, he captains Punjab Kings - in the Indian Premier League and plays for Delhi in first-class cricket. -

-

- At the 2013 Champions Trophy and 2017 Champions Trophy, Dhawan was the leading run-scorer and - was awarded the 'Golden Bat' in both the tournaments. + + +

+
+

Success Sherpas

+

+ Our pillars of guidance and support, who help us reach the summit of success!

+ +
+

+ Shikhar Dhawan +

+

+ Shikhar Dhawan is an Indian cricketer. A left-handed opening batsman, he captains Punjab + Kings in the Indian Premier League and plays for Delhi in first-class cricket. +

+

+ At the 2013 Champions Trophy and 2017 Champions Trophy, Dhawan was the leading run-scorer + and was awarded the 'Golden Bat' in both the tournaments. +

+
+
+ +
+ + +
+

+ Shikhar Dhawan +

+

+ Shikhar Dhawan is an Indian cricketer. A left-handed opening batsman, he captains Punjab + Kings in the Indian Premier League and plays for Delhi in first-class cricket. +

+

+ At the 2013 Champions Trophy and 2017 Champions Trophy, Dhawan was the leading run-scorer + and was awarded the 'Golden Bat' in both the tournaments. +

+
+
+ +
+ + +
+

+ Shikhar Dhawan +

+

+ Shikhar Dhawan is an Indian cricketer. A left-handed opening batsman, he captains Punjab + Kings in the Indian Premier League and plays for Delhi in first-class cricket. +

+

+ At the 2013 Champions Trophy and 2017 Champions Trophy, Dhawan was the leading run-scorer + and was awarded the 'Golden Bat' in both the tournaments. +

+
+
+ +
+
-
- -
-
-
+
diff --git a/src/components/Globe/Index.svelte b/src/components/Globe/Index.svelte index 181375e..32683d3 100644 --- a/src/components/Globe/Index.svelte +++ b/src/components/Globe/Index.svelte @@ -7,7 +7,9 @@ }); -
+
li { opacity: 0.4; position: absolute; - margin-left: -($dotSize / 2); - margin-top: -($dotSize / 2); + margin-left: -1 * calc($dotSize / 2); + margin-top: -1 * calc($dotSize / 2); width: $dotSize; height: $dotSize; border-radius: 50%; @@ -126,8 +128,8 @@ .globe .globe-list > li.active { opacity: 1; - margin-left: -($dotSizeLarge / 2); - margin-top: -($dotSizeLarge / 2); + margin-left: -1 * calc($dotSizeLarge / 2); + margin-top: -1 * calc($dotSizeLarge / 2); width: $dotSizeLarge; height: $dotSizeLarge; } @@ -139,8 +141,8 @@ position: absolute; left: 50%; top: 50%; - margin-left: -($dotSize / 2); - margin-top: -($dotSize / 2); + margin-left: -1 * calc($dotSize / 2); + margin-top: -1 * calc($dotSize / 2); width: $dotSize; height: $dotSize; border-radius: 50%; @@ -214,8 +216,8 @@ } .globe .globe-list > li.active:before { - margin-left: -($dotSizeLarge / 2); - margin-top: -($dotSizeLarge / 2); + margin-left: -1 * calc($dotSizeLarge / 2); + margin-top: -1 * calc($dotSizeLarge / 2); width: $dotSizeLarge; height: $dotSizeLarge; } diff --git a/src/components/GradientDivider.svelte b/src/components/GradientDivider.svelte index ba43747..646889d 100644 --- a/src/components/GradientDivider.svelte +++ b/src/components/GradientDivider.svelte @@ -1,5 +1,8 @@
- - - -
\ No newline at end of file + + +
diff --git a/src/components/GradientOverlay.svelte b/src/components/GradientOverlay.svelte new file mode 100644 index 0000000..b22e85b --- /dev/null +++ b/src/components/GradientOverlay.svelte @@ -0,0 +1,4 @@ +
diff --git a/src/components/Gradients/OvalWithCirlce.svelte b/src/components/Gradients/OvalWithCirlce.svelte new file mode 100644 index 0000000..7f8108a --- /dev/null +++ b/src/components/Gradients/OvalWithCirlce.svelte @@ -0,0 +1,26 @@ +
+ + + +
+ + diff --git a/src/components/Hero02.svelte b/src/components/Hero02.svelte index b4c0e65..da670e1 100644 --- a/src/components/Hero02.svelte +++ b/src/components/Hero02.svelte @@ -1,16 +1,29 @@ -
-
- -
-
-
diff --git a/src/components/Investment.svelte b/src/components/Investment.svelte index 39fd3b8..acdc4df 100644 --- a/src/components/Investment.svelte +++ b/src/components/Investment.svelte @@ -3,7 +3,7 @@ -
+
@@ -17,13 +17,13 @@

-

+

Co-Investments & Partnerships

-

+

Capitalizing on our vast global network, we foresee numerous co-investment prospects and exclusive sports industry partnerships.

diff --git a/src/components/Investors/StickyScroll.svelte b/src/components/Investors/StickyScroll.svelte new file mode 100644 index 0000000..521ea2b --- /dev/null +++ b/src/components/Investors/StickyScroll.svelte @@ -0,0 +1,48 @@ + + +
+
+ + +
+
+ +
+
+
+
+ + diff --git a/src/components/Investors/investor.js b/src/components/Investors/investor.js new file mode 100644 index 0000000..be4990a --- /dev/null +++ b/src/components/Investors/investor.js @@ -0,0 +1,63 @@ +import { browser } from '$app/environment'; +// @ts-ignore +import ScrollMagic from 'scrollmagic-with-ssr'; +import { TweenMax, TimelineMax, Linear } from 'gsap'; + +export const initInvestorsAnim = async () => { + if (!browser) return; + + const { ScrollMagicPluginGsap } = await import('scrollmagic-plugin-gsap'); + // @ts-ignore + ScrollMagicPluginGsap(ScrollMagic, TweenMax, TimelineMax); + + // @ts-ignore + const controller = new ScrollMagic.Controller(); + const tl = new TimelineMax(); + + const images = ['investor__image--1', 'investor__image--2', 'investor__image--3']; + + const obj = { curImg: 0 }; + + const tween = tl.to(obj, 0.5, { + curImg: images.length - 1, + roundProps: 'curImg', + immediateRender: true, + ease: Linear.easeNone, + onUpdate: function () { + var elements = document.querySelectorAll('.investor__image'); + for (var i = 0; i < elements.length; i++) { + // @ts-ignore + elements[i].style.visibility = 'hidden'; + } + // @ts-ignore + document.getElementById(images[obj.curImg]).style.visibility = 'visible'; + } + }); + + // @ts-ignore + new ScrollMagic.Scene({ + triggerElement: '.investor__trigger', + duration: '300%' + }) + .on('enter', () => { + document.querySelector('.investor__media')?.classList.add('active'); + }) + .on('leave', () => { + document.querySelector('.investor__media')?.classList.remove('active'); + }) + // @ts-ignore + .setTween(tween) + .addTo(controller); + + // Fading in elements once they are in the viewport + const fadeInElements = document.getElementsByClassName('fade'); + for (var i = 0; i < fadeInElements.length; i++) { + new ScrollMagic.Scene({ + triggerElement: fadeInElements[i], + reverse: false, + triggerHook: 1 + }) + .setClassToggle(fadeInElements[i], 'fade--active') + .addTo(controller); + } +}; diff --git a/src/components/Team.svelte b/src/components/Team.svelte index 7ea2cf0..bdfe89d 100644 --- a/src/components/Team.svelte +++ b/src/components/Team.svelte @@ -1,145 +1,175 @@ + + + -
- +
-

Success Sherpas

-

- Our pillars of guidance and support, who help us reach the summit of success! -

- -
- -
- - - - -
-

Andrew Bell

-

Founder

-
- - - -
-

Dr. Sandeep Gandhi

-

Project Coordinator

-
- - - -
-

Amitesh Shah

-

Founder

-
- - - -
-

Abhinav Tandon

-

Project Coordinator

-
- - - -
-

Akshay Chhugani

-

Founder

-
- - - -
-

Maharshi Ganatra

-

Founder

-
- - - -
-

Kumar Gaurav

-

Project Coordinator

-
- - - -
-

Akshay Grover

-

Founder

-
- - - -
-

Geetansh Sahni

-

Project Coordinator

-
- - - -
-

Rajeev Duggal

-

Founder

-
- - - -
-

Abhinav Tandon

-

Project Coordinator

-
- - - -
-

Raunak Hajela

-

Founder

-
- - +
+ +
+ + + +
+

+ Andrew Bell +

+

Founder

+
+ + + +
+

+ Dr. Sandeep Gandhi +

+

Project Coordinator

+
+ + + +
+

+ Amitesh Shah +

+

Founder

+
+ + + +
+

+ Abhinav Tandon +

+

Project Coordinator

+
+ + + +
+

+ Akshay Chhugani +

+

Founder

+
+ + + +
+

+ Maharshi Ganatra +

+

Founder

+
+ + + +
+

+ Kumar Gaurav +

+

Project Coordinator

+
+ + + +
+

+ Akshay Grover +

+

Founder

+
+ + + +
+

+ Geetansh Sahni +

+

Project Coordinator

+
+ + + +
+

+ Rajeev Duggal +

+

Founder

+
+ + + +
+

+ Abhinav Tandon +

+

Project Coordinator

+
+ + + +
+

+ Raunak Hajela +

+

Founder

+
+ + +
+
- - + +
-
+ \ No newline at end of file + diff --git a/src/hooks.js b/src/hooks.js new file mode 100644 index 0000000..8385ce8 --- /dev/null +++ b/src/hooks.js @@ -0,0 +1,6 @@ +export const handle = async ({ event, resolve }) => { + const response = await resolve(event, { + ssr: false + }); + return response; +}; diff --git a/src/lib/sticky.js b/src/lib/sticky.js new file mode 100644 index 0000000..2819086 --- /dev/null +++ b/src/lib/sticky.js @@ -0,0 +1,88 @@ +/** + * Svelte action that dispatches a custom stuck event when a node becomes stuck or unstuck (position: sticky is having an effect) + * @param node - the node the action is placed on + * @param params.callback - function to execute when the node becomes stuck or unstuck + */ +export default function sticky(node, { stickToTop }) { + const intersectionCallback = function (entries) { + // only observing one item at a time + const entry = entries[0]; + + let isStuck = false; + if (!entry.isIntersecting && isValidYPosition(entry)) { + isStuck = true; + } + + node.dispatchEvent( + new CustomEvent('stuck', { + detail: { isStuck } + }) + ); + }; + + const isValidYPosition = function ({ target, boundingClientRect }) { + if (target === stickySentinelTop) { + return boundingClientRect.y < 200; + } else { + return boundingClientRect.y > 200; + } + }; + + const mutationCallback = function (mutations) { + // If something changes and the sentinel nodes are no longer first and last child, put them back in position + mutations.forEach(function (mutation) { + const { parentNode: topParent } = stickySentinelTop; + const { parentNode: bottomParent } = stickySentinelBottom; + + if (stickySentinelTop !== topParent.firstChild) { + topParent.prepend(stickySentinelTop); + } + if (stickySentinelBottom !== bottomParent.lastChild) { + bottomParent.append(stickySentinelBottom); + } + }); + }; + + const intersectionObserver = new IntersectionObserver(intersectionCallback, {}); + const mutationObserver = new MutationObserver(mutationCallback); + + // we insert and observe a sentinel node immediately after the target + // when it is visible, the target node cannot be sticking + const sentinelStyle = 'position: absolute; height: 1px;'; + const stickySentinelTop = document.createElement('div'); + stickySentinelTop.classList.add('stickySentinelTop'); + // without setting a height, Safari breaks + stickySentinelTop.style = sentinelStyle; + node.parentNode.prepend(stickySentinelTop); + + const stickySentinelBottom = document.createElement('div'); + stickySentinelBottom.classList.add('stickySentinelBottom'); + stickySentinelBottom.style = sentinelStyle; + node.parentNode.append(stickySentinelBottom); + + if (stickToTop) { + intersectionObserver.observe(stickySentinelTop); + } else { + intersectionObserver.observe(stickySentinelBottom); + } + + mutationObserver.observe(node.parentNode, { childList: true }); + + return { + update({ stickToTop }) { + // change which sentinel we are observing + if (stickToTop) { + intersectionObserver.unobserve(stickySentinelBottom); + intersectionObserver.observe(stickySentinelTop); + } else { + intersectionObserver.unobserve(stickySentinelTop); + intersectionObserver.observe(stickySentinelBottom); + } + }, + + destroy() { + intersectionObserver.disconnect(); + mutationObserver.disconnect(); + } + }; +} diff --git a/src/routes/+layout.js b/src/routes/+layout.js new file mode 100644 index 0000000..61f03fa --- /dev/null +++ b/src/routes/+layout.js @@ -0,0 +1,16 @@ +// if you want to generate a static html file +// for your page. +// Documentation: https://kit.svelte.dev/docs/page-options#prerender +export const prerender = true; + +// if you want to Generate a SPA +// you have to set ssr to false. +// This is not the case (so set as true or comment the line) +// Documentation: https://kit.svelte.dev/docs/page-options#ssr +export const ssr = false; + +// How to manage the trailing slashes in the URLs +// the URL for about page witll be /about with 'ignore' (default) +// the URL for about page witll be /about/ with 'always' +// https://kit.svelte.dev/docs/page-options#trailingslash +export const trailingSlash = 'ignore'; diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 92d91a3..e6ab1b6 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -1,5 +1,5 @@ - - \ No newline at end of file + + diff --git a/src/routes/+page.js b/src/routes/+page.js new file mode 100644 index 0000000..61f03fa --- /dev/null +++ b/src/routes/+page.js @@ -0,0 +1,16 @@ +// if you want to generate a static html file +// for your page. +// Documentation: https://kit.svelte.dev/docs/page-options#prerender +export const prerender = true; + +// if you want to Generate a SPA +// you have to set ssr to false. +// This is not the case (so set as true or comment the line) +// Documentation: https://kit.svelte.dev/docs/page-options#ssr +export const ssr = false; + +// How to manage the trailing slashes in the URLs +// the URL for about page witll be /about with 'ignore' (default) +// the URL for about page witll be /about/ with 'always' +// https://kit.svelte.dev/docs/page-options#trailingslash +export const trailingSlash = 'ignore'; diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 80520a0..15b8196 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -14,4 +14,4 @@
-