svrjs/svrjs-nextjs-website
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

rss icon added

Browse source
This commit is contained in:
Cypro Freelance 2024-08-29 21:26:11 +05:30
parent 9c95522c69
commit 6a047acc03
2 changed files with 34 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
app/(root)/blog/[slug]/page.tsx
View file

@ -2,7 +2,7 @@ import { client, urlFor } from "@/lib/sanity";
import { PortableText, PortableTextComponents } from "@portabletext/react"; import { PortableText, PortableTextComponents } from "@portabletext/react";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import { ArrowLeft } from "lucide-react"; import { ArrowLeft, Rss } from "lucide-react";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
import { notFound } from "next/navigation"; import { notFound } from "next/navigation";
import { Metadata } from "next"; import { Metadata } from "next";
@ -16,6 +16,7 @@ import CopyButton from "@/components/shared/copyButton";
import "./_styles/prism-twilight.css"; import "./_styles/prism-twilight.css";
import "./_styles/prism.twilight.min.css"; import "./_styles/prism.twilight.min.css";
import PrismLoader from "@/components/loader/prismLoader"; import PrismLoader from "@/components/loader/prismLoader";
import { Button } from "@/components/ui/button";
async function getData(slug: string) { async function getData(slug: string) {
const query = ` const query = `
@ -145,13 +146,26 @@ export default async function BlogSlugArticle({
return ( return (
<> <>
<section className="max-w-5xl container mx-auto py-8 md:py-28 flex flex-col items-center px-4"> <section className="max-w-5xl container mx-auto py-8 md:py-28 flex flex-col items-center px-4">
<Link <div className="w-full mx-auto flex-center">
href="/blog?page=1" <Link
className="self-start mb-4 text-primary hover:text-green-300 transition-all flex items-center" href="/blog"
> className="group text-primary transition-all flex items-center"
<ArrowLeft className="mr-2" /> >
Back to Blog <Button variant={"ghost"} size={"lg"} className="mx-0 px-2 ">
</Link> <ArrowLeft className="mr-2 w-5 h-5 group-hover:translate-x-1 transition-all" />
Back
</Button>
</Link>
<Link href="/rss.xml" className="ml-auto">
<Button
variant={"link"}
size={"lg"}
className="mx-0 px-2 text-accent-foreground"
>
<Rss className="w-5 h-5 mr-1" /> Subscribe to RSS
</Button>
</Link>
</div>
<header className="text-start mb-8 w-full"> <header className="text-start mb-8 w-full">
{data.titleImage && ( {data.titleImage && (
<div className="mb-2"> <div className="mb-2">

13
app/(root)/blog/page.tsx
View file

@ -1,6 +1,9 @@
import React from "react"; import React from "react";
import { Metadata } from "next"; import { Metadata } from "next";
import BlogCards from "@/components/cards/BlogCards"; import BlogCards from "@/components/cards/BlogCards";
import { Rss } from "lucide-react";
import { Button } from "@/components/ui/button";
import Link from "next/link";
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Blog - SVRJS", title: "Blog - SVRJS",
@ -44,9 +47,17 @@ const BlogPage = async ({
id="blog" id="blog"
className="wrapper container py-24 md:py-28 gap-2 flex-center flex-col" className="wrapper container py-24 md:py-28 gap-2 flex-center flex-col"
> >
<h1 className="text-3xl md:text-5xl mb-12 pb-1 md:pb-2 font-bold text-black dark:bg-clip-text dark:text-transparent dark:bg-gradient-to-b dark:from-white dark:to-neutral-400"> <h1 className="text-3xl md:text-5xl mb-3 pb-1 md:pb-2 font-bold text-black dark:bg-clip-text dark:text-transparent dark:bg-gradient-to-b dark:from-white dark:to-neutral-400">
SVRJS Blog Post SVRJS Blog Post
</h1> </h1>
<p className="text-muted-foreground flex-center mb-2">
Stay updated with our latest blog posts by subscribing to our
<Link href="/rss.xml">
<Button variant={"link"} className="mx-0 px-2">
<Rss className="w-5 h-5 mr-1" /> RSS feed
</Button>
</Link>
</p>
<BlogCards searchParams={searchParams} /> <BlogCards searchParams={searchParams} />
</section> </section>
); );