diff options
| author | lonkaars <l.leblansch@gmail.com> | 2021-02-04 20:19:49 +0100 | 
|---|---|---|
| committer | lonkaars <l.leblansch@gmail.com> | 2021-02-04 20:19:49 +0100 | 
| commit | 6de323e009a54f8416d6e99e2026ec9fbc2d8772 (patch) | |
| tree | 1cde88ff7ac61e04d45abb225f231fe5b1524883 /components | |
| parent | c709c98702c01b78b34c2e469825878dbb1f6029 (diff) | |
new account avatar component
Diffstat (limited to 'components')
| -rw-r--r-- | components/account.tsx | 29 | 
1 files changed, 20 insertions, 9 deletions
| diff --git a/components/account.tsx b/components/account.tsx index e6ec58f..3ebfbca 100644 --- a/components/account.tsx +++ b/components/account.tsx @@ -1,16 +1,27 @@ +import { Component } from "react"; +  interface AccountAvatarProps {  	size: number; -	image: string; +	image?: string; +	dummy?: boolean; +	fallbackFill?: string; +	round?: boolean;  } -export function AccountAvatar(props: AccountAvatarProps) { -	return <div style={{ -		width: props.size, -		height: props.size, -		backgroundImage: props.image, -		backgroundSize: "cover", -		display: "inline-block" -	}}/>; +export class AccountAvatar extends Component<AccountAvatarProps> { +	render() { +		var image = this.props.dummy ? +			"url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQYV2P4z/j/PwAHAQL/gXZXNQAAAABJRU5ErkJggg==)" : +			this.props.image; +		return <div style={{ +			width: this.props.size, +			height: this.props.size, +			backgroundImage: image, +			backgroundSize: "cover", +			display: "inline-block", +			borderRadius: this.props.size / 2 * Number(this.props.round) +		}}/>; +	}  } |