mirror of
https://github.com/twinpath/app.git
synced 2026-01-26 21:32:02 +07:00
49 lines
1.4 KiB
PHP
49 lines
1.4 KiB
PHP
|
|
@props([
|
|
'src' => '',
|
|
'alt' => 'User Avatar',
|
|
'size' => 'medium',
|
|
'status' => 'none',
|
|
])
|
|
|
|
@php
|
|
$sizeClasses = [
|
|
'xsmall' => 'h-6 w-6 max-w-6',
|
|
'small' => 'h-8 w-8 max-w-8',
|
|
'medium' => 'h-10 w-10 max-w-10',
|
|
'large' => 'h-12 w-12 max-w-12',
|
|
'xlarge' => 'h-14 w-14 max-w-14',
|
|
'xxlarge' => 'h-16 w-16 max-w-16',
|
|
];
|
|
|
|
$statusSizeClasses = [
|
|
'xsmall' => 'h-1.5 w-1.5 max-w-1.5',
|
|
'small' => 'h-2 w-2 max-w-2',
|
|
'medium' => 'h-2.5 w-2.5 max-w-2.5',
|
|
'large' => 'h-3 w-3 max-w-3',
|
|
'xlarge' => 'h-3.5 w-3.5 max-w-3.5',
|
|
'xxlarge' => 'h-4 w-4 max-w-4',
|
|
];
|
|
|
|
$statusColorClasses = [
|
|
'online' => 'bg-green-500',
|
|
'offline' => 'bg-red-400',
|
|
'busy' => 'bg-yellow-500',
|
|
];
|
|
|
|
$sizeClass = $sizeClasses[$size] ?? $sizeClasses['medium'];
|
|
$statusSizeClass = $statusSizeClasses[$size] ?? $statusSizeClasses['medium'];
|
|
$statusColorClass = $statusColorClasses[$status] ?? '';
|
|
@endphp
|
|
|
|
<div class="relative rounded-full {{ $sizeClass }}">
|
|
<img
|
|
src="{{ $src }}"
|
|
alt="{{ $alt }}"
|
|
class="h-full w-full object-cover rounded-full"
|
|
/>
|
|
|
|
@if($status !== 'none')
|
|
<span class="absolute bottom-0 right-0 rounded-full border-[1.5px] border-white dark:border-gray-900 {{ $statusSizeClass }} {{ $statusColorClass }}"></span>
|
|
@endif
|
|
</div> |