From 1b74e60b76427d408c7c6edd496c0cc94da0319e Mon Sep 17 00:00:00 2001
From: Boris Voropaev <boris1voropaev@gmail.com>
Date: Wed, 29 Nov 2023 15:28:34 +0300
Subject: [PATCH] page section css

---
 .../basic/cards/cards-section.component.scss  |  4 +-
 .../types/basic/cards/cards-section.module.ts |  4 +-
 .../item/cards-section-item.component.html    | 11 ++-
 .../persons/cards-item-persons.component.html | 10 +--
 .../basic/html/html-section.component.scss    | 19 -----
 .../iframe/iframe-section.component.scss      |  5 --
 .../basic/maps/maps-section.component.scss    |  1 -
 .../basic/video/video-section.component.scss  |  1 -
 src/assets/css/_basics.scss                   |  3 +
 .../layout/jumbotron/jumbotron.component.ts   |  5 --
 src/vniigaz-v2/css/_basics.scss               | 23 +++++-
 src/vniigaz-v2/css/_grid.scss                 | 32 ++++----
 src/vniigaz-v2/css/_main-menu.scss            |  6 ++
 src/vniigaz-v2/css/_pages-section.scss        | 80 ++++++++++++++++---
 14 files changed, 131 insertions(+), 73 deletions(-)

diff --git a/src/app/_modules/pages/sections/types/basic/cards/cards-section.component.scss b/src/app/_modules/pages/sections/types/basic/cards/cards-section.component.scss
index 469bf09..8b13789 100644
--- a/src/app/_modules/pages/sections/types/basic/cards/cards-section.component.scss
+++ b/src/app/_modules/pages/sections/types/basic/cards/cards-section.component.scss
@@ -1,3 +1 @@
-.add {
-  margin-bottom: 24px;
-}
+
diff --git a/src/app/_modules/pages/sections/types/basic/cards/cards-section.module.ts b/src/app/_modules/pages/sections/types/basic/cards/cards-section.module.ts
index ad4604f..8d71c62 100644
--- a/src/app/_modules/pages/sections/types/basic/cards/cards-section.module.ts
+++ b/src/app/_modules/pages/sections/types/basic/cards/cards-section.module.ts
@@ -6,12 +6,14 @@ import {CardsSectionItemComponent} from "@app/_modules/pages/sections/types/basi
 import {CardsItemPersonsComponent} from "@app/_modules/pages/sections/types/basic/cards/items/item/types/persons/cards-item-persons.component";
 import {CardsItemPartnersComponent} from "@app/_modules/pages/sections/types/basic/cards/items/item/types/partners/cards-item-partners.component";
 import {SortablejsModule} from "ngx-sortablejs";
