Skip to content

Commit 55f85ba

Browse files
author
Alex FusionAuth
committed
add latest course
1 parent e484814 commit 55f85ba

File tree

8 files changed

+200
-59
lines changed

8 files changed

+200
-59
lines changed

‎apps/codingcatdev/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
"@auth/sveltekit": "^0.3.7",
1818
"@codingcatdev/blackcatui": "^0.1.0",
1919
"@firebase/app-types": "~0.9.0",
20+
"@fontsource/shadows-into-light": "^5.0.13",
2021
"@playwright/test": "^1.38.1",
2122
"@steeze-ui/heroicons": "^2.2.3",
2223
"@steeze-ui/simple-icons": "^1.5.1",

‎apps/codingcatdev/src/app.postcss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,4 @@
44
@import './styles/nav-list.css';
55
@import './styles/grid-card.css';
66
@import './styles/markdown.css';
7+
@import '@fontsource/shadows-into-light'

‎apps/codingcatdev/src/routes/(home-partials)/(home-campaign)/HomeCampaign.svelte‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
</script>
1212

1313
<section
14-
class="grid justify-center grid-cols-1 p-8 mx-auto gap-2 2xl:gap-10 2xl:min-h-768 max-w-7xl"
14+
class="grid justify-center grid-cols-1 px-8 pt-12 mx-auto gap-2 2xl:gap-10 2xl:min-h-768 max-w-7xl"
1515
>
1616
<div class="flex">
1717
<div class="flex flex-col basis-1/12 relative">
@@ -22,7 +22,7 @@
2222
<CodeSvg />
2323
<GitLineGradient />
2424
</div>
25-
<div class="basis-11/12 pt-44 mt-44 pl-4 sm:pl-2">
25+
<div class="basis-11/12 pt-44 mt-44 pl-4 sm:pl-2 mb-40">
2626
<div class="flex w-full justify-center">
2727
<div class="max-w-lg flex flex-col gap-8 text-center relative items-center">
2828
<div class="absolute w-16 h-16 -top-8 -left-2 -z-10">

‎apps/codingcatdev/src/routes/(home-partials)/(home-latest-course)/CheckOutArrow.svelte‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<svg
2+
width="100%"
3+
height="100%"
4+
viewBox="0 0 141 303"
5+
fill="none"
6+
xmlns="http://www.w3.org/2000/svg"
7+
>
8+
<path
9+
d="M88.772 3.19857C42.9732 66.8937 -46.6711 170.884 39.1679 240.067C60.1958 257.015 83.74 257.935 109.479 260.686C110.591 260.804 136.777 259.434 134.179 256.863C127.22 249.978 86.8409 208.781 113.277 235.241C116.074 238.04 138.279 253.85 137.839 257.972C136.639 269.201 92.2978 292.361 82.9803 299.861"
10+
stroke="#453488"
11+
stroke-width="5"
12+
stroke-linecap="round"
13+
/>
14+
</svg>

