Skip to content

Commit a36f156

Browse files
codercatdevcodercatdev
committed
update search with logos
1 parent eaff2ac commit a36f156

File tree

8 files changed

+77
-20
lines changed

8 files changed

+77
-20
lines changed

‎apps/codingcatdev/src/lib/components/global/icons/nav/Blog.svelte‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,10 +69,10 @@
6969

7070
<style>
7171
.main {
72-
fill: hsl(var(--p));
72+
fill: rgba(var(--color-primary-500) / 1);
7373
}
7474
.line {
75-
stroke: hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));
76-
fill: hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));
75+
stroke: rgb(var(--on-primary));
76+
fill: rgb(var(--on-primary));
7777
}
7878
</style>

‎apps/codingcatdev/src/lib/components/global/icons/nav/Courses.svelte‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,10 @@
2222

2323
<style>
2424
.main {
25-
fill: hsl(var(--p));
25+
fill: rgba(var(--color-primary-500) / 1);
26+
}
27+
.line {
28+
stroke: rgb(var(--on-primary));
29+
fill: rgb(var(--on-primary));
2630
}
2731
</style>

‎apps/codingcatdev/src/lib/components/global/icons/nav/Schedule.svelte‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,10 @@
1818

1919
<style>
2020
.main {
21-
fill: hsl(var(--p));
21+
fill: rgba(var(--color-primary-500) / 1);
2222
}
2323
.line {
24-
stroke: hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));
25-
fill: hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));
24+
stroke: rgb(var(--on-primary));
25+
fill: rgb(var(--on-primary));
2626
}
2727
</style>

‎apps/codingcatdev/src/lib/components/global/icons/nav/Tutorials.svelte‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,10 @@
1818

1919
<style>
2020
.main {
21-
fill: hsl(var(--p));
21+
fill: rgba(var(--color-primary-500) / 1);
2222
}
2323
.line {
24-
stroke: hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));
25-
fill: hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));
24+
stroke: rgb(var(--on-primary));
25+
fill: rgb(var(--on-primary));
2626
}
2727
</style>

‎apps/codingcatdev/src/lib/search/SearchLogo.svelte‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<script>
2+
import AjPrimary from '$lib/components/global/icons/AJPrimary.svelte';
3+
import Blog from '$lib/components/global/icons/nav/Blog.svelte';
4+
import Courses from '$lib/components/global/icons/nav/Courses.svelte';
5+
import Podcasts from '$lib/components/global/icons/nav/Podcasts.svelte';
6+
import Tutorials from '$lib/components/global/icons/nav/Tutorials.svelte';
7+
import { ContentType } from '$lib/types';
8+
import { createEventDispatcher } from 'svelte';
9+
10+
/** @type {string} */
11+
export let breadcrumb;
12+
13+
/**
14+
* @param {string} title
15+
*/
16+
function getLogo(title) {
17+
const contentType = title.split('/').at(0);
18+
19+
switch (contentType) {
20+
case ContentType.course:
21+
return { contentType, component: Courses };
22+
case ContentType.podcast:
23+
return { contentType, component: Podcasts };
24+
case ContentType.tutorial:
25+
return { contentType, component: Tutorials };
26+
case ContentType.post:
27+
return { contentType, component: Blog };
28+
default:
29+
return { contentType, component: AjPrimary };
30+
}
31+
}
32+
$: logo = getLogo(breadcrumb);
33+
</script>
34+
35+
<div class="flex flex-col w-10 justify-center align-middle items-center">
36+
<svelte:component this={logo.component} />
37+
{logo.contentType}
38+
</div>

‎apps/codingcatdev/src/lib/search/SearchResultList.svelte‎

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script>
22
import { createEventDispatcher } from 'svelte';
3+
import SearchLogo from './SearchLogo.svelte';
34
45
/** @type {import('./types').Tree[]} */
56
export let results;
@@ -36,6 +37,13 @@
3637
escape(suffix)
3738
);
3839
}
40+
41+
/**
42+
* @param {string} title
43+
*/
44+
function removeType(title) {
45+
return title.split('/').at(-1);
46+
}
3947
</script>
4048

4149
<ul>
@@ -48,11 +56,20 @@
4856
on:click={() => dispatch('select', { href: result.href })}
4957
data-has-node={result.node ? true : undefined}
5058
>
51-
<strong>{@html excerpt(result.breadcrumbs[result.breadcrumbs.length - 1], query)}</strong>
52-
53-
{#if result.node?.content}
54-
<span>{@html excerpt(result.node.content, query)}</span>
55-
{/if}
59+
<div class="flex gap-2 md:gap-8">
60+
<SearchLogo breadcrumb={result.breadcrumbs[result.breadcrumbs.length - 1]} />
61+
<div>
62+
<strong
63+
>{@html excerpt(
64+
removeType(result.breadcrumbs[result.breadcrumbs.length - 1]) || '',
65+
query
66+
)}
67+
</strong>
68+
{#if result.node?.content}
69+
<span>{@html excerpt(result.node.content, query)}</span>
70+
{/if}
71+
</div>
72+
</div>
5673
</a>
5774

5875
{#if result.children.length > 0}
@@ -125,12 +142,12 @@
125142
}
126143
127144
a :global(mark) {
128-
--highlight-color: rgba(255, 255, 0, 0.2);
145+
--highlight-color: rgba(var(--color-primary-500) / 1);
129146
}
130147
131148
a span :global(mark) {
132149
background: none;
133-
color: var(--sk-text-1);
150+
color: rgb(var(--on-primary));
134151
background: var(--highlight-color);
135152
outline: 2px solid var(--highlight-color);
136153
border-top: 2px solid var(--highlight-color);

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,6 @@
6262
RESET();
6363
}
6464
});
65-
console.log(CORDS);
6665
for (let i = 1; i < CORDS.length; i++) {
6766
CORD_TL.add(
6867
gsap.to(CORDS[0], {

‎apps/codingcatdev/src/routes/api/content.json/content.server.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,7 @@ import { parseModules, preview } from "$lib/server/content";
22
import { ContentPublished } from "$lib/types";
33

44
export const content = async () => {
5-
6-
const course = import.meta.glob(['../../../content/course/*.md']);
5+
const course = import.meta.glob(['../../../content/course/*/*.md']);
76
const podcast = import.meta.glob(['../../../content/podcast/*.md']);
87
const post = import.meta.glob(['../../../content/post/*.md']);
98
const tutorial = import.meta.glob(['../../../content/tutorial/*.md']);

0 commit comments

Comments
 (0)