feat: add default user icon and participant list entry component
This commit is contained in:
parent
db41e89843
commit
0e0ce4597c
3 changed files with 10 additions and 10 deletions
5
src/assets/usericon/default/default-user-icon.svg
Normal file
5
src/assets/usericon/default/default-user-icon.svg
Normal file
|
@ -0,0 +1,5 @@
|
|||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0 11C0 4.92487 4.92487 0 11 0H29C35.0751 0 40 4.92487 40 11V29C40 35.0751 35.0751 40 29 40H11C4.92487 40 0 35.0751 0 29V11Z" fill="#5770FF"/>
|
||||
<path d="M31.6663 35V31.6667C31.6663 29.8986 30.964 28.2029 29.7137 26.9526C28.4635 25.7024 26.7678 25 24.9997 25H14.9997C13.2316 25 11.5359 25.7024 10.2856 26.9526C9.03539 28.2029 8.33301 29.8986 8.33301 31.6667V35" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M19.9997 18.3333C23.6816 18.3333 26.6663 15.3486 26.6663 11.6667C26.6663 7.98477 23.6816 5 19.9997 5C16.3178 5 13.333 7.98477 13.333 11.6667C13.333 15.3486 16.3178 18.3333 19.9997 18.3333Z" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
After Width: | Height: | Size: 833 B |
1
src/assets/usericon/default/defaultusericon-export.tsx
Normal file
1
src/assets/usericon/default/defaultusericon-export.tsx
Normal file
|
@ -0,0 +1 @@
|
|||
export { default as defaultusericon } from '@/assets/usericon/default/default-user-icon.svg';
|
|
@ -1,24 +1,18 @@
|
|||
import React from 'react';
|
||||
import Image from 'next/image';
|
||||
import { defaultusericon } from '@/assets/usericon/default/defaultusericon-export';
|
||||
|
||||
type ParticipantListEntryProps = {
|
||||
participant: string;
|
||||
checked?: boolean;
|
||||
onCheck?: (checked: boolean) => void;
|
||||
imageSrc?: string;
|
||||
};
|
||||
|
||||
export default function ParticipantListEntry({
|
||||
participant,
|
||||
checked = false,
|
||||
onCheck,
|
||||
}: ParticipantListEntryProps) {
|
||||
return (
|
||||
<div className='flex items-center gap-2 py-1 ml-5'>
|
||||
<input
|
||||
type='checkbox'
|
||||
checked={checked}
|
||||
onChange={(e) => onCheck?.(e.target.checked)}
|
||||
className='accent-primary cursor-pointer'
|
||||
/>
|
||||
<Image src={defaultusericon} alt='Avatar' width={30} height={30} />
|
||||
<span>{participant}</span>
|
||||
</div>
|
||||
);
|
Loading…
Add table
Add a link
Reference in a new issue