Simple blog post
This commit is contained in:
@@ -1,10 +0,0 @@
|
|||||||
{
|
|
||||||
"title": "My Post",
|
|
||||||
"description": "This is a short description",
|
|
||||||
"author": "John Doe",
|
|
||||||
"date": "2025-12-03",
|
|
||||||
"readingTime": 1,
|
|
||||||
"tags": ["typescript", "nextjs"],
|
|
||||||
"image": "/images/my-post.jpg",
|
|
||||||
"category": "guides"
|
|
||||||
}
|
|
||||||
@@ -1 +0,0 @@
|
|||||||
Hello world!
|
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
{
|
||||||
|
"title": "Welcome to ORUS!",
|
||||||
|
"description": "ORUS is a organization for people just like you",
|
||||||
|
"author": "Klesti Selimaj",
|
||||||
|
"date": "2025-12-03",
|
||||||
|
"readingTime": 1,
|
||||||
|
"tags": ["welcome", "first", "ORUS"],
|
||||||
|
"image": "/orus-logo.svg",
|
||||||
|
"category": "news"
|
||||||
|
}
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
# Hello, World! 👋
|
||||||
|
|
||||||
|
Welcome! ORUS is a cybersecurity & dev organization, Simply for developers.
|
||||||
|
|
||||||
|
- 💻 open source: We love the open source community and our projects are all open source.
|
||||||
|
- 📚 growing community: We are a growing community full of beginners and pros. join here
|
||||||
|
- 🌐 cybersecurity & development: we develop projects for developers and cybersecurity enthusiasts
|
||||||
@@ -8,9 +8,10 @@ import { useParams } from "next/navigation";
|
|||||||
import { PostPreview } from "@/lib/posts";
|
import { PostPreview } from "@/lib/posts";
|
||||||
|
|
||||||
export default function BlogPost() {
|
export default function BlogPost() {
|
||||||
const [post, setPost] = useState<(PostPreview & { content: string }) | null>(
|
const [post, setPost] = useState<{
|
||||||
null
|
content: string;
|
||||||
);
|
meta: PostPreview;
|
||||||
|
} | null>(null);
|
||||||
const [mounted, setMounted] = useState(false);
|
const [mounted, setMounted] = useState(false);
|
||||||
const { slug } = useParams();
|
const { slug } = useParams();
|
||||||
|
|
||||||
@@ -50,7 +51,7 @@ export default function BlogPost() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<WebStuff>
|
<WebStuff>
|
||||||
Hero Section
|
{/* Hero Section */}
|
||||||
<motion.section
|
<motion.section
|
||||||
className="relative z-10 px-6 py-16 lg:py-24 max-w-4xl mx-auto"
|
className="relative z-10 px-6 py-16 lg:py-24 max-w-4xl mx-auto"
|
||||||
variants={containerVariants}
|
variants={containerVariants}
|
||||||
@@ -60,7 +61,7 @@ export default function BlogPost() {
|
|||||||
<motion.div variants={itemVariants} className="mb-4">
|
<motion.div variants={itemVariants} className="mb-4">
|
||||||
<span className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500/10 border border-purple-500/20 rounded-full text-purple-400 text-sm">
|
<span className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500/10 border border-purple-500/20 rounded-full text-purple-400 text-sm">
|
||||||
<Sparkles className="w-4 h-4" />
|
<Sparkles className="w-4 h-4" />
|
||||||
{post.category}
|
{post.meta.category}
|
||||||
</span>
|
</span>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
|
||||||
@@ -69,7 +70,7 @@ export default function BlogPost() {
|
|||||||
className="text-5xl lg:text-6xl font-bold mb-6"
|
className="text-5xl lg:text-6xl font-bold mb-6"
|
||||||
>
|
>
|
||||||
<span className="bg-linear-to-r from-white via-purple-200 to-blue-200 bg-clip-text text-transparent">
|
<span className="bg-linear-to-r from-white via-purple-200 to-blue-200 bg-clip-text text-transparent">
|
||||||
{post.title}
|
{post.meta.title}
|
||||||
</span>
|
</span>
|
||||||
</motion.h1>
|
</motion.h1>
|
||||||
|
|
||||||
@@ -77,16 +78,16 @@ export default function BlogPost() {
|
|||||||
variants={itemVariants}
|
variants={itemVariants}
|
||||||
className="flex flex-wrap items-center gap-4 text-sm text-slate-400 mb-8"
|
className="flex flex-wrap items-center gap-4 text-sm text-slate-400 mb-8"
|
||||||
>
|
>
|
||||||
<span>{post.author}</span>
|
<span>{post.meta.author}</span>
|
||||||
<span>•</span>
|
<span>•</span>
|
||||||
<span>{new Date(post.date).toLocaleDateString()}</span>
|
<span>{new Date(post.meta.date).toLocaleDateString()}</span>
|
||||||
{post.readingTime && (
|
{post.meta.readingTime && (
|
||||||
<>
|
<>
|
||||||
<span>•</span>
|
<span>•</span>
|
||||||
<span>{post.readingTime} min read</span>
|
<span>{post.meta.readingTime} min read</span>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
{post.tags?.map((tag, idx) => (
|
{post.meta.tags?.map((tag, idx) => (
|
||||||
<span
|
<span
|
||||||
key={idx}
|
key={idx}
|
||||||
className="px-2 py-1 bg-slate-800/50 border border-slate-700 rounded-full"
|
className="px-2 py-1 bg-slate-800/50 border border-slate-700 rounded-full"
|
||||||
@@ -97,15 +98,15 @@ export default function BlogPost() {
|
|||||||
</motion.div>
|
</motion.div>
|
||||||
|
|
||||||
{/* Optional Featured Image */}
|
{/* Optional Featured Image */}
|
||||||
{post.image && (
|
{post.meta.image && (
|
||||||
<motion.div
|
<motion.div
|
||||||
variants={itemVariants}
|
variants={itemVariants}
|
||||||
className="mb-8 overflow-hidden rounded-xl"
|
className="mb-8 overflow-hidden rounded-xl"
|
||||||
>
|
>
|
||||||
<img
|
<img
|
||||||
src={post.image}
|
src={post.meta.image}
|
||||||
alt={post.title}
|
alt={post.meta.title}
|
||||||
className="w-full object-cover"
|
className="w-full h-96 object-cover"
|
||||||
/>
|
/>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user