modified: main_dc/BB/bbvue/package-lock.json

modified:   main_dc/BB/bbvue/package.json
	modified:   main_dc/BB/bbvue/src/App.vue
	modified:   main_dc/BB/bbvue/src/components/NavigationMenu.vue
install import { Icon } from '@iconify/vue'

main_dc/BB/bbvue/package-lock.json

@@ -8,6 +8,7 @@
       "name": "bbvue",
       "version": "0.0.13",
       "dependencies": {
+        "@iconify/vue": "^5.0.0",
         "axios": "^1.12.2",
         "pinia": "^3.0.3",
         "vue": "^3.5.22",
@@ -1162,6 +1163,27 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
+    "node_modules/@iconify/types": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+      "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+      "license": "MIT"
+    },
+    "node_modules/@iconify/vue": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/vue/-/vue-5.0.0.tgz",
+      "integrity": "sha512-C+KuEWIF5nSBrobFJhT//JS87OZ++QDORB6f2q2Wm6fl2mueSTpFBeBsveK0KW9hWiZ4mNiPjsh6Zs4jjdROSg==",
+      "license": "MIT",
+      "dependencies": {
+        "@iconify/types": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/cyberalien"
+      },
+      "peerDependencies": {
+        "vue": ">=3"
+      }
+    },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.3.13",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",

main_dc/BB/bbvue/package.json

@@ -14,6 +14,7 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
+    "@iconify/vue": "^5.0.0",
     "axios": "^1.12.2",
     "pinia": "^3.0.3",
     "vue": "^3.5.22",

main_dc/BB/bbvue/src/App.vue

@@ -18,7 +18,17 @@
         </router-link>
 
         <!-- Используем компонент меню -->
-        <NavigationMenu />
+        <div class="menu-box">
+          <div class="menu-box-item">
+            <Icon icon="material-symbols:account-circle" class="profile-icon" />
+          </div>
+          <div class="menu-box-item">
+            <Icon icon="material-symbols:no-accounts" class="profile-icon" />
+          </div>
+          <div class="menu-box-item h-menu">
+            <NavigationMenu />
+          </div>
+        </div>
       </div>
     </header>
 
@@ -37,11 +47,13 @@
 
 <script>
 import NavigationMenu from './components/NavigationMenu.vue'
+import { Icon } from '@iconify/vue'
 
 export default {
   name: 'App',
   components: {
-    NavigationMenu
+    NavigationMenu,
+    Icon
   },
   data() {
     return {
@@ -70,6 +82,21 @@ export default {
   box-sizing: border-box;
 }
 
+.menu-box {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+}
+
+.menu-box-item {
+  padding: 0 0.5rem;
+}
+
+.profile-icon {
+  color: rgb(30, 255, 0);
+}
+
 a {
   text-decoration: none;
   color: inherit;

main_dc/BB/bbvue/src/components/NavigationMenu.vue

@@ -153,6 +153,7 @@ export default {
 .burger-menu-container {
   position: relative;
   z-index: 1001;
+
 }
 
 .burger-menu {