From 83c3085c9b49c4e35c5e9d5dd649fdd273915f88 Mon Sep 17 00:00:00 2001 From: Boris Voropaev Date: Thu, 7 Dec 2023 15:48:15 +0300 Subject: [PATCH] bugfix css --- .../field/form-field.component.scss | 42 --- .../image/form-field-image.component.scss | 1 - .../form/slider/slider-form.component.html | 2 +- .../sections/menu/page-menu.component.html | 4 +- .../persons/cards-item-persons.component.html | 4 +- .../pagination/pagination.component.scss | 55 ---- .../widjet/file-ico/file-ico.component.ts | 6 +- .../widjet/slider/slider.component.html | 4 +- src/assets/css/_buttons.scss | 107 +------- src/assets/css/_main-menu.scss | 2 +- src/assets/css/_slider.scss | 245 ++++-------------- .../layout/footer/footer.component.html | 38 +-- src/vniigaz-v2/css/_basics.scss | 22 +- src/vniigaz-v2/css/_documents-lists.scss | 4 - src/vniigaz-v2/css/_forms.scss | 50 ++++ src/vniigaz-v2/css/_grid.scss | 8 +- src/vniigaz-v2/css/_main-menu.scss | 12 +- src/vniigaz-v2/css/_page-top-panel.scss | 1 + src/vniigaz-v2/css/_pages-section.scss | 138 ++++++++-- src/vniigaz-v2/css/_slider.scss | 12 +- src/vniigaz-v2/images/ico/DOC_60.svg | 13 + src/vniigaz-v2/images/ico/FILE_60.svg | 10 + src/vniigaz-v2/images/ico/JPG_60.svg | 10 + src/vniigaz-v2/images/ico/PDF_60.svg | 14 + src/vniigaz-v2/images/ico/PPT_60.svg | 10 + src/vniigaz-v2/images/ico/XLS_60.svg | 13 + src/vniigaz-v2/images/ico/calendar_24.svg | 3 + .../images/ico/calendar_grey_24.svg | 3 + 28 files changed, 349 insertions(+), 484 deletions(-) create mode 100644 src/vniigaz-v2/images/ico/DOC_60.svg create mode 100644 src/vniigaz-v2/images/ico/FILE_60.svg create mode 100644 src/vniigaz-v2/images/ico/JPG_60.svg create mode 100644 src/vniigaz-v2/images/ico/PDF_60.svg create mode 100644 src/vniigaz-v2/images/ico/PPT_60.svg create mode 100644 src/vniigaz-v2/images/ico/XLS_60.svg create mode 100644 src/vniigaz-v2/images/ico/calendar_24.svg create mode 100644 src/vniigaz-v2/images/ico/calendar_grey_24.svg diff --git a/src/app/_modules/form-fields/field/form-field.component.scss b/src/app/_modules/form-fields/field/form-field.component.scss index c918044..8b13789 100644 --- a/src/app/_modules/form-fields/field/form-field.component.scss +++ b/src/app/_modules/form-fields/field/form-field.component.scss @@ -1,43 +1 @@ -.field { - display: flex; - flex-direction: column; - width: 100%; - margin: 0 0 24px; - row-gap: 8px; - .caption { - color: var(--grey-4); - font-size: 1rem; - font-style: normal; - font-weight: 400; - line-height: 20px; - padding-top: 8px; - } - .value { - .error { - margin-top: 2px; - font-size: 0.875rem; - color: #e60046; - } - } - &.readonly { - margin: 0 0 12px; - .caption { - //padding: 0; - } - } -} -@media screen and (max-width: 600px) { - .field { - margin-bottom: 8px; - .caption { - width: 100%; - padding: 0; - margin: 0 0 8px; - } - .value { - width: 100%; - margin: 0 0 16px; - } - } -} diff --git a/src/app/_modules/form-fields/types/image/form-field-image.component.scss b/src/app/_modules/form-fields/types/image/form-field-image.component.scss index cb15c53..57d6bcd 100644 --- a/src/app/_modules/form-fields/types/image/form-field-image.component.scss +++ b/src/app/_modules/form-fields/types/image/form-field-image.component.scss @@ -63,7 +63,6 @@ .item { display: flex; flex-direction: row; - align-items: center; .preview { width: 80px; height: 80px; diff --git a/src/app/_modules/objects/form/slider/slider-form.component.html b/src/app/_modules/objects/form/slider/slider-form.component.html index 94aa940..b0fbe1f 100644 --- a/src/app/_modules/objects/form/slider/slider-form.component.html +++ b/src/app/_modules/objects/form/slider/slider-form.component.html @@ -16,7 +16,7 @@
* Поля, обязательные для заполнения
- +
diff --git a/src/app/_modules/pages/sections/menu/page-menu.component.html b/src/app/_modules/pages/sections/menu/page-menu.component.html index 322320b..abd78c4 100644 --- a/src/app/_modules/pages/sections/menu/page-menu.component.html +++ b/src/app/_modules/pages/sections/menu/page-menu.component.html @@ -1,7 +1,7 @@
- - + +
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 82362f7..d532841 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 @@ -5,7 +5,9 @@
{{position}}
{{phone}}
-
...
+
+ Подробнее +

{{name}}

diff --git a/src/app/_modules/pagination/pagination.component.scss b/src/app/_modules/pagination/pagination.component.scss index 448a9cf..8b13789 100644 --- a/src/app/_modules/pagination/pagination.component.scss +++ b/src/app/_modules/pagination/pagination.component.scss @@ -1,56 +1 @@ -.pagination { - display: flex; - flex-direction: row; - align-items: center; - flex-wrap: wrap; - gap: 12px; - button { - background-color: transparent; - min-width: 24px; - height: 24px; - border-radius: 4px; - font-weight: 700; - font-size: 0.875rem; - line-height: 18px; - border: 1px solid var(--second); - text-align: center; - padding: 1px 6px; - color: var(--dark); - &.active { - border-color: var(--prime); - color: var(--prime); - } - &.next { - margin-right: 20px; - border-color: transparent; - font-size: 0.875rem; - font-style: normal; - font-weight: 400; - line-height: 18px; - } - } - .dots { - width: 24px; - height: 24px; - background: transparent url("~src/assets/images/icons/more_horiz_20dp.svg") no-repeat center; - } - .count { - display: flex; - justify-content: right; - flex-grow: 1; - color: var(--black); - font-size: 0.875rem; - } -} - -@media screen and (max-width: 767px) { - .pagination { - .next { - display: none; - } - .count { - display: none; - } - } -} diff --git a/src/app/_modules/widjet/file-ico/file-ico.component.ts b/src/app/_modules/widjet/file-ico/file-ico.component.ts index 27346ca..b97251f 100644 --- a/src/app/_modules/widjet/file-ico/file-ico.component.ts +++ b/src/app/_modules/widjet/file-ico/file-ico.component.ts @@ -34,8 +34,8 @@ export class FileIcoComponent { get url(){ let type = this.type?.toUpperCase() let svg = this.typeList[type]? - this.typeList[type]+'.svg': - 'document_60dp.svg'; - return `assets/images/icons/document/${svg}` + this.typeList[type]+'_60.svg': + 'FILE_60.svg'; + return `assets/images/ico/${svg}` } } diff --git a/src/app/_modules/widjet/slider/slider.component.html b/src/app/_modules/widjet/slider/slider.component.html index ee119f2..3270fb2 100644 --- a/src/app/_modules/widjet/slider/slider.component.html +++ b/src/app/_modules/widjet/slider/slider.component.html @@ -3,9 +3,7 @@
- +
diff --git a/src/assets/css/_buttons.scss b/src/assets/css/_buttons.scss index 9a421b1..d971423 100644 --- a/src/assets/css/_buttons.scss +++ b/src/assets/css/_buttons.scss @@ -104,109 +104,4 @@ div.move{ height: 24px; background: center no-repeat; background-image: url('~src/assets/images/icons/drag-n-drop_24.svg'); -} - -// .inline-menu.default { -// display: inline-flex; -// align-items: center; -// gap: 24px; -// padding: 8px 24px; -// background-color: #F5F4F4; -// border: #E8E8E8 solid 1px; -// border-radius: 4px; -// button { -// width: 20px; -// height: 20px; -// background: transparent none 50% 50% no-repeat; -// &.add {background-image: url('~src/assets/images/icons/note_add_20.svg');} -// &.edit {background-image: url('~src/assets/images/icons/edit_20.svg');} -// &.delete {background-image: url('~src/assets/images/icons/trash_20.svg');} -// &.move {background-image: url('~src/assets/images/icons/drag-n-drop_24.svg');} -// } -// } - -// .btn { -// color: #ffffff; -// padding: 11px 24px; -// background: var(--orange-2); -// border: 1px solid var(--orange-2); -// border-radius: 4px; -// font-weight: 500; -// font-size: 0.875rem; -// line-height: 18px; -// letter-spacing: 0.02em; -// text-transform: uppercase; - - -// &.with-icon { -// display: flex; -// flex-direction: row; -// align-items: center; -// padding: 8px 20px 8px 12px; -// &:before { -// display: block; -// width: 24px; -// height: 24px; -// margin-right: 8px; -// background: transparent none 50% 50% no-repeat; -// content: ""; -// } -// &.add { -// &:before { -// //background-image: url('~src/assets/images/icons/add_circle_white_24dp.svg'); -// } -// } -// } -// &.small { -// height: 28px; -// padding: 4px 16px; -// } -// &.danger { -// background-color: #db373a; -// } -// &.secondary { -// background-color: var(--white); -// color: var(--orange-2); -// border: var(--orange-2) solid 1px; -// &.danger { -// border-color: #db373a; -// color: #db373a; -// } -// } -// &.icon { -// width: 24px; -// height: 24px; -// padding: 0; -// border-color: transparent; -// background: transparent none 50% 50% no-repeat; -// //&.reply {background-image: url('~src/assets/images/icons/add_comment_20dp.svg');} -// //&.delete {background-image: url('~src/assets/images/icons/close_20dp.svg');} -// &.trash {background-image: url('~src/assets/images/icons/delete_24dp.svg');} -// &.edit {background-image: url('~src/assets/images/icons/edit_dark_24.svg');} -// //&.chain {background-image: url('~src/assets/images/icons/linked_24dp.svg');} -// &.checkbox { -// display: flex; -// width: 18px; -// height: 18px; -// border: solid 1px #7f7f7f; -// border-radius: 2px; -// &.checked,&.mixed { -// background-color: #2c86cd; -// border-color: #2c86cd; -// } -// &.checked { -// //background-image: url('~src/assets/images/icons/checkbox_24dp.svg'); -// } -// &.mixed { -// &:before { -// display: block; -// width: 12px; -// height: 2px; -// margin: auto; -// background-color: #ffffff; -// content: ""; -// } -// } -// } -// } -// } +} \ No newline at end of file diff --git a/src/assets/css/_main-menu.scss b/src/assets/css/_main-menu.scss index f999b6a..cfccf9e 100644 --- a/src/assets/css/_main-menu.scss +++ b/src/assets/css/_main-menu.scss @@ -35,7 +35,7 @@ header{ content: ''; width: 24px; height: 24px; - background-image: url('~src/assets/images/ico/chevron_right_24.svg'); + background-image: url('/assets/images/ico/chevron_right_24.svg'); } &.selected::before{ transform: rotateZ(90deg); diff --git a/src/assets/css/_slider.scss b/src/assets/css/_slider.scss index 0bd700b..d7d8a80 100644 --- a/src/assets/css/_slider.scss +++ b/src/assets/css/_slider.scss @@ -29,10 +29,19 @@ h2 { - font-size: 30px; + font-family: PT Sans Narrow; + font-size: 36px; + font-style: normal; + font-weight: 700; + line-height: 44px; + letter-spacing: 0.36px; margin: 0; } + ico{ + cursor: pointer; + } + } .stepper { @@ -192,196 +201,46 @@ } } +.field { + display: flex; + flex-direction: column; + width: 100%; + margin: 0 0 24px; + row-gap: 8px; -// .slider-bar { -// position: fixed; -// top: 0; -// right: 0; -// display: flex; -// flex-direction: column; -// width: 100%; -// max-width: 720px; -// height: 100%; -// background-color: #ffffff; -// box-shadow: -3px 0 6px 0 rgba(0, 0, 0, 0.16); -// overflow: hidden; -// animation: slide-from-right 0.3s; -// z-index: 110; - -// &.right-side{ -// animation: slide-from-right 0.3s; -// right: 0; -// box-shadow: -3px 0 6px 0 rgba(0, 0, 0, 0.16); -// } -// &.left-side{ -// animation: slide-from-left 0.3s; -// left: 0; -// box-shadow: 3px 0 6px 0 rgba(0, 0, 0, 0.16); -// } - -// .header { -// padding: 14px 24px; -// border-bottom: 1px solid #C0C0C0; - -// .title { -// display: flex; -// flex-direction: row; -// align-items: center; - -// h2 { -// margin: 0; -// font-family: PT Sans Narrow; -// font-size: 36px; -// font-style: normal; -// font-weight: 700; -// line-height: 44px; /* 122.222% */ -// letter-spacing: 0.36px; -// color: var(--dark-1); -// } - -// .close { -// width: 24px; -// height: 24px; -// margin-left: auto; -// padding: 0; -// border: none; -// border-radius: 0; -// background: transparent url(/assets/images/icons/close_24dp.svg) 50% 50% no-repeat; -// } -// } - -// .stepper { -// padding: 24px 0 0; -// .items { -// display: flex; -// flex-direction: row; -// gap: 24px; -// .item { -// width: 150px; -// flex-shrink: 1; -// font-size: 14px; -// overflow: hidden; -// .num { -// position: relative; -// width: calc(100% - 13px); -// height: 24px; -// padding: 4px 6px; -// margin: 0 0 4px; -// border-radius: 2px 0 0 2px; -// background-color: #E8E9EB; -// color: #86898E; -// font-weight: bold; -// &:after { -// position: absolute; -// left: 100%; -// top: 0; -// width: 13px; -// height: 100%; -// background: transparent url('~src/assets/images/icons/step_upcoming.svg') 100% 50% no-repeat; -// content: ''; -// } -// } -// .name { -// font-size: 14px; -// color: var(--second); -// } -// &.active { -// .num { -// background-color: #B88E12; -// color: #ffffff; -// &:after { -// background-image: url('~src/assets/images/icons/step_active.svg'); -// } -// } -// .name { -// color: #B88E12; -// font-weight: bold; -// } -// } -// &.finished { -// .num { -// background-color: rgba(184, 142, 18, 0.2); -// color: #B88E12; -// &:after { -// background-image: url('~src/assets/images/icons/step_finished.svg'); -// } -// } -// .name { -// color: #B88E12; -// } -// } -// } -// } -// } -// } - -// .body { -// height: 100%; -// padding: 32px 24px; -// flex-grow: 1; -// overflow: auto; -// -webkit-overflow-scrolling: touch; -// } - -// .footer { -// display: flex; -// flex-direction: row; -// align-items: center; -// padding: 16px 24px; -// border-top: 1px solid #C0C0C0; - -// .left { -// .reset { -// color: var(--second); -// cursor: pointer; -// } - -// .notice { -// font-family: PT Sans; -// font-size: 16px; -// font-style: normal; -// font-weight: 400; -// line-height: 24px; /* 150% */ -// } -// } - -// .right { -// margin-left: auto; -// display: flex; -// button { -// margin-left: 24px; -// } -// } -// } -// } - -// .slider-overlay { -// position: fixed; -// top: 0; -// left: 0; -// width: 100%; -// height: 100%; -// background-color: rgba(0, 0, 0, 0.37); -// z-index: 100; -// } - - -// @media screen and (max-width: 767px) { -// .slider-bar { -// .header, .body, .footer { -// padding: 16px; -// } - -// .footer { -// .left { -// font-size: 14px; -// } -// .right { -// button { -// padding: 8px 16px; -// margin-left: 16px; -// } -// } -// } -// } -// } + .caption { + color: var(--second-dis); + font-family: PT Sans; + font-size: 20px; + font-style: normal; + font-weight: 400; + line-height: 32px; + } + .value { + .error { + margin-top: 2px; + font-size: 0.875rem; + color: #e60046; + } + } + &.readonly { + margin: 0 0 12px; + .caption { + //padding: 0; + } + } +} +@media screen and (max-width: 600px) { + .field { + margin-bottom: 8px; + .caption { + width: 100%; + padding: 0; + margin: 0 0 8px; + } + .value { + width: 100%; + margin: 0 0 16px; + } + } +} \ No newline at end of file diff --git a/src/vniigaz-v2/component/layout/footer/footer.component.html b/src/vniigaz-v2/component/layout/footer/footer.component.html index 697e6a0..e3e04e2 100644 --- a/src/vniigaz-v2/component/layout/footer/footer.component.html +++ b/src/vniigaz-v2/component/layout/footer/footer.component.html @@ -1,7 +1,10 @@ -
+
@@ -10,6 +13,9 @@ +
+ 142717, Российская Федерация, Московская область, г. Видное, посёлок Развилка, ВНИИГАЗ +
@@ -21,35 +27,7 @@
- -
-
- - - - -
-
- - - - +
diff --git a/src/vniigaz-v2/css/_basics.scss b/src/vniigaz-v2/css/_basics.scss index 08577f5..bdc835d 100644 --- a/src/vniigaz-v2/css/_basics.scss +++ b/src/vniigaz-v2/css/_basics.scss @@ -235,7 +235,7 @@ h3 { font-size: 36px; font-style: normal; font-weight: 700; - line-height: 60px; /* 120% */ + line-height: 44px; /* 120% */ letter-spacing: 0.36px; margin:0; } @@ -257,18 +257,6 @@ a { &:hover{ color: var(--prime-hov); }; - &.document { - display: inline-flex; - - &:before { - width: 20px; - height: 20px; - margin-right: 8px; - flex-shrink: 0; - background: transparent url('~src/assets/images/icons/document/document_20.svg') 50% 50% no-repeat; - content: ''; - } - } } iframe { @@ -437,16 +425,20 @@ modal{ height: 100vh; left: 0; top: 0; - background-color: rgba(62, 61, 64, 0.7); + background-color: rgba(62, 61, 64, 0.7); + z-index: 1000; } .modal-bar{ + position: fixed; max-width: 800px; max-height: 100vh; background-color: var(--white); border: 1px solid var(--second-dis); display: flex; flex-direction: column; - z-index: 1; + border-radius: 12px; + z-index: 1000; + overflow: hidden; .modal-header{ display: flex; justify-content: space-between; diff --git a/src/vniigaz-v2/css/_documents-lists.scss b/src/vniigaz-v2/css/_documents-lists.scss index d9d1551..4c05b79 100644 --- a/src/vniigaz-v2/css/_documents-lists.scss +++ b/src/vniigaz-v2/css/_documents-lists.scss @@ -1,9 +1,5 @@ .documents.list.default { font-size: 20px; - .title { - margin: 0 0 16px; - font-weight: bold; - } .items { .item { display: flex; diff --git a/src/vniigaz-v2/css/_forms.scss b/src/vniigaz-v2/css/_forms.scss index 978693b..8c4e030 100644 --- a/src/vniigaz-v2/css/_forms.scss +++ b/src/vniigaz-v2/css/_forms.scss @@ -85,6 +85,12 @@ input, select, textarea { } +field-date-single{ + input{ + background: url("/assets/images/ico/calendar_grey_24.svg") no-repeat right 12px center ; + } +} + .checkbox { position: absolute; @@ -210,4 +216,48 @@ form-field-document{ } } +} + +.field { + display: flex; + flex-direction: column; + width: 100%; + margin: 0 0 24px; + row-gap: 8px; + + .caption { + color: var(--second); + font-family: PT Sans; + font-size: 20px; + font-style: normal; + font-weight: 400; + line-height: 32px; + } + .value { + .error { + margin-top: 2px; + font-size: 0.875rem; + color: #e60046; + } + } + &.readonly { + margin: 0 0 12px; + .caption { + //padding: 0; + } + } +} +@media screen and (max-width: 600px) { + .field { + margin-bottom: 8px; + .caption { + width: 100%; + padding: 0; + margin: 0 0 8px; + } + .value { + width: 100%; + margin: 0 0 16px; + } + } } \ No newline at end of file diff --git a/src/vniigaz-v2/css/_grid.scss b/src/vniigaz-v2/css/_grid.scss index d3e47df..76f7701 100644 --- a/src/vniigaz-v2/css/_grid.scss +++ b/src/vniigaz-v2/css/_grid.scss @@ -98,11 +98,17 @@ footer{ width: 100%; padding: 40px 0; margin-top: 48px; - + font-size: 16px; color: white; display: flex; flex-direction: column; .block{ + .logo{ + display: flex; + flex-direction: column; + justify-content: space-between; + align-items: flex-start; + } a{ cursor: pointer; color: white; diff --git a/src/vniigaz-v2/css/_main-menu.scss b/src/vniigaz-v2/css/_main-menu.scss index 6ea192b..837b772 100644 --- a/src/vniigaz-v2/css/_main-menu.scss +++ b/src/vniigaz-v2/css/_main-menu.scss @@ -47,12 +47,12 @@ header{ } } - >a{ - border-bottom: 2px solid transparent; - } - &.parent:not(.nav),&.current:not(.nav){ - >a {border-color: var(--prime);} - } + >a{ + border-bottom: 2px solid transparent; + } + &.parent,&.current{ + >a {border-color: var(--prime);} + } } .item.nav + pages-menu.selected.lvl-1{ diff --git a/src/vniigaz-v2/css/_page-top-panel.scss b/src/vniigaz-v2/css/_page-top-panel.scss index 15bc859..0450a7c 100644 --- a/src/vniigaz-v2/css/_page-top-panel.scss +++ b/src/vniigaz-v2/css/_page-top-panel.scss @@ -1,4 +1,5 @@ header-user-bar{ + cursor: pointer; .user { position: relative; diff --git a/src/vniigaz-v2/css/_pages-section.scss b/src/vniigaz-v2/css/_pages-section.scss index cce91c6..2c16bb9 100644 --- a/src/vniigaz-v2/css/_pages-section.scss +++ b/src/vniigaz-v2/css/_pages-section.scss @@ -15,28 +15,44 @@ page-sections{ p+p{ padding-top: 16px; } + page-section:first-child{ + .menu .block .up{ + display: none; + } + } + page-section:nth-last-child(2){ + .menu .block .down{ + display: none; + } + } } -html-section ul{ - padding: 0; - >li{ - list-style: none; - line-height: 32px; - text-indent: -32px; - padding-left: 32px; - &::before{ - display: inline-block; - content: ""; - width: 16px; - height: 2px; - background-color: var(--prime); - margin-bottom: 5px; - margin-right: 16px; +html-section { + ul{ + padding: 0; + margin-bottom: 0; + >li{ + list-style: none; + line-height: 32px; + text-indent: -32px; + padding-left: 32px; + &::before{ + display: inline-block; + content: ""; + width: 16px; + height: 2px; + background-color: var(--prime); + margin-bottom: 5px; + margin-right: 16px; + } } - &+li{ + *+li{ margin-top: 24px; } } + ul+*{ + margin-bottom: 20px; + } } add-section{ @@ -63,7 +79,7 @@ add-section{ } .dropdown{ left:48px; - top:32px; + top:28px; } } @@ -93,6 +109,7 @@ cards-section{ padding: 12px 16px; border-top: 1px solid var(--second-dis); border-bottom: 1px solid var(--second-dis); + margin-bottom: 40px; ico{ cursor: pointer; svg{ @@ -154,6 +171,10 @@ cards-section-items{ .email{ color:var(--prime) } + .details a{ + display: inline-flex; + align-items: center; + } } @@ -345,6 +366,7 @@ publications-list{ .add a, .publication-read-more{ display: inline-flex; align-items: flex-end; + gap: 8px; } .items { @@ -353,7 +375,7 @@ publications-list{ publications-list-item { display: block; - padding-bottom: 24px; + padding: 24px 0; border-top: 1px solid var(--second-dis); &:last-child{ border-bottom: 1px solid var(--second-dis); @@ -361,8 +383,24 @@ publications-list{ .date{ color: var(--second); + margin-bottom: 16px; } + + .excerpt{ + font-family: PT Sans; + font-size: 20px; + font-style: normal; + font-weight: 400; + line-height: 32px; + } + .name{ + margin-bottom: 24px; + } + + .publication-read-more{ + margin-top: 24px; + } } @@ -377,6 +415,8 @@ gellery{ margin-bottom: 8px; border: 1px solid var(--second-dis); background-color: var(--second-dis); + border-radius: 12px; + overflow: hidden; } .posters{ display: flex; @@ -401,11 +441,14 @@ gellery{ } } + + video-section{ .video-box{ max-width: 720px; height: 400px; position: relative; + z-index: -1; img{ cursor:pointer } @@ -429,4 +472,63 @@ video-section{ } } +} + + + +.pagination { + display: flex; + flex-direction: row; + align-items: center; + flex-wrap: wrap; + gap: 12px; + button { + background-color: transparent; + min-width: 24px; + height: 24px; + border-radius: 4px; + font-weight: 700; + font-size: 0.875rem; + line-height: 18px; + border: 1px solid var(--second); + text-align: center; + padding: 1px 6px; + color: var(--dark); + &.active { + border-color: var(--prime); + color: var(--prime); + } + &.next { + margin-right: 20px; + border-color: transparent; + font-size: 0.875rem; + font-style: normal; + font-weight: 400; + line-height: 18px; + } + } + .dots { + width: 24px; + height: 24px; + background: transparent url("~src/assets/images/icons/more_horiz_20dp.svg") no-repeat center; + } + .count { + display: flex; + justify-content: right; + flex-grow: 1; + color: var(--black); + font-size: 16px; + } +} + + +@media screen and (max-width: 767px) { + .pagination { + .next { + display: none; + } + .count { + display: none; + } + } } \ No newline at end of file diff --git a/src/vniigaz-v2/css/_slider.scss b/src/vniigaz-v2/css/_slider.scss index 4f0456c..1965c08 100644 --- a/src/vniigaz-v2/css/_slider.scss +++ b/src/vniigaz-v2/css/_slider.scss @@ -29,8 +29,16 @@ h2 { - font-size: 30px; - margin: 0; + font-family: PT Sans Narrow; + font-size: 36px; + font-style: normal; + font-weight: 700; + line-height: 44px; /* 122.222% */ + letter-spacing: 0.36px; + } + + ico{ + cursor: pointer; } } diff --git a/src/vniigaz-v2/images/ico/DOC_60.svg b/src/vniigaz-v2/images/ico/DOC_60.svg new file mode 100644 index 0000000..fa24c8d --- /dev/null +++ b/src/vniigaz-v2/images/ico/DOC_60.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/src/vniigaz-v2/images/ico/FILE_60.svg b/src/vniigaz-v2/images/ico/FILE_60.svg new file mode 100644 index 0000000..5aa3ea9 --- /dev/null +++ b/src/vniigaz-v2/images/ico/FILE_60.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/vniigaz-v2/images/ico/JPG_60.svg b/src/vniigaz-v2/images/ico/JPG_60.svg new file mode 100644 index 0000000..9a7cb99 --- /dev/null +++ b/src/vniigaz-v2/images/ico/JPG_60.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/vniigaz-v2/images/ico/PDF_60.svg b/src/vniigaz-v2/images/ico/PDF_60.svg new file mode 100644 index 0000000..05d0f14 --- /dev/null +++ b/src/vniigaz-v2/images/ico/PDF_60.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/vniigaz-v2/images/ico/PPT_60.svg b/src/vniigaz-v2/images/ico/PPT_60.svg new file mode 100644 index 0000000..a7ab194 --- /dev/null +++ b/src/vniigaz-v2/images/ico/PPT_60.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/vniigaz-v2/images/ico/XLS_60.svg b/src/vniigaz-v2/images/ico/XLS_60.svg new file mode 100644 index 0000000..3b769b0 --- /dev/null +++ b/src/vniigaz-v2/images/ico/XLS_60.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/src/vniigaz-v2/images/ico/calendar_24.svg b/src/vniigaz-v2/images/ico/calendar_24.svg new file mode 100644 index 0000000..dbd6e44 --- /dev/null +++ b/src/vniigaz-v2/images/ico/calendar_24.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/src/vniigaz-v2/images/ico/calendar_grey_24.svg b/src/vniigaz-v2/images/ico/calendar_grey_24.svg new file mode 100644 index 0000000..cc5518f --- /dev/null +++ b/src/vniigaz-v2/images/ico/calendar_grey_24.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file