design
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
'use client';
|
||||
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import * as React from 'react';
|
||||
import { useState, useEffect } from 'react';
|
||||
import { MediumCard } from '../../src/components/MediumCard';
|
||||
import { SearchBar } from '../../src/components/SearchBar';
|
||||
import { Tag } from '../../src/components/Tag';
|
||||
@@ -44,11 +45,11 @@ export default function BlogPage() {
|
||||
{/* Clean Hero Section */}
|
||||
<section className="pt-10 pb-8 md:pt-12 md:pb-10 relative overflow-hidden">
|
||||
{/* Animated Background */}
|
||||
<div className="absolute inset-0 bg-gradient-to-br from-white via-slate-50/30 to-blue-50/20 animate-gradient-shift"></div>
|
||||
<div className="absolute inset-0 bg-gradient-to-br from-white via-slate-50/30 to-slate-100/20 animate-gradient-shift"></div>
|
||||
|
||||
{/* Morphing Blob */}
|
||||
<div className="absolute inset-0 flex items-center justify-center pointer-events-none">
|
||||
<div className="w-48 h-48 bg-gradient-to-br from-blue-200/15 via-purple-200/10 to-indigo-200/15 animate-morph"></div>
|
||||
<div className="w-48 h-48 bg-gradient-to-br from-slate-200/15 via-slate-100/10 to-slate-200/15 animate-morph"></div>
|
||||
</div>
|
||||
|
||||
{/* Animated Drawing Paths */}
|
||||
@@ -59,10 +60,10 @@ export default function BlogPage() {
|
||||
</svg>
|
||||
|
||||
{/* Floating Shapes */}
|
||||
<div className="absolute top-10 left-10 w-20 h-20 bg-blue-100/20 rounded-full animate-float-1"></div>
|
||||
<div className="absolute top-20 right-20 w-16 h-16 bg-indigo-100/20 rotate-45 animate-float-2"></div>
|
||||
<div className="absolute bottom-20 left-1/4 w-12 h-12 bg-purple-100/20 rounded-full animate-float-3"></div>
|
||||
<div className="absolute bottom-10 right-1/3 w-24 h-24 bg-cyan-100/20 animate-float-4"></div>
|
||||
<div className="absolute top-10 left-10 w-20 h-20 bg-slate-100/20 rounded-full animate-float-1"></div>
|
||||
<div className="absolute top-20 right-20 w-16 h-16 bg-slate-100/20 rotate-45 animate-float-2"></div>
|
||||
<div className="absolute bottom-20 left-1/4 w-12 h-12 bg-slate-100/20 rounded-full animate-float-3"></div>
|
||||
<div className="absolute bottom-10 right-1/3 w-24 h-24 bg-slate-100/20 animate-float-4"></div>
|
||||
|
||||
<div className="max-w-3xl mx-auto px-6 relative z-10">
|
||||
<div className="text-center animate-fade-in">
|
||||
|
||||
Reference in New Issue
Block a user