nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-10-23 11:23:05 +02:00
Code Issues Packages Projects Releases Wiki Activity

profile changes

Browse Source
This commit is contained in:
Layne 2021-08-22 02:37:03 -04:00
parent 27d7083440
commit f0af5c8ead
5 changed files with 55 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/user-profile/UserProfileVew.scss
View File

@ -1,10 +1,10 @@
.user-profile {
width: 560px;
.content-area {
color: black;
}
.user-container
{
.user-container {
border-right: 1px solid gray;
.avatar-image {
@ -17,23 +17,21 @@
}
}
.badge-container
{
.badge-container {
min-height: 50px;
background: rgba(0, 0, 0, .1);
background: rgba(0, 0, 0, 0.1);
border-radius: 5px;
margin: 0px;
margin-bottom: 2px;
}
.rooms-button-container
{
.rooms-button-container {
border-top: 1px solid gray;
border-bottom: 1px solid gray;
padding: 1px;
.rooms-button {
display:inline-block;
display: inline-block;
text-align: center;
height: 100%;
text-decoration: underline;
@ -41,10 +39,9 @@
}
}
.friends-container
{
.friends-container {
height: 100%;
}
}
@import './views/relationships-container/RelationshipsContainerView';
@import "./views/relationships-container/RelationshipsContainerView";

12
src/views/user-profile/UserProfileView.tsx
View File

@ -60,23 +60,22 @@ export const UserProfileView: FC = props =>
if(!userProfile) return null;
return (
<div className="user-profile">
<NitroCardView>
<NitroCardView simple={ true } className="user-profile">
<NitroCardHeaderView headerText={LocalizeText('extendedprofile.caption')} onCloseClick={OnClose} />
<NitroCardContentView>
<div className="row">
<div className="col-sm-6 user-container">
<div className="col-sm-7 user-container">
<UserContainerView id={userProfile.id} username={userProfile.username} motto={userProfile.motto} figure={userProfile.figure} secondsSinceLastLogin={userProfile.secondsSinceLastVisit} creation={userProfile.registration} achievementScore={userProfile.achievementPoints} isFriend={userProfile.isMyFriend} isOnline={userProfile.isOnline} requestSent={userProfile.requestSent} />
<BadgesContainerView badges={userBadges} />
</div>
<div className="col-sm-6">
<div className="col-sm-5">
{
userRelationships && <FriendsContainerView relationships={userRelationships} friendsCount={userProfile.friendsCount} />
}
</div>
</div>
<div className="row rooms-button-container align-items-center">
<div className="col-sm-12 d-flex align-content-center w-100">
<div className="d-flex rooms-button-container align-items-center py-1">
<div className="d-flex align-items-center w-100">
<i className="icon icon-rooms" /><span className="rooms-button">{LocalizeText('extendedprofile.rooms')}</span>
</div>
</div>
@ -90,6 +89,5 @@ export const UserProfileView: FC = props =>
</div>
</NitroCardContentView>
</NitroCardView>
</div>
)
}

4
src/views/user-profile/views/friends-container/FriendsContainerView.tsx
View File

@ -8,10 +8,12 @@ export const FriendsContainerView: FC<FriendsContainerViewProps> = props =>
const { relationships = null, friendsCount = null } = props;
return (
<div className="friends-container h-100">
<div className="friends-container h-100 d-flex flex-column">
<div className="mb-1" dangerouslySetInnerHTML={{ __html: LocalizeText('extendedprofile.friends.count', ['count'], [friendsCount.toString()]) }} />
<div className="mb-1"><b>{LocalizeText('extendedprofile.relstatus')}</b></div>
<div className="h-100 d-flex flex-column justify-content-between">
<RelationshipsContainerView relationships={relationships} />
</div>
</div>
)
}

9
src/views/user-profile/views/relationships-container/RelationshipsContainerView.tsx
View File

@ -24,9 +24,10 @@ export const RelationshipsContainerView: FC<RelationshipsContainerViewProps> = p
const relationshipName = RelationshipStatusEnum.RELATIONSHIP_NAMES[type].toLocaleLowerCase();
return (
<div className="relationship-container row row-cols-2 d-flex align-items-center">
<i className={`icon icon-relationship-${relationshipName} col-2`} />
<span className={'relationship col-10' + (!simple ? ' advanced' : '')}>
<div className="relationship-container d-flex flex-row align-items-center w-100">
<i className={`icon icon-relationship-${relationshipName} flex-shrink-0 align-self-baseline mt-2`} />
<div className="w-100 d-flex flex-column">
<span className={'relationship w-100' + (!simple ? ' advanced' : '')}>
<span className="cursor-pointer relationship-text" onClick={() => OnUserClick(relationshipInfo)}>
{
(relationshipInfo && relationshipInfo.friendCount > 0) ? relationshipInfo.randomFriendName : LocalizeText('extendedprofile.add.friends')
@ -54,7 +55,7 @@ export const RelationshipsContainerView: FC<RelationshipsContainerViewProps> = p
}
</div>
}
</div>
</div>
);
}, [OnUserClick, relationships, simple]);

8
src/views/user-profile/views/user-container/UserContainerView.tsx
View File

@ -27,20 +27,22 @@ export const UserContainerView: FC<UserContainerViewProps> = props =>
return (
<div className="row">
<div className="col-sm-4">
<div className="col-sm-3 px-0 d-flex align-items-center">
<AvatarImageView figure={figure} direction={2} />
</div>
<div className="col-sm-8">
<div className="user-info-container">
<h5>{username}</h5>
<div className="mb-1">{motto}</div>
<div className="fw-bold">{username}</div>
<div className="mb-1 fst-italic">{motto}</div>
<div className="mb-1" dangerouslySetInnerHTML={{ __html: LocalizeText('extendedprofile.created', ['created'], [creation]) }} />
<div className="mb-1" dangerouslySetInnerHTML={{ __html: LocalizeText('extendedprofile.last.login', ['lastlogin'], [FriendlyTime.format(secondsSinceLastLogin, '.ago', 2)]) }} />
<div className="mb-1"><b>{LocalizeText('extendedprofile.achievementscore')}</b> {achievementScore}</div>
<div className="d-flex flex-row align-items-center">
<OnlineIcon />
<FriendRequestComponent />
</div>
</div>
</div>
</div>
)
}