‎apps/codingcatdev/src/routes/(home-partials)/(home-latest-course)/HomeLatestCourse.svelte‎

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
1+
<script>
2+
import Video from '$lib/components/content/Video.svelte';
3+
import GitLineGradient from '../(home-campaign)/GitLineGradient.svelte';
4+
import CheckOutArrow from './CheckOutArrow.svelte';
5+
</script>
6+
7+
<div class=" bg-surface-800-100-token h-[800px]" />
8+
9+
<section
10+
class="grid justify-center grid-cols-1 px-8 mx-auto gap-2 2xl:gap-10 2xl:min-h-768 max-w-7xl relative z-10"
11+
>
12+
<div class="flex">
13+
<div class="flex flex-col basis-1/12 relative">
14+
<GitLineGradient />
15+
</div>
16+
<div class="basis-11/12 pt-44 pl-4 sm:pl-2 -mt-80">
17+
<div class="max-w-6xl -mt-80 flex flex-col gap-24 text-surface-50-900-token relative">
18+
<div class="max-w-lg flex flex-col gap-8 text-center relative items-center mx-auto">
19+
<h2>Svelte Front-to-Back</h2>
20+
<p>
21+
Learn how to build performant full-stack web applications using the Svelte framework
22+
from start to production
23+
</p>
24+
</div>
25+
<div class="check-out-text">Check out our latest course!</div>
26+
<div class="check-out-arrow"><CheckOutArrow /></div>
27+
<div class="block">
28+
<Video src="https://youtu.be/sp7qvtvCFv8" title="Svelte" />
29+
</div>
30+
</div>
31+
</div>
32+
</div>
33+
</section>
34+
35+
<style>
36+
@media (max-width: 390px) {
37+
.check-out-text {
38+
display: none;
39+
}
40+
.check-out-arrow {
41+
display: none;
42+
}
43+
}
44+
@media (min-width: 390px) {
45+
.check-out-text {
46+
position: absolute;
47+
48+
width: 144px;
49+
height: 166px;
50+
left: 0px;
51+
top: -120px;
52+
53+
font-family: 'Shadows Into Light';
54+
font-style: normal;
55+
font-weight: 400;
56+
font-size: 24px;
57+
line-height: 130.14%;
58+
text-align: center;
59+
60+
transform: rotate(-20deg);
61+
}
62+
.check-out-arrow {
63+
position: absolute;
64+
65+
width: 41px;
66+
height: 243px;
67+
left: -40px;
68+
top: -140px;
69+
70+
transform: rotate(6.1deg);
71+
}
72+
}
73+
@media (min-width: 640px) {
74+
.check-out-text {
75+
width: 144px;
76+
height: 166px;
77+
left: 100px;
78+
top: -150px;
79+
80+
font-size: 34px;
81+
}
82+
.check-out-arrow {
83+
width: 41px;
84+
height: 243px;
85+
left: 80px;
86+
top: -120px;
87+
}
88+
}
89+
@media (min-width: 1024px) {
90+
.check-out-text {
91+
width: 344px;
92+
height: 166px;
93+
left: 0px;
94+
top: -140px;
95+
96+
font-size: 64px;
97+
}
98+
.check-out-arrow {
99+
width: 141px;
100+
height: 343px;
101+
left: -80px;
102+
top: 20px;
103+
}
104+
}
105+
@media (min-width: 1280px) {
106+
.check-out-text {
107+
width: 344px;
108+
height: 166px;
109+
left: 0px;
110+
top: -100px;
111+
112+
font-size: 64px;
113+
}
114+
.check-out-arrow {
115+
width: 141px;
116+
height: 343px;
117+
left: -80px;
118+
top: 60px;
119+
}
120+
}
121+
</style>

‎apps/codingcatdev/src/routes/(home-partials)/(home-reviews)/HomeReviews.svelte‎

Lines changed: 50 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -3,58 +3,56 @@
33
import ReviewCard from './ReviewCard.svelte';
44
</script>
55

