Files
uldp.edu.vn/app/components/publications/PublicationHeader.tsx

46 lines
1.8 KiB
TypeScript

import React from 'react';
const PublicationHeader = () => {
return (
<section id="repo-header">
<div className="max-w-[1440px] mx-auto px-6 lg:px-8">
{/* Title row + action buttons */}
<div className="flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 mb-8 w-full">
<div className="flex-1 max-w-3xl">
<h1>Publication Repository</h1>
<p>Search, filter, and access over 15,000 academic publications and research papers.</p>
</div>
<div className="flex gap-3 shrink-0">
<button className="pub-btn-outline">
<i className="fa-regular fa-bookmark"></i>
Saved Searches
</button>
<button className="pub-btn-primary">
<i className="fa-solid fa-download"></i>
Export Results
</button>
</div>
</div>
{/* Search bar */}
<div className="pub-search-bar">
<span className="pub-search-icon">
<i className="fa-solid fa-magnifying-glass"></i>
</span>
<input
type="text"
placeholder="Search by title, author, keyword, or DOI..."
/>
<div className="pub-search-btn-wrap">
<button className="pub-btn-primary">Search</button>
</div>
</div>
</div>
</section>
);
};
export default PublicationHeader;