Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/components/Persona/Persona.scss
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,6 @@ $ms-color-initials-darkRed: #b91d47;
display: table-cell;
padding: 0 12px;
vertical-align: middle;
overflow: hidden;
}

.ms-Persona-primaryText,
Expand Down
19 changes: 15 additions & 4 deletions src/components/Persona/Persona.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,19 +23,29 @@ export class Persona extends React.Component<IPersonaProps, any> {
};

public render() {
let { className, size, imageUrl, imageInitials, initialsColor, presence, primaryText, secondaryText, tertiaryText, optionalText, hidePersonaDetails } = this.props;
let {
className,
size,
imageUrl,
imageInitials,
initialsColor,
presence,
primaryText,
secondaryText,
tertiaryText,
optionalText,
hidePersonaDetails
} = this.props;

return (
<div { ... this.props as any } className={ css('ms-Persona', className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence]) }>
<div { ...this.props as any } className={ css('ms-Persona', className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence]) }>
{ size !== PersonaSize.tiny && (
<div className='ms-Persona-imageArea'>
<div className={ css('ms-Persona-initials', PERSONA_INITIALS_COLOR[initialsColor]) }>{ imageInitials }</div>
<Image className='ms-Persona-image' imageFit={ ImageFit.cover } src={ imageUrl } />
</div>
) }

{ presence !== PersonaPresence.none && <div className='ms-Persona-presence'></div> }

{ !hidePersonaDetails && (
<div className='ms-Persona-details'>
<div className='ms-Persona-primaryText'>{ primaryText }</div>
Expand All @@ -44,6 +54,7 @@ export class Persona extends React.Component<IPersonaProps, any> {
) : (null) }
<div className='ms-Persona-tertiaryText'>{ tertiaryText }</div>
<div className='ms-Persona-optionalText'>{ optionalText }</div>
{ this.props.children }
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

indent 2 spaces

</div>) }
</div>
);
Expand Down