Update files
This commit is contained in:
parent
f7256b1dbb
commit
1cb2cda55d
|
|
@ -103,18 +103,22 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-item-wrapper {
|
.user-item-wrapper {
|
||||||
padding: 3px 10px;
|
padding: 2px 8px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-item {
|
.user-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: flex-start;
|
||||||
gap: 8px;
|
gap: 4px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: background 0.2s;
|
transition: background 0.2s;
|
||||||
padding: 5px;
|
padding: 2px;
|
||||||
border-radius: 6px;
|
border-radius: 4px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-item:active {
|
.user-item:active {
|
||||||
|
|
@ -122,8 +126,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-avatar {
|
.user-avatar {
|
||||||
width: 26px;
|
width: 20px;
|
||||||
height: 26px;
|
height: 20px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
|
|
@ -135,22 +139,24 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 1px;
|
gap: 1px;
|
||||||
|
text-align: left;
|
||||||
|
align-items: flex-start;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-name {
|
.user-name {
|
||||||
font-size: 12px;
|
font-size: 11px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: var(--text-primary);
|
color: var(--text-primary);
|
||||||
line-height: 1.3;
|
line-height: 1.2;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-username {
|
.user-username {
|
||||||
font-size: 15px;
|
font-size: 12px;
|
||||||
color: var(--text-secondary);
|
color: var(--text-secondary);
|
||||||
line-height: 1.3;
|
line-height: 1.2;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
|
@ -158,8 +164,8 @@
|
||||||
|
|
||||||
/* Follow Button Icon */
|
/* Follow Button Icon */
|
||||||
.follow-btn-icon {
|
.follow-btn-icon {
|
||||||
width: 26px;
|
width: 20px;
|
||||||
height: 26px;
|
height: 20px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: var(--bg-primary);
|
background: var(--bg-primary);
|
||||||
color: var(--text-primary);
|
color: var(--text-primary);
|
||||||
|
|
@ -170,7 +176,6 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.2s ease;
|
transition: all 0.2s ease;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
margin-left: auto;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.follow-btn-icon:active {
|
.follow-btn-icon:active {
|
||||||
|
|
|
||||||
|
|
@ -105,16 +105,16 @@ export default function FollowListModal({ users, title, onClose, currentUser })
|
||||||
</div>
|
</div>
|
||||||
<div className="user-username">@{user.username || user.firstName || 'user'}</div>
|
<div className="user-username">@{user.username || user.firstName || 'user'}</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
{!isOwnProfile && (
|
{!isOwnProfile && (
|
||||||
<button
|
<button
|
||||||
className={`follow-btn-icon ${isFollowing ? 'following' : ''}`}
|
className={`follow-btn-icon ${isFollowing ? 'following' : ''}`}
|
||||||
onClick={(e) => handleFollowToggle(user._id, e)}
|
onClick={(e) => handleFollowToggle(user._id, e)}
|
||||||
>
|
>
|
||||||
{isFollowing ? (
|
{isFollowing ? (
|
||||||
<UserMinus size={16} />
|
<UserMinus size={12} />
|
||||||
) : (
|
) : (
|
||||||
<UserPlus size={16} />
|
<UserPlus size={12} />
|
||||||
)}
|
)}
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue