added header item class to navbar avatar icon
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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"
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user