ui: Apply font-fractul and font-serif typography to various text elements and buttons across agent dashboard components.

This commit is contained in:
pradeepkumar
2026-01-18 17:56:24 +05:30
parent 59fcc65489
commit f9a9ab0d5a
5 changed files with 31 additions and 31 deletions

View File

@@ -106,18 +106,18 @@ export default function AgentDashboard() {
<div className="flex items-center border border-[#00293d]/10 rounded-[15px] h-[55px] px-4">
<div className="flex items-center gap-2 flex-1">
<span className="w-3 h-3 bg-green-500 rounded-full" />
<span className="text-sm font-bold text-[#00293d]">Available.</span>
<span className="text-sm font-bold text-[#00293d] font-fractul">Available.</span>
</div>
<button className="px-6 py-2 bg-[#e58625] text-white text-sm rounded-[15px]">
<button className="px-6 py-2 bg-[#e58625] text-white text-sm rounded-[15px] font-fractul">
Connect
</button>
</div>
<div className="flex items-center border border-[#00293d]/10 rounded-[15px] h-[55px] px-4">
<div className="flex items-center gap-2 flex-1">
<span className="w-3 h-3 bg-white border border-gray-400 rounded-full" />
<span className="text-sm font-bold text-[#00293d]">Unavailable.</span>
<span className="text-sm font-bold text-[#00293d] font-fractul">Unavailable.</span>
</div>
<button className="px-6 py-2 bg-[#00293d] text-white text-sm rounded-[15px]">
<button className="px-6 py-2 bg-[#00293d] text-white text-sm rounded-[15px] font-fractul">
Connect
</button>
</div>
@@ -146,8 +146,8 @@ export default function AgentDashboard() {
{/* Name and Info - Centered for Mobile */}
<div className="text-center mb-4">
<div className="flex items-center justify-center gap-2 mb-1">
<h1 className="text-[18px] text-[#00293d] font-[family-name:var(--font-fractul)]">
<span className="font-bold">{firstName}</span>{' '}
<h1 className="text-[18px] text-[#00293d] font-serif">
<span className="font-semibold">{firstName}</span>{' '}
<span className="font-normal">{lastName}</span>
</h1>
{agentData.isVerified && (
@@ -172,8 +172,8 @@ export default function AgentDashboard() {
/>
</button>
</div>
<p className="text-[#00293d] text-sm mb-2">{agentData.title}</p>
<div className="flex items-center justify-center gap-4 text-sm text-[#00293d]">
<p className="text-[#00293d] text-sm mb-2 font-fractul">{agentData.title}</p>
<div className="flex items-center justify-center gap-4 text-sm text-[#00293d] font-fractul">
<span className="flex items-center gap-1 text-[#e58625] font-medium">
<Image
src="/assets/icons/location-icon.svg"
@@ -234,18 +234,18 @@ export default function AgentDashboard() {
<div className="flex items-center border border-[#00293d]/10 rounded-[15px] h-[50px] px-4">
<div className="flex items-center gap-2 flex-1">
<span className="w-3 h-3 bg-green-500 rounded-full" />
<span className="text-sm font-bold text-[#00293d]">Available.</span>
<span className="text-sm font-bold text-[#00293d] font-fractul">Available.</span>
</div>
<button className="px-5 py-1.5 bg-[#e58625] text-white text-sm rounded-[15px] hover:bg-[#d47720] transition-colors">
<button className="px-5 py-1.5 bg-[#e58625] text-white text-sm rounded-[15px] hover:bg-[#d47720] transition-colors font-fractul">
Connect
</button>
</div>
<div className="flex items-center border border-[#00293d]/10 rounded-[15px] h-[50px] px-4">
<div className="flex items-center gap-2 flex-1">
<span className="w-3 h-3 bg-white border border-gray-400 rounded-full" />
<span className="text-sm font-bold text-[#00293d]">Unavailable.</span>
<span className="text-sm font-bold text-[#00293d] font-fractul">Unavailable.</span>
</div>
<button className="px-5 py-1.5 bg-[#00293d] text-white text-sm rounded-[15px] hover:bg-[#001d2b] transition-colors">
<button className="px-5 py-1.5 bg-[#00293d] text-white text-sm rounded-[15px] hover:bg-[#001d2b] transition-colors font-fractul">
Connect
</button>
</div>
@@ -279,8 +279,8 @@ export default function AgentDashboard() {
<div className="flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4 mb-4">
<div>
<div className="flex items-center gap-2 mb-1">
<h1 className="text-[18px] text-[#00293d] font-[family-name:var(--font-fractul)]">
<span className="font-bold">{firstName}</span>{' '}
<h1 className="text-[18px] text-[#00293d] font-serif">
<span className="font-semibold">{firstName}</span>{' '}
<span className="font-normal">{lastName}</span>
</h1>
{agentData.isVerified && (
@@ -305,8 +305,8 @@ export default function AgentDashboard() {
/>
</button>
</div>
<p className="text-[#00293d] text-sm mb-2">{agentData.title}</p>
<div className="flex items-center gap-4 text-sm text-[#00293d]">
<p className="text-[#00293d] text-sm mb-2 font-fractul">{agentData.title}</p>
<div className="flex items-center gap-4 text-sm text-[#00293d] font-fractul">
<span className="flex items-center gap-1 text-[#e58625] font-medium">
<Image
src="/assets/icons/location-icon.svg"
@@ -352,7 +352,7 @@ export default function AgentDashboard() {
</div>
{/* Bio */}
<p className="text-[#00293d] text-sm leading-relaxed mb-4">{agentData.bio}</p>
<p className="text-[#00293d] text-sm leading-relaxed mb-4 font-serif">{agentData.bio}</p>
{/* Expertise Tags */}
<div>
@@ -369,7 +369,7 @@ export default function AgentDashboard() {
{/* Experience Section */}
<div className="lg:hidden">
<h2 className="text-xl font-bold text-[#00293d] text-center mb-6">Experience</h2>
<h2 className="text-xl font-bold text-[#00293d] font-serif text-center mb-6">Experience</h2>
<div className="space-y-4 px-4">
<div className="border-b border-gray-200 pb-4">
<p className="font-bold text-[#00293d] text-sm mb-2">Years in Experience</p>
@@ -423,7 +423,7 @@ export default function AgentDashboard() {
{/* Desktop Experience Section */}
<div className="hidden lg:block bg-white rounded-[20px] border border-gray-200 p-6">
<h2 className="text-xl font-bold text-[#00293d] mb-6">Experience</h2>
<h2 className="text-xl font-bold text-[#00293d] font-serif mb-6">Experience</h2>
<div className="flex flex-col lg:flex-row gap-8">
<div className="flex-1 space-y-6">
<div>
@@ -532,7 +532,7 @@ export default function AgentDashboard() {
{/* Specialization Section - Single Column on Mobile */}
<div className="bg-[#e8e8e8] rounded-[20px] p-8">
<div className="text-center mb-8">
<h2 className="text-xl font-bold text-[#00293d]">Specialization</h2>
<h2 className="text-xl font-bold text-[#00293d] font-serif">Specialization</h2>
<p className="text-[#00293d]/70 text-sm">Area Of Expertise and Focus</p>
</div>
<div className="flex flex-col lg:grid lg:grid-cols-3 gap-6 mb-6">
@@ -603,7 +603,7 @@ export default function AgentDashboard() {
{/* Testimonials Section - Single Column on Mobile */}
<div className="bg-white rounded-[20px] border border-gray-200 p-8">
<h2 className="text-xl font-bold text-[#00293d] text-center mb-2">Testimonials</h2>
<h2 className="text-xl font-bold text-[#00293d] font-serif text-center mb-2">Testimonials</h2>
<p className="text-[#00293d]/70 text-sm text-center mb-8">
Clients rate our real estate services 4.9 out of 5 on average, based on recent client reviews.
</p>