Skip to content

Commit e484814

Browse files
add review
1 parent d5a97bb commit e484814

File tree

6 files changed

+108
-35
lines changed

6 files changed

+108
-35
lines changed

apps/codingcatdev/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@
5555
"@cloudinary/html": "^1.11.2",
5656
"@cloudinary/url-gen": "^1.11.2",
5757
"@floating-ui/dom": "^1.5.3",
58+
"@steeze-ui/material-design-icons": "^1.1.2",
5859
"esm-env": "^1.0.0",
5960
"firebase": "^10.4.0",
6061
"gsap": "^3.12.2",

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@
4343
<div class="flex">
4444
<div>
4545
<Avatar
46-
src="https://media.codingcat.dev/image/upload/v1684688346/main-codingcatdev-photo/podcast-guest/james_r_perkins.jpg"
46+
src="https://media.codingcat.dev/image/upload/v1682988242/main-codingcatdev-photo/podcast-guest/whitep4nth3r.jpg"
4747
class="border-2 border-primary-500"
4848
/>
4949
</div>
@@ -73,13 +73,13 @@
7373
</div>
7474
<div class="-ml-8 z-10">
7575
<Avatar
76-
src="https://media.codingcat.dev/image/upload/v1645887998/main-codingcatdev-photo/authors/alex_headshot.png"
76+
src="https://media.codingcat.dev/image/upload/v1682991864/main-codingcatdev-photo/podcast-guest/cassidoo.jpg"
7777
class="border-2 border-primary-500"
7878
/>
7979
</div>
8080
<div class="-ml-8 z-10">
8181
<Avatar
82-
src="https://media.codingcat.dev/image/upload/v1648041803/main-codingcatdev-photo/authors/brittney.jpg"
82+
src="https://media.codingcat.dev/image/upload/v1683033670/main-codingcatdev-photo/podcast-guest/maxcell.jpg"
8383
class="border-2 border-primary-500"
8484
/>
8585
</div>

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

Lines changed: 51 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,59 @@
11
<script>
2-
import { Icon } from '@steeze-ui/svelte-icon';
3-
import { VideoCamera, Star } from '@steeze-ui/heroicons';
2+
import { ContentType } from '$lib/types';
3+
import ReviewCard from './ReviewCard.svelte';
44
</script>
55

66
<section class="relative pt-20">
77
<div class="bg-surface-300 h-96">
8-
<div class="flex gap-8 absolute top-0 -left-20">
9-
<div class="bcu-card max-w-sm -rotate-2">
10-
<div class="p-4 space-y-4">
11-
<article>
12-
<p>The CSS Animations course is phenomenal. Very beginner-friendly!</p>
13-
</article>
14-
<footer class="flex justify-between">
15-
<a href="/course/css-animations">CSS Animations</a>
16-
<Icon src={VideoCamera} theme="mini" class="w-6" />
17-
</footer>
18-
</div>
19-
</div>
20-
<div class="bcu-card max-w-sm rotate-2">
21-
<div class="p-4 space-y-4">
22-
<div class="flex">
23-
<Icon src={Star} theme="mini" class="w-6" />
24-
<Icon src={Star} theme="mini" class="w-6" />
25-
<Icon src={Star} theme="mini" class="w-6" />
26-
<Icon src={Star} theme="mini" class="w-6" />
27-
<Icon src={Star} theme="mini" class="w-6" />
28-
</div>
29-
<article>
30-
<p>The CSS Animations course is phenomenal. Very beginner-friendly!</p>
31-
</article>
32-
<footer class="flex justify-between">
33-
<a href="/course/css-animations">CSS Animations</a>
34-
<Icon src={VideoCamera} theme="mini" class="w-6" />
35-
</footer>
36-
</div>
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+
/>
3757
</div>
3858
</div>
3959
</div>
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<script lang="ts">
2+
import { Icon, type IconSource } from '@steeze-ui/svelte-icon';
3+
import { Star } from '@steeze-ui/heroicons';
4+
import { ContentType } from '$lib/types';
5+
export let position: 'left' | 'right';
6+
export let stars: number;
7+
export let description: string;
8+
export let link: { href: string; name: string };
9+
export let icon: ContentType;
10+
11+
import Courses from '$lib/components/global/icons/nav/Courses.svelte';
12+
import Podcasts from '$lib/components/global/icons/nav/Podcasts.svelte';
13+
14+
$: positionStyle =
15+
position === 'left'
16+
? '-rotate-2 !bg-primary-300 !text-primary-300-token'
17+
: 'rotate-2 !bg-white !text-primary-300-token';
18+
</script>
19+
20+
<div class={`bcu-card w-96 snap-center shrink-0 ${positionStyle} ${$$props.class}`}>
21+
<div class="p-4 space-y-4">
22+
<div class="flex !text-primary-500">
23+
{#each Array(stars) as star}
24+
<Icon src={Star} theme="mini" class="w-6" />
25+
{/each}
26+
</div>
27+
<article>
28+
<p>{description}</p>
29+
</article>
30+
<footer class="flex justify-between">
31+
<a class="text-sm" href={link.href}>{link.name}</a>
32+
{#if icon === ContentType.course}
33+
<Courses />
34+
{/if}
35+
{#if icon === ContentType.podcast}
36+
<Podcasts />
37+
{/if}
38+
</footer>
39+
</div>
40+
</div>
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
<script>
22
import HomeCampaign from './(home-partials)/(home-campaign)/HomeCampaign.svelte';
3+
import HomeLatestCourse from './(home-partials)/(home-latest-course)/HomeLatestCourse.svelte';
34
import HomeReviews from './(home-partials)/(home-reviews)/HomeReviews.svelte';
45
</script>
56

67
<HomeCampaign />
78
<HomeReviews />
9+
<HomeLatestCourse />

pnpm-lock.yaml

Lines changed: 11 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)