refactor: post item naming

fezcode · fezcode · commit 767ed34a5c3a · 2026-02-07T06:48:59.000+03:00
diff --git a/src/components/BrutalistPostItem.jsx b/src/components/BrutalistPostItem.jsx
@@ -3,7 +3,7 @@ import { Link } from 'react-router-dom';
 import { motion } from 'framer-motion';
 import { ArrowRightIcon, FolderIcon } from '@phosphor-icons/react';
 
-const PostItem = ({
+const BrutalistPostItem = ({
   post,
   isActive,
   onHover = () => {},
@@ -69,7 +69,7 @@ const PostItem = ({
           style={{ backgroundColor: categoryColor || 'var(--emerald-400)' }}
         />
 
-        <div className="flex flex-1 items-baseline gap-6 pl-4 md:pl-8 min-w-0 pr-12">
+        <div className="flex flex-1 items-center gap-6 pl-4 md:pl-8 min-w-0 pr-12">
           {/* Date */}
           <span
             className={`font-mono text-[10px] tracking-widest flex-shrink-0 transition-colors duration-300 ${
@@ -80,9 +80,14 @@ const PostItem = ({
           </span>
 
           {/* Title Area */}
-          <div className="flex items-start gap-3 min-w-0 flex-1">
+          <div className="flex items-center gap-3 min-w-0 flex-1">
              {isSeries && (
-                <FolderIcon size={24} weight="fill" className="text-amber-400 shrink-0 mt-0.5" />
+                <FolderIcon
+                  size={24}
+                  weight="fill"
+                  className="shrink-0"
+                  style={{ color: categoryColor }}
+                />
              )}
              <div className="flex flex-col gap-1">
                 <h3
@@ -135,4 +140,4 @@ const PostItem = ({
   );
 };
 
-export default PostItem;
+export default BrutalistPostItem;
diff --git a/src/pages/blog-views/BrutalistBlogPage.jsx b/src/pages/blog-views/BrutalistBlogPage.jsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import { Link } from 'react-router-dom';
 import { motion, AnimatePresence } from 'framer-motion';
-import PostItem from '../../components/PostItem';
+import BrutalistPostItem from '../../components/BrutalistPostItem';
 import GenerativeArt from '../../components/GenerativeArt';
 import Seo from '../../components/Seo';
 import { fetchAllBlogPosts } from '../../utils/dataUtils';
@@ -201,7 +201,7 @@ const BrutalistBlogPage = () => {
 
         <div className="flex flex-col pb-32">
           {filteredItems.map((item) => (
-            <PostItem
+            <BrutalistPostItem
               key={item.slug}
               post={item}
               isActive={activePost?.slug === item.slug}
diff --git a/src/pages/brutalist-views/BrutalistSeriesPage.jsx b/src/pages/brutalist-views/BrutalistSeriesPage.jsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import { useParams, Link } from 'react-router-dom';
 import { motion, AnimatePresence } from 'framer-motion';
-import PostItem from '../../components/PostItem';
+import BrutalistPostItem from '../../components/BrutalistPostItem';
 import { ArrowLeftIcon, TagIcon, BookOpenIcon, CalendarIcon } from '@phosphor-icons/react';
 import Seo from '../../components/Seo';
 import { fetchAllBlogPosts } from '../../utils/dataUtils';
@@ -118,7 +118,7 @@ const BrutalistSeriesPage = () => {
 
         <div className="flex flex-col pb-32">
           {seriesPosts.map((post) => (
-            <PostItem
+            <BrutalistPostItem
               key={post.slug}
               post={{
                 ...post,
