update banner-img

package.json

@@ -1,6 +1,6 @@
 {
   "name": "astroplate",
-  "version": "1.3.2",
+  "version": "1.3.3",
   "description": "Astro and Tailwindcss boilerplate",
   "author": "zeon.studio",
   "license": "MIT",
@@ -44,7 +44,7 @@
     "@tailwindcss/forms": "^0.5.4",
     "@tailwindcss/typography": "^0.5.9",
     "@types/marked": "^5.0.1",
-    "@types/node": "20.4.3",
+    "@types/node": "20.4.4",
     "@types/react": "18.2.15",
     "@types/react-dom": "18.2.7",
     "autoprefixer": "^10.4.14",

src/content/authors/john-doe.md

@@ -4,17 +4,17 @@ email: johndoe@email.com
 image: "/images/avatar.png"
 description: this is meta description
 social:
-- name: github
+  - name: github
-  icon: FaGithub
+    icon: FaGithub
-  link: https://github.com
+    link: https://github.com
 
-- name: twitter
+  - name: twitter
-  icon: FaTwitter
+    icon: FaTwitter
-  link: https://twitter.com
+    link: https://twitter.com
 
-- name: linkedin
+  - name: linkedin
-  icon: FaLinkedin
+    icon: FaLinkedin
-  link: https://linkedin.com
+    link: https://linkedin.com
 ---
 
 lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostr navigation et dolore magna aliqua.

src/content/authors/sam-wilson.md

@@ -4,17 +4,17 @@ email: samwilson@email.com
 image: "/images/avatar.png"
 description: this is meta description
 social:
-- name: github
+  - name: github
-  icon: FaGithub
+    icon: FaGithub
-  link: https://github.com
+    link: https://github.com
 
-- name: twitter
+  - name: twitter
-  icon: FaTwitter
+    icon: FaTwitter
-  link: https://twitter.com
+    link: https://twitter.com
 
-- name: linkedin
+  - name: linkedin
-  icon: FaLinkedin
+    icon: FaLinkedin
-  link: https://linkedin.com
+    link: https://linkedin.com
 ---
 
 lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostr navigation et dolore magna aliqua.

src/content/authors/william-jacob.md

@@ -4,17 +4,17 @@ email: williamjacob@email.com
 image: "/images/avatar.png"
 description: this is meta description
 social:
-- name: github
+  - name: github
-  icon: FaGithub
+    icon: FaGithub
-  link: https://github.com
+    link: https://github.com
 
-- name: twitter
+  - name: twitter
-  icon: FaTwitter
+    icon: FaTwitter
-  link: https://twitter.com
+    link: https://twitter.com
 
-- name: linkedin
+  - name: linkedin
-  icon: FaLinkedin
+    icon: FaLinkedin
-  link: https://linkedin.com
+    link: https://linkedin.com
 ---
 
 lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostr navigation et dolore magna aliqua.

src/content/config.ts

@@ -31,7 +31,7 @@ const authorsCollection = defineCollection({
             icon: z.string().optional(),
             link: z.string().optional(),
           })
-          .optional()
+          .optional(),
       )
       .optional(),
     draft: z.boolean().optional(),

src/content/pages/elements.mdx

@@ -134,7 +134,7 @@ window.addEventListener("load", (e) => {
 
 ### Button
 
-<Button label="Button" link="#" style="solid"/>
+<Button label="Button" link="#" style="solid" />
 
 ---
 
@@ -146,21 +146,13 @@ window.addEventListener("load", (e) => {
 
 ### Notice
 
-<Notice type="note">
+<Notice type="note">This is a simple note.</Notice>
-This is a simple note.
-</Notice>
 
-<Notice type="tip">
+<Notice type="tip">This is a simple note.</Notice>
-This is a simple note.
-</Notice>
 
-<Notice type="info">
+<Notice type="info">This is a simple note.</Notice>
-This is a simple note.
-</Notice>
 
-<Notice type="warning">
+<Notice type="warning">This is a simple note.</Notice>
-This is a simple note.
-</Notice>
 
 ---
 

src/hooks/useTheme.ts

@@ -5,7 +5,7 @@ const useTheme = (): string => {
 
   useEffect(() => {
     setThemeValue(
-      document.documentElement.classList.contains("dark") ? "dark" : "light"
+      document.documentElement.classList.contains("dark") ? "dark" : "light",
     );
   }, []);
 

src/layouts/Search.tsx

@@ -155,7 +155,7 @@ const Search = ({ searchList }: Props) => {
                             {humanize(category)}
                             {index !== item.data.categories.length - 1 && ", "}
                           </a>
-                        )
+                        ),
                       )}
                     </li>
                   </ul>

src/layouts/shortcodes/Tabs.tsx

@@ -22,14 +22,14 @@ const Tabs = ({ children }: { children: React.ReactElement }) => {
 
   const tabLinks = Array.from(
     children.props.value.matchAll(
-      /<div\s+data-name="([^"]+)"[^>]*>(.*?)<\/div>/gs
+      /<div\s+data-name="([^"]+)"[^>]*>(.*?)<\/div>/gs,
     ),
-    (match: RegExpMatchArray) => ({ name: match[1], children: match[0] })
+    (match: RegExpMatchArray) => ({ name: match[1], children: match[0] }),
   );
 
   const handleKeyDown = (
     event: React.KeyboardEvent<EventTarget>,
-    index: number
+    index: number,
   ) => {
     if (event.key === "Enter" || event.key === " ") {
       setActive(index);
@@ -57,7 +57,7 @@ const Tabs = ({ children }: { children: React.ReactElement }) => {
             >
               {item.name}
             </li>
-          )
+          ),
         )}
       </ul>
       {tabLinks.map((item: { name: string; children: string }, i: number) => (

src/lib/utils/dateFormat.ts

@@ -2,7 +2,7 @@ import { formatInTimeZone } from "date-fns-tz";
 
 const dateFormat = (
   date: Date | string,
-  format: string = "dd MMM, yyyy"
+  format: string = "dd MMM, yyyy",
 ): string => {
   return formatInTimeZone(date, "America/New_York", format);
 };

src/lib/utils/similarItems.ts

@@ -15,12 +15,12 @@ const similerItems = (currentItem: any, allItems: any, slug: string) => {
 
   // filter by categories
   const filterByCategories = allItems.filter((item: any) =>
-    categories.find((category) => item.data.categories.includes(category))
+    categories.find((category) => item.data.categories.includes(category)),
   );
 
   // filter by tags
   const filterByTags = allItems.filter((item: any) =>
-    tags.find((tag) => item.data.tags.includes(tag))
+    tags.find((tag) => item.data.tags.includes(tag)),
   );
 
   // merged after filter

src/lib/utils/sortFunctions.ts

@@ -3,7 +3,7 @@ export const sortByDate = (array: any[]) => {
   const sortedArray = array.sort(
     (a: any, b: any) =>
       new Date(b.data.date && b.data.date).valueOf() -
-      new Date(a.data.date && a.data.date).valueOf()
+      new Date(a.data.date && a.data.date).valueOf(),
   );
   return sortedArray;
 };
@@ -11,14 +11,14 @@ export const sortByDate = (array: any[]) => {
 // sort product by weight
 export const sortByWeight = (array: any[]) => {
   const withWeight = array.filter(
-    (item: { data: { weight: any } }) => item.data.weight
+    (item: { data: { weight: any } }) => item.data.weight,
   );
   const withoutWeight = array.filter(
-    (item: { data: { weight: any } }) => !item.data.weight
+    (item: { data: { weight: any } }) => !item.data.weight,
   );
   const sortedWeightedArray = withWeight.sort(
     (a: { data: { weight: number } }, b: { data: { weight: number } }) =>
-      a.data.weight - b.data.weight
+      a.data.weight - b.data.weight,
   );
   const sortedArray = [...new Set([...sortedWeightedArray, ...withoutWeight])];
   return sortedArray;

src/lib/utils/taxonomyFilter.ts

@@ -2,7 +2,7 @@ import { slugify } from "@/lib/utils/textConverter";
 
 const taxonomyFilter = (posts: any[], name: string, key: string) =>
   posts.filter((post) =>
-    post.data[name].map((name: string) => slugify(name)).includes(key)
+    post.data[name].map((name: string) => slugify(name)).includes(key),
   );
 
 export default taxonomyFilter;

src/pages/index.astro

@@ -43,10 +43,10 @@ const { banner, features }: Homepage = homepage.data;
         {
           banner.image && (
             <div class="col-12">
-              <img
+              <Image
                 src={banner.image}
-                width="1272"
+                height={380}
-                height="403"
+                width={1200}
                 alt="banner image"
               />
             </div>