slider menu

src/app/_services/pages.service.ts

@@ -15,7 +15,7 @@ export class PagesService {
   public showDeletedSubject = new BehaviorSubject<boolean>(false);
   public menuSelectedLink: string;
 
-  public rootPage = {link:'', slug:environment.defaultLocale};
+  public rootPage:any = {link:'', slug:environment.defaultLocale};
 
   constructor(private http: HttpClient, private licenceService: LicenceService, private dialog: DialogService) {
     //this.find('/').subscribe(res => {this.rootPages = res.data});

src/environments/tk023.env.dev.ts

@@ -6,7 +6,7 @@ export const environment = {
   production: false,
   apiUrl: 'http://api.neftegaz.lc',
   clientId: 2,
-  clientSecret: 'l96iMO2w2V8NwhBzHbVFbLfvregctHVxWsD4Lo37',
+  clientSecret: 'B7alelPwCZJfVG8AjM21ByNAekSDv8wUqooiXnH1',
   project: null,
   licence: 'POUFLO4YW7SU',
   defaultLocale: 'ru'

src/tk023/component/pages/menu/slider-menu/slider-menu.component.html

@@ -1,16 +1,28 @@
 <slider side="left">
 
     <div body>
+        <a class="slider-menu-logo" [routerLink]="rootPage?.link">
+            <img src="assets/images/logo.svg" alt="">
+          </a>
         <pages-menu *ngIf="rootPages" [root]="rootPages" class="top-menu"></pages-menu>
-        <div class="btn-menu">
-            <div *ngIf="isRusPage">
-                <a href="https://ais.vniigaz-cert.ru/" target="_blank">
-                    Личный кабинет (АИС СЦ)
-                </a>
-            </div>
-            <div>
-                <locale></locale>
-            </div>
+        <div class="btn-menu btn-menu-first">
+            <a href="">
+                МТК 523
+              </a>
+              <a href="">
+                Портал ТК 023
+              </a>
         </div>
-    </div>        
+        <div class="btn-menu">
+            <a class="slider-menu-search">
+                <ico ico="search_24" [size]="24"></ico>
+              </a>
+            <div class="slider-menu-locale">
+                <locale></locale>
+                {{rootPage.name}}
+                
+            </div>
+        </div>   
+    </div>
+    
 </slider>

src/tk023/component/pages/menu/slider-menu/slider-menu.component.ts

@@ -23,6 +23,10 @@ export class SliderMenuComponent {
     return this.pagesService.rootPage;
   }
 
+  get rootPageName() {
+    return this.pagesService.rootPage;
+  }
+
   get isRusPage(){
     return this.rootPage.slug ===""
   }

src/tk023/css/_main-menu.scss

@@ -167,52 +167,59 @@ left-content{
 
 slider[side="left"]{
   .slider-bar{
-    background-color: var(--prime-act);
-    padding: 40px 48px;
-    width: 480px;
+
+    width: 360px;
     max-width: 100vw;
     .header{
-      background-color: var(--prime-act);
       box-shadow: none;
-      padding: 0 0 28px;
+      padding: 20px;
+      background-color: #FFF;
+      border-bottom: 1px solid var(--second-dis);
       .title{
         ico svg{
-          color: var(--white);
+          color: var(--second);
         }
       }
 
     }
     .body{
+      .slider-menu-logo{
+        width: 235px;
+        height: 75px;
+        margin: 20px 20px 30px 20px;
+        display: block;
+        img{
+          object-fit: contain;
+        }
+      }
       pages-menu{
+        margin-left: 48px;
+        &.top-menu{
+          margin-inline: 20px;
+        }
+        .item{
+          display: flex;
+          margin-bottom: 16px;
+        }
         ico{
-
-          margin-top: 20px;
           svg{
-            color: var(--white);
+            color: var(--second);
           }
         }
         a{
-          font-family: PT Sans;
-          font-size: 20px;
-          font-style: normal;
-          font-weight: 400;
-          line-height: 24px;
-          color: var(--white);
-          margin: 20px 0 2px 20px;
+          color: #000;
+          margin-top: 2px;
         }
 
         &.top-menu{
           margin-bottom: 20px;
           &>pages-menu-item>.item>a{
-            font-family: PT Sans Narrow;
-            font-size: 24px;
-            font-style: normal;
-            font-weight: 700;
-            letter-spacing: 0.24px;
           }
         }
-        .current{
-          border-bottom: 2px solid var(--prime-dis);
+        .item.current a{
+            font-weight: 500;
+          
+
         }
       }
     }
@@ -221,27 +228,37 @@ slider[side="left"]{
   .btn-menu{
     display: flex;
     flex-direction: column;
-    gap:40px;
-    padding: 20px 0 0 ;
-      border-top: 1px solid var(--prime);
+    gap:15px;
+    padding: 15px 20px;
+    border-top: 1px solid var(--second-dis);
+    &.btn-menu-first{
+      padding-left: 45px;
+    }
     a{
-      font-family: PT Sans Narrow;
-      font-size: 24px;
-      font-style: normal;
-      font-weight: 700;
-      letter-spacing: 0.24px;
-      color: #FFF;
+
+    }
+    a.slider-menu-search{
+      svg{
+        color: var(--second) !important;
+      }
+    }
+    .slider-menu-locale{
+      display: flex;
+      gap: 16px;
+      align-items: start;
     }
     locale{
       img{
-        width: 27px;
+        width: 24px;
+        border: 1px solid var(--second-dis);
       }
       .dropdown{
         left: 48px;
         top:-24px;
-        img{
-          border: 1px solid var(--second-dis);
-        }
+
+      }
+      drop-down{
+        display: none;
       }
     }
   }
@@ -257,13 +274,6 @@ slider[side="left"]{
 
 
 
-@media screen and (max-width: 900px){
-  slider[side="left"]{
-    .slider-bar{
-      padding: 40px 32px;
-    }
-  }
-}