diff --git a/index.html b/index.html index 6619ea6..ae554ed 100644 --- a/index.html +++ b/index.html @@ -2,9 +2,12 @@ - + - Vancouver + + + + Vancouver Investment Fund
diff --git a/public/favicon.svg b/public/favicon.svg new file mode 100644 index 0000000..ad66fc6 --- /dev/null +++ b/public/favicon.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + diff --git a/public/hero-background-dark.svg b/public/hero-background-dark.svg new file mode 100644 index 0000000..3e13a76 --- /dev/null +++ b/public/hero-background-dark.svg @@ -0,0 +1,111 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + € + + + + $ + + + + ₴ + + + + + 16.8M € + +12.5% + 2018 + ROI: 8.2% + Q1 2025 + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/hero-background.svg b/public/hero-background.svg new file mode 100644 index 0000000..489b51c --- /dev/null +++ b/public/hero-background.svg @@ -0,0 +1,111 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + € + + + + $ + + + + ₴ + + + + + 16.8M € + +12.5% + 2018 + ROI: 8.2% + Q1 2025 + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/vite.svg b/public/vite.svg deleted file mode 100644 index e7b8dfb..0000000 --- a/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/assets/svelte.svg b/src/assets/svelte.svg deleted file mode 100644 index c5e0848..0000000 --- a/src/assets/svelte.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/Home.svelte b/src/components/Home.svelte index 385d99b..1071a4d 100644 --- a/src/components/Home.svelte +++ b/src/components/Home.svelte @@ -74,9 +74,15 @@

{t('description', $language)}

-
- {t('nav_value', $language)} -
+ + + + + +
+
+
+ {t('nav_value', $language)}
@@ -203,8 +209,36 @@ /* Hero Section */ .hero { - padding: 4rem 0; - background: linear-gradient(135deg, var(--bg-color) 0%, var(--bg-secondary) 100%); + padding: 6rem 0; + background-image: url('/hero-background.svg'); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + position: relative; + min-height: 500px; + display: flex; + align-items: center; + } + + :global([data-theme="dark"]) .hero { + background-image: url('/hero-background-dark.svg'); + } + + .hero::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: linear-gradient(135deg, var(--bg-color) 0%, transparent 50%, var(--bg-secondary) 100%); + opacity: 0.8; + z-index: 1; + } + + .hero-content { + position: relative; + z-index: 2; } .hero-title { @@ -220,23 +254,35 @@ font-size: 1.125rem; color: var(--text-secondary); line-height: 1.6; - margin-bottom: 2rem; + margin-bottom: 0; text-align: center; max-width: 800px; margin-left: auto; margin-right: auto; } + /* NAV Value Section */ + .nav-section { + padding: 3rem 0; + background: var(--bg-color); + } + .nav-value { text-align: center; - padding: 1.5rem; - background: var(--bg-color); - border: 2px solid var(--primary-color); + padding: 2rem; + background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-hover) 100%); border-radius: 1rem; - font-size: 1.125rem; - color: var(--primary-color); - max-width: 600px; + font-size: 1.25rem; + color: white; + max-width: 700px; margin: 0 auto; + box-shadow: var(--shadow); + transition: transform 0.3s ease, box-shadow 0.3s ease; + } + + .nav-value:hover { + transform: translateY(-2px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); } /* Investment Areas */ @@ -446,9 +492,19 @@ } .hero { + padding: 4rem 0; + min-height: 400px; + } + + .nav-section { padding: 2rem 0; } + .nav-value { + padding: 1.5rem; + font-size: 1.125rem; + } + .section-title { font-size: 1.5rem; }