temp

fezcode · fezcode · commit 7d1929754f55 · 2025-10-16T21:21:01.000+03:00
diff --git a/src/components/PostItem.js b/src/components/PostItem.js
@@ -18,13 +18,10 @@ const PostItem = ({ slug, title, date, updatedDate, category }) => {
   }) : null;
 
   const categoryBadgeColorStyle = { backgroundColor: category === 'dev' ? 'var(--color-dev-badge)' : 'var(--color-takes-badge)' };
-  const postBackgroundColorStyle = {
-    backgroundColor: category === 'dev' ? 'var(--color-dev-card-bg)' : 'var(--color-takes-card-bg)',
-    '--hover-bg': category === 'dev' ? 'var(--color-dev-card-bg-hover)' : 'var(--color-takes-card-bg-hover)',
-  };
+  const postBackgroundColorClass = category === 'dev' ? 'bg-dev-card-bg' : 'bg-takes-card-bg';
 
   return (
-    <Link to={`/blog/${slug}`} className={`block p-8 my-4 border border-gray-700/50 rounded-lg shadow-lg cursor-pointer transition-colors group`} style={postBackgroundColorStyle}>
+    <Link to={`/blog/${slug}`} className={`block p-8 my-4 border border-gray-700/50 rounded-lg shadow-lg cursor-pointer transition-colors group ${postBackgroundColorClass} hover:bg-red-500/10`}>
       <article>
         <div className="flex items-center">
           <p className="text-sm text-gray-400">{formattedDate}</p>
@@ -34,14 +31,14 @@ const PostItem = ({ slug, title, date, updatedDate, category }) => {
                 {category}
               </span>
             )}
-            <h2 className="text-xl font-semibold text-white group-hover:text-primary-400 transition-colors">
+            <h2 className="text-xl font-semibold text-white group-hover:text-title-hover group-hover:underline transition-colors">
               {title}
             </h2>
           </div>
           {formattedUpdatedDate && updatedDate !== date && (
             <span className="hidden sm:inline-block ml-4 px-2 py-1 text-xs font-medium text-orange-400 bg-orange-400/10 rounded-full">Updated: {formattedUpdatedDate}</span>
           )}
-          <span className="ml-4 flex-shrink-0 text-sm font-medium text-primary-400 hover:text-primary-500 transition-colors">
+          <span className="ml-4 flex-shrink-0 text-sm font-medium text-primary-400 group-hover:text-title-hover group-hover:underline transition-colors">
             <span className="hidden sm:inline">Read post</span> &rarr;
           </span>
         </div>
diff --git a/src/components/ProjectCard.js b/src/components/ProjectCard.js
@@ -8,7 +8,7 @@ const ProjectCard = ({ project, size = 1 }) => {
     <Link to={`/projects/${project.slug}`} className={`block bg-gray-800/50 p-6 rounded-lg shadow-lg hover:bg-gray-800/80 transition-colors border border-gray-700/50 cursor-pointer flex flex-col ${colSpanClass}`}>
       <h3 className="text-xl font-semibold text-white">{project.title}</h3>
       <p className="mt-2 text-gray-400 flex-grow">{project.description}</p>
-      <span className="mt-4 inline-block text-primary-400 hover:text-primary-500 transition-colors mt-auto">
+      <span className="mt-4 inline-block text-primary-400 hover:text-title-hover hover:underline transition-colors mt-auto">
         View Project &rarr;
       </span>
     </Link>
diff --git a/src/index.css b/src/index.css
@@ -47,10 +47,7 @@ code {
 }
 
 :root {
-  --color-dev-badge: #4d7c0f; /* lime-800 */
+  --color-dev-badge: #44403c; /* stone-700 */
   --color-takes-badge: #065f46; /* emerald-800 */
-  --color-dev-card-bg: rgba(77, 124, 15, 0.2); /* lime-900/20 */
-  --color-dev-card-bg-hover: rgba(77, 124, 15, 0.4); /* lime-900/40 */
-  --color-takes-card-bg: rgba(6, 95, 70, 0.2); /* emerald-900/20 */
-  --color-takes-card-bg-hover: rgba(6, 95, 70, 0.4); /* emerald-900/40 */
+
 }
diff --git a/tailwind.config.js b/tailwind.config.js
@@ -27,6 +27,9 @@ module.exports = {
         article: '#f97316',
         music: '#a855f7',
         series: '#ec4899',
+        'title-hover': '#fdd4a6',
+        'dev-card-bg': 'rgba(68, 64, 60, 0.1)',
+        'takes-card-bg': 'rgba(6, 95, 70, 0.15)',
       },
       typography: (theme) => ({
         dark: {

Original file line number	Diff line number	Diff line change
`@@ -47,10 +47,7 @@ code {`
`47`	`47`	`}`
`48`	`48`
`49`	`49`	`:root {`
`50`		`- --color-dev-badge: #4d7c0f; /* lime-800 */`
	`50`	`+ --color-dev-badge: #44403c; /* stone-700 */`
`51`	`51`	`--color-takes-badge: #065f46; /* emerald-800 */`
`52`		`- --color-dev-card-bg: rgba(77, 124, 15, 0.2); /* lime-900/20 */`
`53`		`- --color-dev-card-bg-hover: rgba(77, 124, 15, 0.4); /* lime-900/40 */`
`54`		`- --color-takes-card-bg: rgba(6, 95, 70, 0.2); /* emerald-900/20 */`
`55`		`- --color-takes-card-bg-hover: rgba(6, 95, 70, 0.4); /* emerald-900/40 */`
	`52`	`+`
`56`	`53`	`}`