From 13a46106af6467a9a8fe674c119f6e51514d2f66 Mon Sep 17 00:00:00 2001 From: Ernst Mulders Date: Tue, 8 Oct 2024 13:34:58 +0200 Subject: [PATCH 01/30] Revert "Revert "Students page"" --- src/app.css | 40 ++++ src/lib/components/FooterNav.svelte | 5 +- src/lib/components/animated/Text.svelte | 16 ++ src/lib/components/ui/InlineTag.svelte | 2 +- src/lib/layouts/DocsArticle.svelte | 2 +- src/lib/layouts/DocsTutorial.svelte | 2 +- src/lib/layouts/Main.svelte | 2 +- src/markdoc/tags/Tabs.svelte | 9 +- src/routes/+page.svelte | 10 +- .../[platform]/[service]/+page.svelte | 16 +- src/routes/students/(assets)/beaker.svg | 18 ++ src/routes/students/(assets)/chat-icon.svg | 16 ++ src/routes/students/(assets)/chat.svg | 86 +++++++++ src/routes/students/(assets)/checkmark.svg | 10 + src/routes/students/(assets)/github-mark.svg | 4 + src/routes/students/(assets)/kickstart.svg | 83 ++++++++ .../students/(components)/CallToAction.svelte | 26 +++ .../students/(components)/Community.svelte | 24 +++ src/routes/students/(components)/FAQ.svelte | 114 +++++++++++ .../students/(components)/GetStarted.svelte | 62 ++++++ src/routes/students/(components)/Hero.svelte | 181 ++++++++++++++++++ .../students/(components)/Kickstart.svelte | 23 +++ src/routes/students/(components)/Logos.svelte | 70 +++++++ src/routes/students/+page.svelte | 49 +++++ 24 files changed, 847 insertions(+), 23 deletions(-) create mode 100644 src/lib/components/animated/Text.svelte create mode 100644 src/routes/students/(assets)/beaker.svg create mode 100644 src/routes/students/(assets)/chat-icon.svg create mode 100644 src/routes/students/(assets)/chat.svg create mode 100644 src/routes/students/(assets)/checkmark.svg create mode 100644 src/routes/students/(assets)/github-mark.svg create mode 100644 src/routes/students/(assets)/kickstart.svg create mode 100644 src/routes/students/(components)/CallToAction.svelte create mode 100644 src/routes/students/(components)/Community.svelte create mode 100644 src/routes/students/(components)/FAQ.svelte create mode 100644 src/routes/students/(components)/GetStarted.svelte create mode 100644 src/routes/students/(components)/Hero.svelte create mode 100644 src/routes/students/(components)/Kickstart.svelte create mode 100644 src/routes/students/(components)/Logos.svelte create mode 100644 src/routes/students/+page.svelte diff --git a/src/app.css b/src/app.css index 0610b9496d..e4496d66cd 100644 --- a/src/app.css +++ b/src/app.css @@ -53,6 +53,7 @@ --color-white: hsl(0 0% 100%); --color-black: hsl(0 0% 0%); --color-transparent: rgba(0, 0, 0, 0); + --color-smooth: hsl(var(--color-greyscale-hue) 6%, 10%, 0.04); --color-greyscale-25: hsl(var(--color-greyscale-hue) 11% 98%); --color-greyscale-50: hsl(var(--color-greyscale-hue) 11% 94%); --color-greyscale-100: hsl(var(--color-greyscale-hue) 6% 90%); @@ -68,8 +69,16 @@ --color-greyscale-850: hsl(var(--color-greyscale-hue) 3% 14%); --color-greyscale-900: hsl(var(--color-greyscale-hue) 5.7% 10.4%); + /* utility colors */ + --color-badge-bg-light: #f2c8d6; + --color-badge-border-light: #f69db7; + --color-badge-bg-dark: #2c2c2f; + --color-badge-border-dark: #39393c; + /* Animations */ --animate-scale-in: scale-in 200ms ease-out forwards; + --animate-text: fade-in 0.75s ease-in-out both, blur 0.75s ease-in-out both, + up 0.75s ease-in-out both; /* Pink polyfills */ --transition: 0.2s; @@ -84,6 +93,33 @@ } } + @keyframes blur { + 0% { + filter: blur(5px); + } + 100% { + filter: blur(0); + } + } + + @keyframes up { + 0% { + transform: translateY(8px); + } + 100% { + transform: translateY(0px); + } + } + + @keyframes fade-in { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } + } + /* Fonts */ --font-family-sans: 'Inter', arial, sans-serif; --font-family-mono: 'Fira Code', monospace; @@ -152,12 +188,16 @@ --color-primary: var(--color-greyscale-900); --color-secondary: var(--color-greyscale-700); --color-accent: var(--color-pink-600); + --color-badge-bg: var(--color-badge-bg-light); + --color-badge-border: var(--color-badge-border-light); } /* dark theme */ .dark { --color-primary: var(--color-greyscale-100); --color-secondary: var(--color-greyscale-300); + --color-badge-bg: var(--color-badge-bg-dark); + --color-badge-border: var(--color-badge-border-dark); } /* Container */ diff --git a/src/lib/components/FooterNav.svelte b/src/lib/components/FooterNav.svelte index c966eb07b7..9d052b2500 100644 --- a/src/lib/components/FooterNav.svelte +++ b/src/lib/components/FooterNav.svelte @@ -68,7 +68,8 @@ ], Programs: [ { label: 'Heroes', href: '/heroes' }, - { label: 'Startups', href: '/startups' } + { label: 'Startups', href: '/startups' }, + { label: 'Students', href: '/students' } ], About: [ { label: 'Company', href: '/company' }, @@ -101,7 +102,7 @@ {#each Object.entries(links) as [title, items]}

  • {title}

    diff --git a/src/lib/components/animated/Text.svelte b/src/lib/components/animated/Text.svelte new file mode 100644 index 0000000000..720317ae95 --- /dev/null +++ b/src/lib/components/animated/Text.svelte @@ -0,0 +1,16 @@ + + +{text} + + {#each words as word, i} + {word} + {/each} + diff --git a/src/lib/components/ui/InlineTag.svelte b/src/lib/components/ui/InlineTag.svelte index 3bd813cfd5..bab673e0b3 100644 --- a/src/lib/components/ui/InlineTag.svelte +++ b/src/lib/components/ui/InlineTag.svelte @@ -1,5 +1,5 @@
    diff --git a/src/lib/layouts/DocsArticle.svelte b/src/lib/layouts/DocsArticle.svelte index 9281b413ab..fc30be1cfb 100644 --- a/src/lib/layouts/DocsArticle.svelte +++ b/src/lib/layouts/DocsArticle.svelte @@ -99,7 +99,7 @@
    • {/each} -
    +