Nikolay Tatarinov
fd624c2357
- Consolidated global error handling in app.vue to redirect users to the login page on API authentication failure. - Enhanced MapView component by reintroducing event listeners for selected map and marker updates, improving interactivity. - Updated PasswordInput and various modal components to ensure proper input handling and accessibility compliance. - Refactored MapControls and MapControlsContent to streamline prop management and enhance user experience. - Improved error handling in local storage operations within useMapBookmarks and useRecentLocations composables. - Standardized input elements across forms for consistency in user interaction.
44 lines
1.1 KiB
Vue
44 lines
1.1 KiB
Vue
<template>
|
|
<div class="avatar">
|
|
<div
|
|
class="rounded-full overflow-hidden flex items-center justify-center shrink-0"
|
|
:style="{ width: `${size}px`, height: `${size}px` }"
|
|
>
|
|
<img
|
|
v-if="email && !gravatarError"
|
|
:src="useGravatarUrl(email, size)"
|
|
alt=""
|
|
class="w-full h-full object-cover"
|
|
loading="lazy"
|
|
@error="gravatarError = true"
|
|
>
|
|
<div
|
|
v-else
|
|
class="bg-primary text-primary-content rounded-full w-full h-full flex items-center justify-center"
|
|
:class="initialClass"
|
|
>
|
|
<span>{{ (username || '?')[0].toUpperCase() }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
username: string
|
|
email?: string
|
|
size?: number
|
|
}>(),
|
|
{ size: 32, email: undefined }
|
|
)
|
|
|
|
const gravatarError = ref(false)
|
|
|
|
const initialClass = computed(() => {
|
|
if (props.size <= 32) return 'text-sm'
|
|
if (props.size <= 40) return 'text-sm'
|
|
return 'text-2xl font-semibold'
|
|
})
|
|
</script>
|