Re-Quest/frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: Refine dashboard component padding, spacing, and typography.

Browse Source
This commit is contained in:
pradeepkumar
2026-01-18 20:18:30 +05:30
parent eea3016489
commit 0e47040c10
4 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/app/(agent)/agent/dashboard/component/ExperienceSection.tsx
View File

@@ -16,32 +16,32 @@ interface ExperienceSectionProps {
export function ExperienceSection({ experience }: ExperienceSectionProps) {
return (
<div className="bg-white rounded-[20px] p-6">
<h2 className="text-[20px] font-bold text-[#00293D] font-fractul leading-[24px] mb-6 text-center lg:text-left">Experience</h2>
<div className="flex flex-col lg:flex-row gap-6 lg:gap-8">
<div className="bg-white rounded-[20px] p-4 lg:p-5">
<h2 className="text-[20px] font-bold text-[#00293D] font-fractul leading-[24px] mb-4 text-center lg:text-left">Experience</h2>
<div className="flex flex-col lg:flex-row gap-4 lg:gap-8">
{/* Left Column */}
<div className="flex-1 space-y-6">
<div className="flex-1 space-y-4">
<div>
<p className="font-bold text-[#00293d] text-sm mb-2">Years in Experience</p>
<ul className="list-disc list-inside text-[#00293d] text-sm">
<li>{experience.years}</li>
<p className="font-fractul font-bold text-[14px] leading-[17px] text-[#00293D] mb-2">Years in Experience</p>
<ul className="list-disc list-inside">
<li className="font-serif font-medium text-[15px] leading-[21px] text-[#00293D]">{experience.years}</li>
</ul>
</div>
<div>
<p className="font-bold text-[#00293d] text-sm mb-2">Number of contract closed</p>
<ul className="list-disc list-inside text-[#00293d] text-sm">
<li>{experience.contracts}</li>
<p className="font-fractul font-bold text-[14px] leading-[17px] text-[#00293D] mb-2">Number of contract closed</p>
<ul className="list-disc list-inside">
<li className="font-serif font-medium text-[15px] leading-[21px] text-[#00293D]">{experience.contracts}</li>
</ul>
</div>
<div>
<p className="font-bold text-[#00293d] text-sm mb-3">Licensing &amp; Areas</p>
<p className="font-fractul font-bold text-[14px] leading-[17px] text-[#00293D] mb-3">Licensing &amp; Areas</p>
<div className="flex flex-wrap gap-2">
{experience.licensingAreas.map((area, idx) => (
<Tag key={idx} variant="light">
{area}
</Tag>
))}
<span className="text-[#e58625] text-sm cursor-pointer">+3 More</span>
<span className="inline-flex items-center justify-center h-[28px] px-3 rounded-[15px] border border-[#00293d]/10 text-[15px] font-light font-serif text-[#00293d] cursor-pointer">+3 More</span>
</div>
</div>
</div>
@@ -51,16 +51,16 @@ export function ExperienceSection({ experience }: ExperienceSectionProps) {
<div className="lg:hidden border-t border-gray-200" />
{/* Right Column */}
<div className="flex-1 space-y-6">
<div className="flex-1 space-y-4">
<div>
<p className="font-bold text-[#00293d] text-sm mb-3">Areas in expertise &amp; Years</p>
<p className="font-fractul font-bold text-[14px] leading-[17px] text-[#00293D] mb-3">Areas in expertise &amp; Years</p>
<div className="flex flex-wrap gap-2">
{experience.expertiseYears.slice(0, 4).map((item, idx) => (
<Tag key={idx} variant="orange">
{item.area} – {item.years}
</Tag>
))}
<span className="text-[#e58625] text-sm cursor-pointer">+3More</span>
<span className="inline-flex items-center justify-center h-[28px] px-3 rounded-[15px] border border-[#00293d]/10 text-[15px] font-light font-serif text-[#00293d] cursor-pointer">+3 More</span>
</div>
</div>
<div>

2
src/app/(agent)/agent/dashboard/component/ProfileCard.tsx
View File

@@ -25,7 +25,7 @@ export function ProfileCard({
expertise,
}: ProfileCardProps) {
return (
<div className="bg-white rounded-[20px] p-6">
<div className="bg-white rounded-[20px] p-4 lg:p-5">
{/* Name and Actions Row */}
<div className="flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4 mb-4">
<div className="text-center lg:text-left">

8
src/app/(agent)/agent/dashboard/component/Tag.tsx
View File

@@ -8,12 +8,12 @@ interface TagProps {
export function Tag({ children, variant = 'default' }: TagProps) {
return (
<span
className={`inline-flex items-center justify-center px-3 h-[24px] rounded-[15px] text-[14px] font-normal font-serif border ${
className={`inline-flex items-center justify-center px-3 h-[28px] rounded-[15px] text-[14px] font-medium font-serif ${
variant === 'light'
? 'border-[#00293d]/30 text-[#00293d] bg-transparent'
? 'border-[0.7px] border-[#00293d] text-[#00293d] bg-transparent'
: variant === 'orange'
? 'border-[#e58625] text-[#e58625] bg-transparent'
: 'border-[#00293d] text-[#00293d] bg-transparent'
? 'border-[0.7px] border-[#e58625] text-[#e58625] bg-transparent'
: 'border-[0.7px] border-[#00293d] text-[#00293d] bg-transparent'
}`}
>
{children}

2
src/app/(agent)/agent/dashboard/page.tsx
View File

@@ -114,7 +114,7 @@ export default function AgentDashboard() {
</div>
{/* Right Content - Profile Info + Experience + All Sections */}
<div className="flex-1 space-y-6">
<div className="flex-1 space-y-4">
{/* Profile Card */}
<ProfileCard
firstName={firstName}