+import { WidjetModule } from '@app/_modules/widjet/widjet.module';
 
 
 @NgModule({
   imports: [
     CommonModule,
-    SortablejsModule
+    SortablejsModule,
+    WidjetModule
   ],
   declarations: [
     CardsSectionComponent,
diff --git a/src/app/_modules/pages/sections/types/basic/cards/items/item/cards-section-item.component.html b/src/app/_modules/pages/sections/types/basic/cards/items/item/cards-section-item.component.html
index 44abacf..ab6d3f5 100644
--- a/src/app/_modules/pages/sections/types/basic/cards/items/item/cards-section-item.component.html
+++ b/src/app/_modules/pages/sections/types/basic/cards/items/item/cards-section-item.component.html
@@ -1,7 +1,14 @@
 <div class="card" [ngSwitch]="type?.name">
   <div class="menu" *ngIf="editMode">
-    <button type="button" (click)="edit()">edit</button>
-    <button type="button" (click)="delete()">delete</button>
+    <div class="block">
+      <a>
+        <ico ico="edit_24" (click)="edit()"></ico>
+      </a>
+      <a>
+        <ico ico="delete_24" (click)="delete()"></ico>
+      </a>
+    </div>
+
   </div>
   <cards-item-persons *ngSwitchCase="'cards-section-persons'" [card]="card"></cards-item-persons>
   <cards-item-partners *ngSwitchCase="'cards-section-partners'" [card]="card"></cards-item-partners>
diff --git a/src/app/_modules/pages/sections/types/basic/cards/items/item/types/persons/cards-item-persons.component.html b/src/app/_modules/pages/sections/types/basic/cards/items/item/types/persons/cards-item-persons.component.html
index 434577e..e1384c2 100644
--- a/src/app/_modules/pages/sections/types/basic/cards/items/item/types/persons/cards-item-persons.component.html
+++ b/src/app/_modules/pages/sections/types/basic/cards/items/item/types/persons/cards-item-persons.component.html
@@ -1,8 +1,8 @@
 <div class="image">
-  <img [src]="image?.links?.thumb" />
+  <img  *ngIf="image?.links?.thumb" [src]="image?.links?.thumb" />
 </div>
-<div class="title">{{name}}</div>
-<div class="subtitle">{{position}}</div>
-<div class="phone">{{phone}}</div>
-<div class="email">{{email}}</div>
+<div class="title" *ngIf="name">{{name}}</div>
+<div class="subtitle" *ngIf="position">{{position}}</div>
+<div class="phone" *ngIf="phone">{{phone}}</div>
+<div class="email" *ngIf="email">{{email}}</div>
 
diff --git a/src/app/_modules/pages/sections/types/basic/html/html-section.component.scss b/src/app/_modules/pages/sections/types/basic/html/html-section.component.scss
index 322271a..8b13789 100644
--- a/src/app/_modules/pages/sections/types/basic/html/html-section.component.scss
+++ b/src/app/_modules/pages/sections/types/basic/html/html-section.component.scss
@@ -1,20 +1 @@
-:host{
-    color: var(--second-act);
-    font-family: PT Sans;
-    font-size: 20px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 32px;
-    a {
-        color: var(--prime);
-        &:hover{
-            color: var(--prime-act);
-        };
-    }
-    >div{
-        display: block;
-        margin-top: -16px;
-        margin-bottom: -16px;
-    }
 
-}
diff --git a/src/app/_modules/pages/sections/types/basic/iframe/iframe-section.component.scss b/src/app/_modules/pages/sections/types/basic/iframe/iframe-section.component.scss
index 64f36b2..e69de29 100644
--- a/src/app/_modules/pages/sections/types/basic/iframe/iframe-section.component.scss
+++ b/src/app/_modules/pages/sections/types/basic/iframe/iframe-section.component.scss
@@ -1,5 +0,0 @@
-iframe {
-  width: 100%;
-  height: 400px;
-  margin-bottom: 40px;
-}
diff --git a/src/app/_modules/pages/sections/types/basic/maps/maps-section.component.scss b/src/app/_modules/pages/sections/types/basic/maps/maps-section.component.scss
index 64f36b2..2b6e167 100644
--- a/src/app/_modules/pages/sections/types/basic/maps/maps-section.component.scss
+++ b/src/app/_modules/pages/sections/types/basic/maps/maps-section.component.scss
@@ -1,5 +1,4 @@
 iframe {
   width: 100%;
   height: 400px;
-  margin-bottom: 40px;
 }
diff --git a/src/app/_modules/pages/sections/types/basic/video/video-section.component.scss b/src/app/_modules/pages/sections/types/basic/video/video-section.component.scss
index 1f606d7..abeebdf 100644
--- a/src/app/_modules/pages/sections/types/basic/video/video-section.component.scss
+++ b/src/app/_modules/pages/sections/types/basic/video/video-section.component.scss
@@ -3,5 +3,4 @@ iframe {
   max-width: 720px;
   min-height: 400px;
   height: 100%;
-  margin-bottom: 24px;
 }
diff --git a/src/assets/css/_basics.scss b/src/assets/css/_basics.scss
index be6bd88..54100b4 100644
--- a/src/assets/css/_basics.scss
+++ b/src/assets/css/_basics.scss
@@ -46,6 +46,9 @@ $pxxs:4px;
 .menu {
   display: flex;
   .block {
+    a{
+      height: 24px;
+    }
     background: #fff;
     border: 1px solid var(--second-dis);
     border-radius: $pxs;
diff --git a/src/vniigaz-v2/component/layout/jumbotron/jumbotron.component.ts b/src/vniigaz-v2/component/layout/jumbotron/jumbotron.component.ts
index fddfe74..8795ff7 100644
--- a/src/vniigaz-v2/component/layout/jumbotron/jumbotron.component.ts
+++ b/src/vniigaz-v2/component/layout/jumbotron/jumbotron.component.ts
@@ -42,11 +42,6 @@ export class JumbotronComponent {
     this.subscription.unsubscribe();
   }
 
-
-
-
-
-
   get name(){
     let name:string
     if(this.currentPage){
diff --git a/src/vniigaz-v2/css/_basics.scss b/src/vniigaz-v2/css/_basics.scss
index f4f9b08..874f31d 100644
--- a/src/vniigaz-v2/css/_basics.scss
+++ b/src/vniigaz-v2/css/_basics.scss
@@ -31,7 +31,7 @@
 }
 
 $layout-width: 1280px;
-$page-width: 900px;
+$page-width: 840px;
 
 $pxl:40px;
 $pl:32px;
@@ -46,6 +46,9 @@ $pxxs:4px;
 .menu {
   display: flex;
   .block {
+    a{
+      height: 24px;
+    }
     background: #fff;
     border: 1px solid var(--second-dis);
     border-radius: $pxs;
@@ -212,6 +215,15 @@ body {
   margin: 0 auto;
 }
 
+p {
+  font-family: PT Sans;
+  font-size: 20px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 32px;
+  margin: 0;
+}
+
 h1{
   color: var(--white);
   font-family: PT Sans Narrow;
@@ -230,7 +242,6 @@ h2 {
   font-weight: 700;
   line-height: 60px; /* 120% */
   letter-spacing: 0.5px;
-  padding-top: 16px;
   margin:0;
 }
 h3 {
@@ -241,7 +252,6 @@ h3 {
   font-weight: 700;
   line-height: 60px; /* 120% */
   letter-spacing: 0.36px;
-  padding-top: 8px;
   margin:0;
 }
 h4 {
@@ -252,7 +262,6 @@ h4 {
   font-weight: 700;
   line-height: 44px; /* 133.333% */
   letter-spacing: 0.24px;
-  padding-top: 8px;
   margin:0;
 }
 
@@ -277,6 +286,12 @@ a {
   }
 }
 
+iframe {
+  width: 100%;
+  height: 400px;
+}
+
+
 span.link {
   font-weight: normal;
   color: #86898E;
diff --git a/src/vniigaz-v2/css/_grid.scss b/src/vniigaz-v2/css/_grid.scss
index a0f6a5b..4f42cda 100644
--- a/src/vniigaz-v2/css/_grid.scss
+++ b/src/vniigaz-v2/css/_grid.scss
@@ -59,31 +59,27 @@ jumbotron{
 }
 
 
-left-content{
-  display: none;
-}
-
-right-content{
-  flex-basis: 180px;
-  flex-shrink: 0;
-  .item{display: none;}
-  pages-menu.current{
-    pages-menu-item>.item{
-      display: flex;
-    }
-  }
-}
 
 .content-sapce{
   flex-grow: 1;
   .content-grid{
     display: flex;
-    >*{
-      flex-grow: 1;
+    justify-content: center;
+    left-content{
+      display: none;
+    }
+    
+    right-content{
+      flex-shrink: 0;
+      pages-menu.current{
+        pages-menu-item>.item{
+          display: flex;
+        }
+      }
     }
     .main-content{
-      width: 100%;
-      max-width: $page-width;
+      max-width: 100%;
+      width: $page-width;
     }
     
   }
diff --git a/src/vniigaz-v2/css/_main-menu.scss b/src/vniigaz-v2/css/_main-menu.scss
index e6fac2b..4c1ca71 100644
--- a/src/vniigaz-v2/css/_main-menu.scss
+++ b/src/vniigaz-v2/css/_main-menu.scss
@@ -134,6 +134,7 @@ slider-menu{
   }
 }
 right-content{
+  padding-top: 40px;
   drop-down{
     display: none;
   }
@@ -144,11 +145,14 @@ right-content{
   }
 
   .item.lvl-0{
+    padding: 0;
     >a{
       display: none;
     }
     &.nav+pages-menu{
       pages-menu.lvl-2{
+        width: 400px;
+        margin-left: 40px;
         border-radius: 8px;
         background: var(#FFF);
         box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.27);
@@ -183,6 +187,8 @@ right-content{
 
 
     &:not(.nav)+pages-menu{
+      width: 360px;
+      margin-left: 40px;
       border-radius: 8px;
       background: var(#FFF);
       box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.27);
diff --git a/src/vniigaz-v2/css/_pages-section.scss b/src/vniigaz-v2/css/_pages-section.scss
index 4c6805f..bb1195b 100644
--- a/src/vniigaz-v2/css/_pages-section.scss
+++ b/src/vniigaz-v2/css/_pages-section.scss
@@ -1,9 +1,22 @@
-pages-section{
-  .section {
-    margin-top: 24px;
-    display: flex;  
+page-sections{
+  margin-top: 40px;
+  margin-bottom: 120px;
+  display: flex;
+  flex-direction: column;
+  gap:24px;
+  .section{
+    display: flex;
     flex-direction: column;
   }
+  h2{
+    margin-bottom: 8px;
+  }
+  h4 {
+    margin-bottom: -16px;
+  }
+  p+p{
+    padding-top: 16px;
+  }
 }
 
 
@@ -43,11 +56,60 @@ cards-section-items{
         flex-wrap: wrap;
       
         cards-section-item {
-          width: 240px;
-          .card {
-            height: 100%;
-            padding: 12px;
-            border: #dedede solid 1px;
+          
+          width: 252px;
+          cards-item-persons{
+            display: flex;
+            flex-direction: column;
+            gap: 16px;
+            .image{
+              width: 100%;
+              height: 338px;
+              border-radius: 12px;
+              border: 1px solid var(--second-dis);
+              background: url('../images/view-man.svg') var(--white) center / 65% no-repeat;
+              overflow: hidden;
+              img{
+                object-fit: cover;
+                width: 100%;
+                height: 100%;
+              }
+            }
+            .title{
+              font-family: PT Sans Narrow;
+              font-size: 24px;
+              font-style: normal;
+              font-weight: 700;
+              line-height: 32px;
+              letter-spacing: 0.24px;
+              color: var(--second);
+            }
+            .subtitle{
+              color: var(--dark);
+            }
+            .subtitle{
+              color: var(--dark);
+            }
+            .email{
+              color:var(--prime)
+            }
+
+          }
+
+          cards-item-partners{
+            a{
+              display: block;
+              width: 100%;
+              height: 252px;
+              padding: 16px;
+              border-radius: 12px;
+              border: 1px solid var(--second-dis);
+              img{
+                object-fit: contain;
+                width: 100%;
+                height: 100%;
+              }
+            }
           }
         }
     }