6-
<section class="relative pt-20">
7-
<div class="bg-surface-300 h-96">
8-
<div class="absolute top-0 left-0 w-full">
9-
<div class="snap-x scroll-px-4 snap-mandatory scroll-smooth flex gap-4 overflow-x-auto py-10">
10-
<ReviewCard
11-
position="left"
12-
stars={5}
13-
description="The CSS Animations course is phenomenal. Very beginner-friendly!"
14-
link={{ href: '/course/css-animations', name: 'CSS Animations' }}
15-
icon={ContentType.course}
16-
/>
17-
<ReviewCard
18-
position="right"
19-
stars={5}
20-
description="I LOVED the podcast episode with Rich Harris! Very well-informed discussion about the web!"
21-
link={{
22-
href: '/podcast/2-17-building-the-future-of-svelte-at-vercel',
23-
name: 'Building the Future of Svelte at Vercel'
24-
}}
25-
icon={ContentType.podcast}
26-
/>
27-
<ReviewCard
28-
position="left"
29-
stars={5}
30-
description="The Ultimate Svelte Guide course is one of the best out there!"
31-
link={{
32-
href: '/course/svelte',
33-
name: 'Learn Svelte: The Ultimate Guide'
34-
}}
35-
icon={ContentType.course}
36-
/>
37-
<ReviewCard
38-
position="right"
39-
stars={5}
40-
description="Fireship is the best, congratulations on the interview 🎉🎉"
41-
link={{
42-
href: 'http://localhost:5173/podcast/0-9-jeff-delaney-of-fireship-io',
43-
name: 'Fireship.io'
44-
}}
45-
icon={ContentType.podcast}
46-
/>
47-
<ReviewCard
48-
position="left"
49-
stars={5}
50-
description="Dude! This video series is the cleanest, simplest, best paced, that I've found on Svelte so far."
51-
link={{
52-
href: '/course/sveltekit-firebase/lesson/2_5-inputs-bindings-and-reactivity',
53-
name: 'Svelte Input Bindings'
54-
}}
55-
icon={ContentType.course}
56-
/>
57-
</div>
6+
<section class="relative">
7+
<div class="absolute top-0 left-0 w-full -my-32">
8+
<div class="snap-x scroll-px-4 snap-mandatory scroll-smooth flex gap-4 overflow-x-auto py-10">
9+
<ReviewCard
10+
position="left"
11+
stars={5}
12+
description="The CSS Animations course is phenomenal. Very beginner-friendly!"
13+
link={{ href: '/course/css-animations', name: 'CSS Animations' }}
14+
icon={ContentType.course}
15+
/>
16+
<ReviewCard
17+
position="right"
18+
stars={5}
19+
description="I LOVED the podcast episode with Rich Harris! Very well-informed discussion about the web!"
20+
link={{
21+
href: '/podcast/2-17-building-the-future-of-svelte-at-vercel',
22+
name: 'Building the Future of Svelte at Vercel'
23+
}}
24+
icon={ContentType.podcast}
25+
/>
26+
<ReviewCard
27+
position="left"
28+
stars={5}
29+
description="The Ultimate Svelte Guide course is one of the best out there!"
30+
link={{
31+
href: '/course/svelte',
32+
name: 'Learn Svelte: The Ultimate Guide'
33+
}}
34+
icon={ContentType.course}
35+
/>
36+
<ReviewCard
37+
position="right"
38+
stars={5}
39+
description="Fireship is the best, congratulations on the interview 🎉🎉"
40+
link={{
41+
href: 'http://localhost:5173/podcast/0-9-jeff-delaney-of-fireship-io',
42+
name: 'Fireship.io'
43+
}}
44+
icon={ContentType.podcast}
45+
/>
46+
<ReviewCard
47+
position="left"
48+
stars={5}
49+
description="Dude! This video series is the cleanest, simplest, best paced, that I've found on Svelte so far."
50+
link={{
51+
href: '/course/sveltekit-firebase/lesson/2_5-inputs-bindings-and-reactivity',
52+
name: 'Svelte Input Bindings'
53+
}}
54+
icon={ContentType.course}
55+
/>
5856
</div>
5957
</div>
6058
</section>

‎apps/codingcatdev/src/routes/(home-partials)/(home-reviews)/ReviewCard.svelte‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,12 @@
1111
import Courses from '$lib/components/global/icons/nav/Courses.svelte';
1212
import Podcasts from '$lib/components/global/icons/nav/Podcasts.svelte';
1313
14-
$: positionStyle =
15-
position === 'left'
16-
? '-rotate-2 !bg-primary-300 !text-primary-300-token'
17-
: 'rotate-2 !bg-white !text-primary-300-token';
14+
$: positionStyle = position === 'left' ? '-rotate-2 !bg-primary-300' : 'rotate-2 !bg-white';
1815
</script>
1916

20-
<div class={`bcu-card w-96 snap-center shrink-0 ${positionStyle} ${$$props.class}`}>
17+
<div
18+
class={`bcu-card w-96 snap-center shrink-0 !text-surface-500 ${positionStyle} ${$$props.class}`}
19+
>
2120
<div class="p-4 space-y-4">
2221
<div class="flex !text-primary-500">
2322
{#each Array(stars) as star}

‎pnpm-lock.yaml‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)