mobile css

angular.json

@@ -100,6 +100,10 @@
                 {
                   "replace": "src/app/_modules/layout/jumbotron/jumbotron.component.ts",
                   "with": "src/vniigaz-v2/component/layout/jumbotron/jumbotron.component.ts"
+                },
+                {
+                  "replace": "src/app/_modules/pages/menu/slider-menu/slider-menu.component.ts",
+                  "with": "src/vniigaz-v2/component/pages/menu/slider-menu/slider-menu.component.ts"
                 }
               ],
               "inlineStyleLanguage": "scss",
@@ -150,6 +154,10 @@
                 {
                   "replace": "src/app/_modules/layout/jumbotron/jumbotron.component.ts",
                   "with": "src/vniigaz-v2/component/layout/jumbotron/jumbotron.component.ts"
+                },
+                {
+                  "replace": "src/app/_modules/pages/menu/slider-menu/slider-menu.component.ts",
+                  "with": "src/vniigaz-v2/component/pages/menu/slider-menu/slider-menu.component.ts"
                 }
               ],
               "inlineStyleLanguage": "scss",

src/app/_modules/widjet/swiper-gallery/swiper-gallery.component.scss

@@ -3,6 +3,7 @@
   flex-direction: column;
   width: 100%;
   height: 100%;
+  max-height: 100vw;
 
   --swiper-navigation-color: #fff;
   --swiper-pagination-color: #fff;

src/vniigaz-v2/component/pages/menu/slider-menu/slider-menu.component.html

@@ -0,0 +1,13 @@
+<slider side="left">
+
+    <div body>
+        <pages-menu *ngIf="rootPages" [root]="rootPages" class="top-menu"></pages-menu>
+        <div class="btn-menu">
+            <div>
+                <a href="https://ais.vniigaz-cert.ru/" target="_blank">
+                    АИС СЦ ВНИИГАЗ
+                </a>
+            </div>
+        </div>
+    </div>        
+</slider>

src/vniigaz-v2/component/pages/menu/slider-menu/slider-menu.component.ts

@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+import {Router} from "@angular/router";
+import {PagesService} from "@app/_services/pages.service";
+
+@Component({
+  selector: 'slider-menu',
+  templateUrl: './slider-menu.component.html',
+  styleUrls: ['./slider-menu.component.scss']
+})
+export class SliderMenuComponent {
+
+  constructor(
+    private router: Router,
+    public pagesService: PagesService
+    ) {
+  }
+
+  get rootPages() {
+    return this.pagesService.rootPages;
+  }
+
+}

src/vniigaz-v2/css/_basics.scss

@@ -375,6 +375,10 @@ footer{
 }
 
 @media screen and (max-width: 480px) {
+  h1{
+    font-size: 50px;
+    line-height: 60px;
+  }
   h2{
     font-size: 36px;
     line-height: 44px;
@@ -458,7 +462,8 @@ modal{
       padding: 36px 24px;
       overflow-y: auto;
       img{
-        max-width: 330px;
+        width: 330px;
+        max-width: 80vw;
       }
     }
     .modal-footer{

src/vniigaz-v2/css/_grid.scss

@@ -67,7 +67,7 @@ jumbotron{
   flex-grow: 1;
   .content-grid{
     display: flex;
-    justify-content: center;
+    justify-content: space-between;
     margin: 40px 0 120px;
 
     left-content{
@@ -157,23 +157,6 @@ footer{
   }
 }
 
-@media screen and (max-width: 1330px){
-  .footer{
-    padding: 40px 24px;
-  }
-  .space{
-    .layout-corral{
-      max-width: 100vw;
-    }
-  }
-  right-content, left-content{
-    display: none;
-  }
-}
-
-
-
-
 
 pages-menu-item{
   display: flex;
@@ -195,8 +178,32 @@ pages-menu-item{
 
 }
 
-
-
 .pages{
   width: 100%;
+}
+
+
+
+@media screen and (max-width: 1330px){
+  .footer{
+    padding: 40px 24px;
+  }
+  .space{
+    .layout-corral{
+      max-width: 100vw;
+    }
+  }
+  right-content, left-content{
+    display: none;
+  }
+}
+
+
+@media screen and (max-width: 900px){
+  .space{
+    .layout-corral, .page-corral{
+      padding: 0 24px;
+    }
+  }
+
 }

src/vniigaz-v2/css/_main-menu.scss

@@ -135,6 +135,7 @@ slider[side="left"]{
         }
 
         &.top-menu{
+          margin-bottom: 20px;
           &>pages-menu-item>.item>a{
             font-family: PT Sans Narrow;
             font-size: 24px;
@@ -150,6 +151,20 @@ slider[side="left"]{
     }
   }
 
+  .btn-menu{
+    display: block;
+    padding: 20px 0 0 ;
+      border-top: 1px solid var(--prime);
+    a{
+      font-family: PT Sans Narrow;
+      font-size: 24px;
+      font-style: normal;
+      font-weight: 700;
+      letter-spacing: 0.24px;
+      color: #FFF;
+    }
+  }
+
 }
 
 

src/vniigaz-v2/css/_pages-section.scss

@@ -292,8 +292,8 @@ images-section{
   
 
   .swiper-box{
-    width: 100%;
-    height: 50vw;
+    width: 100% !important;
+    height: 75vw !important;
     max-height: 400px;
   }
 
@@ -503,10 +503,10 @@ gellery{
 
 video-section{
   cursor: pointer;
-  width: 100%;
   .video-box{
     max-width: 720px;
-    height: 400px;
+    height: 405px;
+    max-height: 52vw;
     position: relative;
     z-index: 0;
 

src/vniigaz-v2/css/_slider.scss

@@ -158,27 +158,7 @@
     }
   }
 
-  .btn-menu{
-    display: block;
-    padding: 15px var(--xl);
-      border-top: 1px solid var(--second);
-    div{
-      
-      display: flex;
-      flex-direction: column;
-      gap: 15px;
-      button{
-        display: flex;
-        justify-content: start;
-        font-weight: 300;
-        font-size: 15px;
-        &:hover{
-          color: var(--active);
-        }
-      }
-      
-    }
-  }
+
 
 
   [footer] {