chore: add Tailwind CSS configuration file. ux writing update

src/app/domains/pos/layouts/layout.component.html

@@ -18,7 +18,10 @@
 </ng-template>
 
 <ng-template #topbarEnd>
-  <p-button (click)="toggleMenu()" icon="pi pi-user" outlined size="large" />
+  <div class="">
+    <p-menu #menu [model]="profileMenuItems" [popup]="true" />
+    <p-button (click)="menu.toggle($event)" icon="pi pi-user" text severity="contrast" size="large" />
+  </div>
 </ng-template>
 
 @if (loading()) {

src/app/domains/pos/layouts/layout.component.ts

@@ -14,6 +14,7 @@ import { RouterOutlet } from '@angular/router';
 import { MenuItem } from 'primeng/api';
 import { Button, ButtonDirective } from 'primeng/button';
 import { Card } from 'primeng/card';
+import { Menu } from 'primeng/menu';
 import images from 'src/assets/images';
 import { PosInfoStore, PosProfileStore } from '../store';
 import { PosChooseCardsComponent } from './choose-pos.component';
@@ -30,6 +31,7 @@ import { PosMainMenuSidebarComponent } from './mainMenuSidebar/main-menu-sidebar
     PosChooseCardsComponent,
     Button,
     PosMainMenuSidebarComponent,
+    Menu,
   ],
 })
 export class PosLayoutComponent implements AfterViewInit {