Add learning to sidebar

umonkey · Dec 29, 2024 · f5a63f0 · f5a63f0
1 parent d4d4d3b
commit f5a63f0
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 0 deletions.
diff --git a/frontend/src/lib/components/LeftSideBar.svelte b/frontend/src/lib/components/LeftSideBar.svelte
@@ -9,6 +9,7 @@
 	import PlusIcon from '$lib/icons/PlusIcon.svelte';
 	import SearchIcon from '$lib/icons/SearchIcon.svelte';
 	import UserIcon from '$lib/icons/UserIcon.svelte';
+	import LearnIcon from '$lib/icons/LearnIcon.svelte';
 </script>
 
 <aside class="left">
@@ -49,6 +50,12 @@
 				<span>{locale.sideProfile()}</span>
 			</a>
 		</li>
+		<li>
+			<a href={routes.learn()}>
+				<span class="icon"><LearnIcon /></span>
+				<span>{locale.sideLearn()}</span>
+			</a>
+		</li>
 		<li>
 			<a href="/add">
 				<span class="icon"><PlusIcon /></span>

diff --git a/frontend/src/lib/components/MobileSidebar.svelte b/frontend/src/lib/components/MobileSidebar.svelte
@@ -10,6 +10,7 @@
 	import PlusIcon from '$lib/icons/PlusIcon.svelte';
 	import SearchIcon from '$lib/icons/SearchIcon.svelte';
 	import UserIcon from '$lib/icons/UserIcon.svelte';
+	import LearnIcon from '$lib/icons/LearnIcon.svelte';
 
 	const onClick = () => {
 		mobileSidebarStore.update(() => false);
@@ -62,6 +63,12 @@
 					<span>{locale.sideProfile()}</span>
 				</a>
 			</li>
+			<li>
+				<a href={routes.learn()}>
+					<span class="icon"><LearnIcon /></span>
+					<span>{locale.sideLearn()}</span>
+				</a>
+			</li>
 			<li>
 				<a href="/add">
 					<span class="icon"><PlusIcon /></span>

diff --git a/frontend/src/lib/icons/LearnIcon.svelte b/frontend/src/lib/icons/LearnIcon.svelte
@@ -0,0 +1,10 @@
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	fill="currentColor"
+	width="100%"
+	height="100%"
+	viewBox="0 0 640 512"
+	><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path
+		d="M320 32c-8.1 0-16.1 1.4-23.7 4.1L15.8 137.4C6.3 140.9 0 149.9 0 160s6.3 19.1 15.8 22.6l57.9 20.9C57.3 229.3 48 259.8 48 291.9l0 28.1c0 28.4-10.8 57.7-22.3 80.8c-6.5 13-13.9 25.8-22.5 37.6C0 442.7-.9 448.3 .9 453.4s6 8.9 11.2 10.2l64 16c4.2 1.1 8.7 .3 12.4-2s6.3-6.1 7.1-10.4c8.6-42.8 4.3-81.2-2.1-108.7C90.3 344.3 86 329.8 80 316.5l0-24.6c0-30.2 10.2-58.7 27.9-81.5c12.9-15.5 29.6-28 49.2-35.7l157-61.7c8.2-3.2 17.5 .8 20.7 9s-.8 17.5-9 20.7l-157 61.7c-12.4 4.9-23.3 12.4-32.2 21.6l159.6 57.6c7.6 2.7 15.6 4.1 23.7 4.1s16.1-1.4 23.7-4.1L624.2 182.6c9.5-3.4 15.8-12.5 15.8-22.6s-6.3-19.1-15.8-22.6L343.7 36.1C336.1 33.4 328.1 32 320 32zM128 408c0 35.3 86 72 192 72s192-36.7 192-72L496.7 262.6 354.5 314c-11.1 4-22.8 6-34.5 6s-23.5-2-34.5-6L143.3 262.6 128 408z"
+	/></svg
+>
diff --git a/frontend/src/lib/locale.ts b/frontend/src/lib/locale.ts
@@ -290,6 +290,10 @@ class EnglishLocale {
 	public learnTitle(): string {
 		return 'Training';
 	}
+
+	public sideLearn(): string {
+		return 'Training';
+	}
 }
 
 class RussianLocale extends EnglishLocale {
@@ -584,6 +588,10 @@ class RussianLocale extends EnglishLocale {
 	public learnTitle(): string {
 		return 'Тренировка';
 	}
+
+	public sideLearn(): string {
+		return 'Тренировка';
+	}
 }
 
 const guessLocale = () => {

diff --git a/frontend/src/lib/routes.ts b/frontend/src/lib/routes.ts
@@ -4,6 +4,7 @@ export const routes = {
 	file: (id: string) => `https://yerevan.treemaps.app/v1/files/${id}.jpg`,
 	home: () => '/',
 	newTrees: () => '/updates/new',
+	learn: () => '/learn',
 	search: '/search',
 	searchQuery: (query: string) => `/map?q=${query}`,
 	searchSpecies: (query: string) => `/map?q=species:"${query}"`,