new vniigaz-v2 css and documents card-person

src/app/_modules/pages/sections/types/basic/cards/items/item/types/persons/cards-item-persons.component.html

@@ -3,6 +3,17 @@
 </div>
 <div class="title" *ngIf="name">{{name}}</div>
 <div class="subtitle" *ngIf="position">{{position}}</div>
+<div class="documents list default">
+  <div class="items">
+    <div class="item" *ngFor="let document of documents">
+      <!--      <file-ico [type]="document.extension"></file-ico>-->
+      <div class="value">
+        <a [href]="document.links?.open" target="_blank">{{document.name}}</a>
+        <div class="description">{{document.description}}</div>
+      </div>
+    </div>
+  </div>
+</div>
 <div class="phone" *ngIf="phone">{{phone}}</div>
 <div class="email" *ngIf="email">{{email}}</div>
 <div class="html" [innerHtml]="html"></div>

src/app/_modules/pages/sections/types/basic/cards/items/item/types/persons/cards-item-persons.component.ts

@@ -26,6 +26,9 @@ export class CardsItemPersonsComponent {
   get position() {
     return this.objectsService.getValue(this.card, 'person-position');
   }
+  get documents() {
+    return this.objectsService.getValue(this.card, 'documents');
+  }
   get phone() {
     return this.objectsService.getValue(this.card, 'contact-phone');
   }

src/assets/css/_grid.scss

@@ -87,7 +87,7 @@ right-content{
       width: 100%;
       max-width: $page-width;
     }
-    
+
   }
 }
 
@@ -99,7 +99,7 @@ footer{
     width: 100%;
     padding: 40px 0;
     margin-top: 48px;
-    
+
     color: white;
     display: flex;
     flex-direction: column;
@@ -134,14 +134,14 @@ footer{
         display: block;
       }
     }
-  
+
     .line{
       width: 100%;
       height: 1px;
       background-color: var(--prime);
       margin-bottom: 40px;
     }
