fix: update expertise tag display to wrap and adjust initial tag count to 2
This commit is contained in:
@@ -376,7 +376,7 @@ function ProfileCard({ profile, resolvedAvatarUrl }: ProfileCardProps) {
|
|||||||
{expertiseTags.length > 0 && (
|
{expertiseTags.length > 0 && (
|
||||||
<div className="mt-3">
|
<div className="mt-3">
|
||||||
<p className="font-fractul font-bold text-[14px] text-[#00293d] mb-2">Expertise:</p>
|
<p className="font-fractul font-bold text-[14px] text-[#00293d] mb-2">Expertise:</p>
|
||||||
<div className={`flex gap-2 items-center ${showAllTags ? 'flex-wrap' : 'flex-nowrap overflow-hidden'}`}>
|
<div className="flex flex-wrap gap-2 items-center">
|
||||||
{(showAllTags ? expertiseTags : expertiseTags.slice(0, INITIAL_TAG_COUNT)).map((tag, index) => (
|
{(showAllTags ? expertiseTags : expertiseTags.slice(0, INITIAL_TAG_COUNT)).map((tag, index) => (
|
||||||
<span
|
<span
|
||||||
key={index}
|
key={index}
|
||||||
|
|||||||
@@ -32,7 +32,7 @@ function ProfessionalCard({
|
|||||||
const [imgError, setImgError] = useState(false);
|
const [imgError, setImgError] = useState(false);
|
||||||
const placeholder = '/assets/icons/user-placeholder-icon.svg';
|
const placeholder = '/assets/icons/user-placeholder-icon.svg';
|
||||||
const isPlaceholder = imageUrl === placeholder;
|
const isPlaceholder = imageUrl === placeholder;
|
||||||
const INITIAL_TAG_COUNT = 3;
|
const INITIAL_TAG_COUNT = 2;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="bg-white rounded-[15px] overflow-hidden shadow-[0px_4px_20px_rgba(0,0,0,0.08)] h-full flex flex-col">
|
<div className="bg-white rounded-[15px] overflow-hidden shadow-[0px_4px_20px_rgba(0,0,0,0.08)] h-full flex flex-col">
|
||||||
@@ -112,7 +112,7 @@ function ProfessionalCard({
|
|||||||
<p className="font-fractul font-bold text-[14px] leading-normal text-[#00293d]">
|
<p className="font-fractul font-bold text-[14px] leading-normal text-[#00293d]">
|
||||||
Expertise:
|
Expertise:
|
||||||
</p>
|
</p>
|
||||||
<div className="flex flex-nowrap overflow-hidden gap-1.5 mt-2 items-center">
|
<div className="flex flex-wrap gap-1.5 mt-2 items-center">
|
||||||
{expertise.slice(0, INITIAL_TAG_COUNT).map((tag, index) => (
|
{expertise.slice(0, INITIAL_TAG_COUNT).map((tag, index) => (
|
||||||
<span
|
<span
|
||||||
key={index}
|
key={index}
|
||||||
|
|||||||
Reference in New Issue
Block a user