added header item class to navbar avatar icon

This commit is contained in:
Mamalizz
2025-04-16 20:43:23 +03:30
parent f3260756c6
commit 9648cde790
2 changed files with 19 additions and 6 deletions
+8 -2
View File
@@ -8,6 +8,7 @@ import { useImage } from "@vueuse/core";
type Props = {
src: string | null | undefined;
alt: string;
iconClass?: string;
};
// props
@@ -18,7 +19,7 @@ const { src } = toRefs(props);
// state
const { isLoading } = useImage({ src: src.value ?? '' });
const { isLoading } = useImage({ src: src.value ?? "" });
</script>
<template>
@@ -41,7 +42,12 @@ const { isLoading } = useImage({ src: src.value ?? '' });
:delay-ms="600"
>
<div class="size-full rounded-full flex-center">
<Icon name="ci:profile" size="16" class="**:stroke-black" />
<Icon
name="ci:profile"
size="16"
class="**:stroke-black"
:class="iconClass"
/>
</div>
</AvatarFallback>
</template>
+11 -4
View File
@@ -32,7 +32,10 @@ const isHomePage = computed(() => route.path === "/");
<div
class="size-full flex items-center justify-between container h-[65px] lg:h-[85px] shrink-0 grow-0"
>
<button class="md:hidden header-navbar-item" @click="isSideDrawerOpen = true">
<button
class="md:hidden header-navbar-item"
@click="isSideDrawerOpen = true"
>
<Icon name="humbleicons:bars" size="28" />
</button>
<div class="max-md:hidden flex items-center gap-8 lg:gap-16">
@@ -46,6 +49,7 @@ const isHomePage = computed(() => route.path === "/");
>
<Avatar
class="!size-7"
iconClass="header-navbar-item"
:src="account.profile_photo"
:alt="
account.first_name && account.last_name
@@ -61,12 +65,15 @@ const isHomePage = computed(() => route.path === "/");
<NuxtLink to="/signin" class="flex-center">
<Icon
name="ci:profile"
class="**:stroke-black size-5 lg:size-6"
class="**:stroke-black size-5 lg:size-6 header-navbar-item"
/>
</NuxtLink>
</Tooltip>
<Tooltip title="محصولات">
<NuxtLink to="/products" class="flex-center header-navbar-item">
<NuxtLink
to="/products"
class="flex-center header-navbar-item"
>
<Icon
name="ci:search"
class="**:stroke-black size-4.5 lg:size-[21px]"
@@ -106,7 +113,7 @@ const isHomePage = computed(() => route.path === "/");
<div class="header-navbar-item">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 lg:h-6 "
class="h-5 lg:h-6"
fill="none"
viewBox="0 0 220 40"
>