Merge pull request #6 from shaniit-org/dev

Update on bogs, Minor tweaks and pre-commit hooks

.husky/pre-commit

@@ -0,0 +1,7 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npm run check 
+npm run format 
+npm run lint
+

jsconfig.json

@@ -1,6 +1,7 @@
 {
 	"extends": "./.svelte-kit/tsconfig.json",
 	"compilerOptions": {
+		"jsx": "react",
 		"allowJs": true,
 		"checkJs": true,
 		"esModuleInterop": true,
@@ -9,7 +10,8 @@
 		"skipLibCheck": true,
 		"sourceMap": true,
 		"strict": true
-	}
+	},
+	"exclude": ["./src/lib/studio/**/*"]
 	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias and https://kit.svelte.dev/docs/configuration#files
 	//
 	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes

package.json

@@ -10,7 +10,8 @@
 		"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
 		"lint": "prettier --plugin-search-dir . --check . && eslint .",
-		"format": "prettier --plugin-search-dir . --write ."
+		"format": "prettier --plugin-search-dir . --write .",
+		"prepare": "husky install"
 	},
 	"devDependencies": {
 		"@flydotio/dockerfile": "^0.4.11",
@@ -35,7 +36,8 @@
 		"svelte-check": "^3.5.2",
 		"tailwindcss": "^3.3.3",
 		"typescript": "^5.2.2",
-		"vite": "^4.4.9"
+		"vite": "^4.4.9",
+		"husky": "^8.0.0"
 	},
 	"type": "module",
 	"dependencies": {

src/lib/components/common/Footer.svelte

@@ -23,7 +23,7 @@
 			</div>
 			<form
 				class="flex flex-col p-0 md:p-4 basis-1/2"
-				action="https://formspree.io/f/{formID}"
+				action={`https://formspree.io/f/${formID}`}
 				method="POST"
 			>
 				<p class="text-white text-xl mb-6">Contact Us</p>

src/lib/components/common/NewsCard.svelte

@@ -7,7 +7,7 @@
 	export let data;
 </script>
 
-<a href={`/news/${data.slug}`} class="cursor-pointer hover:bg-theme-muted bg-white flex flex-col">
+<a href={`/blogs/${data.slug}`} class="cursor-pointer hover:bg-theme-muted bg-white flex flex-col">
 	<SanityImage
 		maxWidth={450}
 		image={data.coverImage}

src/lib/components/common/RelatedArticle.svelte

@@ -8,7 +8,7 @@
 	{#if data.length > 0}
 		<div class="section-container p-4 md:px-12">
 			<h3 class="text-xl mb-4">Related Articles</h3>
-			<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 pb-12">
+			<div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-4 pb-12">
 				{#each data as itm}
 					<NewsCard data={itm} />
 				{/each}

src/lib/components/common/portableText/components.js

@@ -9,36 +9,36 @@ import Em from './Em.svelte';
 import CodeInput from './CodeInput.svelte';
 
 export const components = {
-    types: {
-        code: CodeInput,
-        image: Image
-    },
-    marks: {
-        em: Em,
-        link: Link,
-        strong: Strong
-    },
-    block: {
-        normal: Paragraph,
-        //	blockquote: Quote,
-        // Re-using the same component across multiple styles
-        h1: Heading,
-        h2: Heading,
-        h3: Heading,
-        h4: Heading
-    },
-    list: {
-        // Swap only the list parts you need
-        bullet: List,
-        // Custom user-defined list type
-        normal: List,
-        number: List
-        //	checklist: ChecklistWrapper
-    },
-    listItem: {
-        number: ListItem,
-        bullet: ListItem,
-        normal: ListItem
-        // checklist: ChecklistItem
-    }
+	types: {
+		code: CodeInput,
+		image: Image
+	},
+	marks: {
+		em: Em,
+		link: Link,
+		strong: Strong
+	},
+	block: {
+		normal: Paragraph,
+		//	blockquote: Quote,
+		// Re-using the same component across multiple styles
+		h1: Heading,
+		h2: Heading,
+		h3: Heading,
+		h4: Heading
+	},
+	list: {
+		// Swap only the list parts you need
+		bullet: List,
+		// Custom user-defined list type
+		normal: List,
+		number: List
+		//	checklist: ChecklistWrapper
+	},
+	listItem: {
+		number: ListItem,
+		bullet: ListItem,
+		normal: ListItem
+		// checklist: ChecklistItem
+	}
 };

src/lib/components/page/home/Hero.svelte

@@ -6,11 +6,12 @@
 	export let data;
 </script>
 
-<div class="grid gap-4 relative w-full md:h-[500px] overflow-hidden">
+<div class="grid gap-4 relative w-full md:h-[35vw] overflow-hidden">
 	<SanityImage
+		maxWidth={1920}
 		image={data.heroImage}
 		alt={data.title}
 		loading="eager"
-		className=" w-full object-cover z-[-1] "
+		className=" w-full object-cover z-[-1] h-full "
 	/>
 </div>

src/lib/components/page/home/Highlight.svelte

@@ -46,7 +46,7 @@
 			</p>
 			<Button
 				kind="secondary"
-				href={`/news/${data.slug}`}
+				href={`/blogs/${data.slug}`}
 				icon={LinkIcon}
 				class="cursor-pointer  max-w-max"
 				>Read More

src/lib/components/page/nlp/NLPArticle.svelte

@@ -20,7 +20,7 @@
 		</p>
 		<Button
 			size="field"
-			href="/news/{data.slug}"
+			href="/blogs/{data.slug}"
 			class="text-white border border-blue-500  max-w-max"
 			icon={Link}>Read More</Button
 		>

src/lib/sanity/image/SanityImage.svelte

@@ -27,15 +27,16 @@
 
 <style>
 	img {
-		transition: 500ms all;
+		transition: 500ms all ease-in-out;
 		transform-origin: center;
 	}
 	img[data-loaded='false'] {
 		filter: blur(5px);
 		opacity: 0.5;
-		scale: 0.99;
+		scale: 1.01;
 	}
 	img[data-loaded='true'] {
 		scale: 1;
+		opacity: 1;
 	}
 </style>

src/lib/site/nav.js

@@ -8,8 +8,8 @@ export const navs = [
 		path: '/'
 	},
 	{
-		name: 'News',
-		path: '/news'
+		name: 'Blogs',
+		path: '/blogs'
 	},
 	{
 		name: 'Events',

src/lib/studio/sanity.config.js

@@ -8,21 +8,21 @@ import { newDeskStructure } from './utils/deskStructure';
 import { contentGraphView } from 'sanity-plugin-graph-view';
 
 export default defineConfig({
-    name: 'default',
-    title: 'ShanIIT',
-    projectId: 'za3lzlmc',
-    dataset: 'live',
-    basePath: '/studio',
-    plugins: [
-        deskTool({
-            structure: newDeskStructure
-        }),
-        visionTool(),
-        contentGraphView({}),
-        unsplashImageAsset(),
-        codeInput()
-    ],
-    schema: {
-        types: schemaTypes
-    }
+	name: 'default',
+	title: 'ShanIIT',
+	projectId: 'za3lzlmc',
+	dataset: 'live',
+	basePath: '/studio',
+	plugins: [
+		deskTool({
+			structure: newDeskStructure
+		}),
+		visionTool(),
+		contentGraphView({}),
+		unsplashImageAsset(),
+		codeInput()
+	],
+	schema: {
+		types: schemaTypes
+	}
 });