diff --git a/packages/app/.prettierrc.mjs b/packages/app/.prettierrc.mjs
new file mode 100644
index 0000000..8d43715
--- /dev/null
+++ b/packages/app/.prettierrc.mjs
@@ -0,0 +1,3 @@
+module.exports = {
+  plugins: [require.resolve('prettier-plugin-tailwindcss')],
+}
diff --git a/packages/app/site/_css/main.css b/packages/app/site/_css/main.css
index 22f3299..af724c7 100644
--- a/packages/app/site/_css/main.css
+++ b/packages/app/site/_css/main.css
@@ -1,3 +1,7 @@
 @import '@alwatr/style/main.css';
 @import './lib/color-palette.css';
 @import './lib/vazirmatn-font.css';
+
+::selection {
+  @apply bg-primary text-onPrimary;
+}
diff --git a/packages/app/site/_manifest.njk b/packages/app/site/_manifest.njk
index c4f935e..33151cb 100644
--- a/packages/app/site/_manifest.njk
+++ b/packages/app/site/_manifest.njk
@@ -14,13 +14,13 @@ eleventyExcludeFromCollections: true
   "orientation": "{{ site.orientation | default('any') }}",
   "default_locale": "{{ site.defaultLocale }}",
   "icons": [
-    {"src": "/img/meta/icon-16.png", "type": "image/png", "sizes": "16x16"},
-    {"src": "/img/meta/icon-32.png", "type": "image/png", "sizes": "32x32"},
-    {"src": "/img/meta/icon-180.png", "type": "image/png", "sizes": "180x180"},
-    {# {"src": "/img/meta/icon-192-maskable.png", "type": "image/png", "sizes": "512x512", "purpose": "maskable"},
-    {"src": "/img/meta/icon-512-maskable.png", "type": "image/png", "sizes": "512x512", "purpose": "maskable"}, #}
-    {"src": "/img/meta/icon-192.png", "type": "image/png", "sizes": "192x192"},
-    {"src": "/img/meta/icon-512.png", "type": "image/png", "sizes": "512x512"}
+    {"src": "/img/meta/icon-16-v2.png", "type": "image/png", "sizes": "16x16"},
+    {"src": "/img/meta/icon-32-v2.png", "type": "image/png", "sizes": "32x32"},
+    {"src": "/img/meta/icon-180-v2.png", "type": "image/png", "sizes": "180x180"},
+    {# {"src": "/img/meta/icon-192-maskable-v2.png", "type": "image/png", "sizes": "512x512", "purpose": "maskable"},
+    {"src": "/img/meta/icon-512-maskable-v2.png", "type": "image/png", "sizes": "512x512", "purpose": "maskable"}, #}
+    {"src": "/img/meta/icon-192-v2.png", "type": "image/png", "sizes": "192x192"},
+    {"src": "/img/meta/icon-512-v2.png", "type": "image/png", "sizes": "512x512"}
   ]
   {# "screenshots": [
     {
diff --git a/packages/app/site/fa/home.njk b/packages/app/site/fa/home.njk
index c266942..ecb9dd3 100644
--- a/packages/app/site/fa/home.njk
+++ b/packages/app/site/fa/home.njk
@@ -4,31 +4,26 @@ permalink: /
 navId: home
 ---
 
-<header
-  x-init="$store.userProfile.require()"
-  x-data
-  class="absolute left-0 right-0 top-0 z-fixed flex h-16 shrink-0 grow-0 select-none items-center bg-surfaceContainer px-1 shadow translucent"
->
-  <div class="grow shrink text-ellipsis whitespace-nowrap px-1 text-center text-titleLarge text-onSurface">{{ site.title }}</div>
+<header x-init="$store.userProfile.require()" x-data
+  class="absolute left-0 right-0 top-0 z-fixed flex h-16 shrink-0 grow-0 select-none items-center bg-surfaceContainer px-1 shadow translucent">
+  <div class="grow shrink text-ellipsis whitespace-nowrap px-1 text-center text-titleLarge text-onSurface">{{ site.title
+    }}</div>
 
   <template x-if="$store.userProfile.data">
     <figure class="block p-3">
-      <img src="/img/user-avatar-v1.jpg" class="block h-6 w-6 rounded-full ring-1 ring-tertiary ring-offset-2" alt="عکس پروفایل" />
+      <img src="/img/user-avatar-v1.jpg" class="block  w-6 h-6 rounded-full ring-1 ring-tertiary ring-offset-2"
+        alt="عکس پروفایل" />
     </figure>
   </template>
 </header>
 
-<main class="grow overflow-y-scroll pt-16">
+<main class=" overflow-y-scroll pt-16 grow">
   <div class="flex flex-row flex-wrap content-start gap-4 p-4">
-    <a
-      href="https://soffit.co/"
-      target="_blank"
+    <a href="https://soffit.co/" target="_blank"
       class="flex h-[40vw] shrink grow basis-full items-center justify-center rounded bg-primary bg-cover bg-center bg-no-repeat transition-shadow elevation-2 hover:elevation-3 extended:h-80"
-      style="background-image: url('/img/home-1.jpeg')"
-    >
+      style="background-image: url('/img/home-1.jpeg')">
       <h2
-        class="text-ellipsis rounded-md px-5 pb-2 pt-1 text-titleLarge text-onPrimary backdrop-blur backdrop-brightness-75 backdrop-saturate-200"
-      >
+        class="text-ellipsis rounded-md px-5 pb-2 pt-1 text-titleLarge text-onPrimary backdrop-blur backdrop-brightness-75 backdrop-saturate-200">
         مجموعه تولیدی بازرگانی سافیت
       </h2>
     </a>
diff --git a/packages/app/site/fa/users.njk b/packages/app/site/fa/users.njk
index 19c3353..f44961b 100644
--- a/packages/app/site/fa/users.njk
+++ b/packages/app/site/fa/users.njk
@@ -14,28 +14,28 @@ title: نمایندگان
 </header>
 
 <main class="grow overflow-y-scroll pt-16">
-  <div class="overflow-hidden rounded-lg m-10 border-primary border-opacity-30 border-2">
+  <div class="overflow-hidden rounded-lg m-10 border-primary border-opacity-30 border-2 text-ellipsis">
     <table class="w-full whitespace-no-wrap">
       <thead class="text-bodyLarge font-bold bg-primaryContainer text-onPrimaryContainer">
-        <tr class="divide-primary divide-x-2 divide-x-reverse divide-opacity-30 text-center">
-          <td class="px-4 py-4">نام</td>
+        <tr class="divide-primary divide-x-2 divide-x-reverse divide-opacity-30 text-center select-none">
+          <td class="px-4 py-4">نام و نام خانوادگی</td>
           <td class="px-4 py-4">استان</td>
           <td class="px-4 py-4">شماره همراه</td>
           <td class="px-4 py-4">ابزار</td>
         </tr>
       </thead>
-      <tbody x-data class="divide-y-2 divide-primary divide-opacity-30 text-bodyLarge">
+      <tbody x-data class="divide-primary divide-opacity-30 text-bodyLarge divide-y-2">
         <template x-for="i in 10">
           <tr class="divide-primary divide-x-2 divide-x-reverse divide-opacity-30">
             {# <td class="px-4 py-4" x-text="$store.userProfile.data.data.fullName"></td> #}
             <td class="px-4 py-4 text-center" x-text="'آقای سید علیرضا تفتی'"></td>
             {# <td class="px-4 py-4" x-text="$store.userProfile.data.data.province"></td> #}
             <td class="px-4 py-4" x-text="'خراسان رضوی'"></td>
-            <td class="px-4 py-4" x-text="l10n.replaceNumber($store.userProfile.data.data.phoneNumber + '')"></td>
-            <td class="px-4 py-4 flex flex-row gap-2 justify-center">
-              <a class="text-primary" href="/fa/order-list.html">{% alwatrIcon "cart-outline", "text-[1.5rem]" %}</a>
-              <a class="text-primary" :href="'tel:+' + $store.userProfile.data.data.phoneNumber">{% alwatrIcon
-                "call-outline", "text-[1.5rem]" %}</a>
+            <td class="px-4 py-4" x-text="l10n.replaceNumber('0' + $store.userProfile.data.data.phoneNumber)"></td>
+            <td class="px-4 py-4 flex flex-row gap-2 justify-center text-primary items-center text-[1.5rem]">
+              <a href="/fa/order-list.html">{% alwatrIcon "cart-outline" %}</a>
+              <a :href="'tel:+' + $store.userProfile.data.data.phoneNumber">{% alwatrIcon "call-outline" %}</a>
+              <a>{% alwatrIcon "create-outline" %}</a>
             </td>
           </tr>
         </template>