-  
+
     .copyright{
       display: flex;
       justify-content: space-between;
@@ -194,4 +194,4 @@ pages-menu-item{
 
 .pages{
   width: 100%;
-}
+}

src/assets/css/_main-menu.scss

@@ -25,7 +25,7 @@ header{
       &:not(.lvl-0){
           display: none;
         }
-        
+
       .item{
         drop-down{
           display: none;
@@ -62,7 +62,7 @@ header{
 
 a.logo{
   img{
-    width:114px; 
+    width:114px;
     height: 80px;
   }
 }
@@ -156,7 +156,7 @@ right-content{
           display: none;
           &.parent,&.current{
             display: block;
-            >pages-menu{              
+            >pages-menu{
               background-color: var(--white);
               padding: 20px;
               border-radius: 8px;
@@ -206,17 +206,10 @@ right-content{
         &.current,&.parent {
             background-color: #ededed;
             border-radius: 8px;
-            a {              
+            a {
               color: var(--second-act);
             }
           }
-        
-
       }
-
-
-
-
-
     }
 

src/vniigaz-v2/css/_grid.scss

@@ -7,7 +7,7 @@
   justify-content: center;
   >.layout-corral{
     flex-basis: calc($layout-width + 2 * $pxl);
-    padding: 0 $pxl;
+    padding: 0 20px;
     display: flex;
   };
   .page-corral{
@@ -121,7 +121,7 @@ jumbotron{
     left-content{
       display: none;
     }
-    
+
     right-content{
       flex-shrink: 0;
       pages-menu.current{
@@ -134,7 +134,7 @@ jumbotron{
       max-width: 100%;
       width: $page-width;
     }
-    
+
   }
 }
 
@@ -152,7 +152,7 @@ jumbotron{
 
 @media screen and (min-width: 1330px){
   .this-root-page{
-    .content-sapce{  
+    .content-sapce{
       .content-grid{
         .main-content{
           margin-left: 150px;
@@ -170,7 +170,7 @@ footer{
     width: 100%;
     padding: 40px 0;
     margin-top: 48px;
-    font-size: 16px;    
+    font-size: 16px;
     color: white;
     display: flex;
     flex-direction: column;
@@ -213,13 +213,13 @@ footer{
         display: block;
       }
     }
-  
+
     .line{
       width: 100%;
       height: 1px;
       background-color: var(--prime);
     }
-  
+
     .copyright{
       display: flex;
       justify-content: space-between;
@@ -296,4 +296,4 @@ pages-menu-item{
     gap: 24px;
   }
 
-}
+}

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

@@ -4,7 +4,7 @@ pages-menu{
   padding-left: 0;
 }
 pages-menu{
-  padding-inline-start: 24px;
+  padding-inline-start: 6px;
 }
 
 
@@ -21,11 +21,11 @@ header{
 
     pages-menu{
       flex-direction: row;
-      gap:24px;
+      gap:12px;
       &:not(.lvl-0){
           display: none;
         }
-        
+
       .item{
         drop-down{
           display: none;
@@ -99,7 +99,7 @@ header{
 
 a.logo{
   img{
-    width:114px; 
+    width:114px;
     height: 80px;
   }
 }
@@ -372,7 +372,7 @@ right-content{
       }
 
     }
-    
+
   }
 }
 

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

@@ -85,7 +85,7 @@ add-section, publications-list{
           border-top: 1px solid var(--second-dis);
           border-bottom: 1px solid var(--second-dis);
         }
-        
+
         &.active{
           a{
             color: var(--prime-act);
@@ -97,7 +97,7 @@ add-section, publications-list{
         top:22px;
       }
     }
-    
+
 }
 
 .menu {
@@ -157,9 +157,9 @@ cards-section-items{
         align-items: stretch;
         gap: 24px;
         flex-wrap: wrap;
-      
+
         cards-section-item {
-          
+
           width: 252px;
           cards-item-persons{
             display: flex;
@@ -178,6 +178,9 @@ cards-section-items{
                 height: 100%;
               }
             }
+            .item{
+                overflow: hidden;
+            }
             .title{
               font-family: PT Sans Narrow;
               font-size: 24px;
@@ -206,7 +209,7 @@ cards-section-items{
             .entry-contents{
               text-align: justify;
               text-indent: 30px;
-            } 
+            }
 
           }
 
@@ -242,7 +245,7 @@ cards-section-items{
 
 
 
-// cards 
+// cards
 
 
 
@@ -279,7 +282,7 @@ cards-section-items{
     }
     .card-subheader, .card-text{
       display: none;
-    } 
+    }
   }
   .default{
     display: flex;
@@ -327,10 +330,10 @@ cards-section-items{
         border-color:  var(--bk44);
       }
       .card-subheader{
-        color: var(--bk88); 
+        color: var(--bk88);
       }
       .card-header{
-        color: var(--bk66); 
+        color: var(--bk66);
       }
       &::after{
         background-image: url(/assets/images/ico/arrow_forward_24_hover.svg);
@@ -432,7 +435,7 @@ cards-section-items{
 
 
 
-// cards 
+// cards
 
 
 
@@ -455,56 +458,56 @@ images-section{
     top:24px;
     right: 24px;
   }
-  
-  
-  
+
+
+
   .items {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     width: 100%;
     gap: 8px;
-  
-    img{  
+
+    img{
       border-radius: 12px;
     }
-  
+
     &.tiles{
       .item{
         margin-bottom: 16px;
         img{
           border: 1px solid var(--second-dis);
           max-height: 273px;
-          max-width: 273px; 
+          max-width: 273px;
         }
-      }      
+      }
     }
-  
+
     &.full-width{
       display: flex;
       flex-direction: column;
-  
+
       .item{
         max-width: 100%;
         margin-bottom: 32px;
         img{
           max-width: 100%;
         }
-      }      
+      }
     }
-  
+
     .item {
-      
+
       position: relative;
-  
+
       img {
         cursor: pointer;
       }
-  
+
       &:last-child {
         margin-bottom: 0;
       }
-  
+
       &.full-width {
         display: flex;
         flex-direction: column;
@@ -515,7 +518,7 @@ images-section{
       }
     }
   }
-  
+
 
   .swiper-box{
     width: 100% !important;
@@ -523,7 +526,7 @@ images-section{
     max-height: 400px;
   }
 
-  
+
   .fullscreen {
     top: 0;
     left: 0;
@@ -535,12 +538,12 @@ images-section{
     width: 100vw;
     height: 100vh;
     background-color: grey;
-  
+
   }
-  
+
   @media screen and (max-width: 700px){
     .carousel {
-  
+
       .prev, .next {
         cursor: pointer;
         z-index: 1;
@@ -558,9 +561,9 @@ images-section{
         .slide {
           width: calc( 100vw - 80px );
           height: calc( (100vw - 80px) * 0.75 );
-  
+
           img {
-  
+
           }
         }
       }
@@ -574,14 +577,14 @@ images-section{
       display: flex !important;
     }
     .fullscreen {
-  
-     
+
+
       .content {
         position: fixed;
         display: flex;
         pointer-events: none;
-        
-        
+
+
         width:100vw;
         height:100vh;
         left: 0;
@@ -605,11 +608,11 @@ publications-list{
     align-items: flex-end;
     gap: 8px;
   }
-  
+
   .items {
     margin: 24px 0;
-  }  
-  
+  }
+
   publications-list-item {
     display: block;
     padding: 24px 0;
@@ -625,13 +628,13 @@ publications-list{
       font-size: 32px;
       line-height: 38px;
     }
-  
+
     .date{
       color: var(--second);
       margin-bottom: 16px;
     }
-    
-    
+
+
     .excerpt{
       margin-top: $p;
       font-family: PT Sans;
@@ -646,20 +649,20 @@ publications-list{
     .name{
       margin-bottom: 24px;
     }
-  
+
     .publication-read-more{
       margin-top: 24px;
     }
-  
+
     .content{
       margin-top: $p;
       display: flex;
       flex-direction: column;
       gap: $p;
     };
-  
+
   }
-  
+
 }
 
 publication-page {
@@ -668,7 +671,7 @@ publication-page {
     color: var(--second);
     margin-bottom: 16px;
   }
-  
+
 
   .name{
     margin-bottom: 24px;
@@ -682,7 +685,7 @@ publication-page {
     text-align: justify;
     text-indent: 30px;
   };
-  
+
   .publication-page-back {
     display: inline-flex;
     align-items: center;
@@ -693,7 +696,7 @@ publication-page {
 }
 
 gellery{
-  .poster{ 
+  .poster{
     height: 468px;
     max-width: calc( 100vw - 80px);
     max-height: calc( (100vw - 80px ) * 0.7 );
@@ -761,7 +764,7 @@ video-section{
     .poster{
       object-fit: cover;
       width: 100%;
-      height: 100%;   
+      height: 100%;
     }
     .icon{
       position: absolute;
@@ -777,7 +780,7 @@ video-section{
       background-color: black;
     }
   }
-  
+
 }
 
 
@@ -859,4 +862,4 @@ video-section{
       display: none;
     }
   }
-}
+}