diff --git a/angular.json b/angular.json index fc78ca2..e5f2cbf 100644 --- a/angular.json +++ b/angular.json @@ -497,6 +497,10 @@ "replace": "src/app/_modules/pages/menu/slider-menu/slider-menu.component.ts", "with": "src/tk023/component/pages/menu/slider-menu/slider-menu.component.ts" }, + { + "replace": "src/app/_modules/pages/page/page.component.ts", + "with": "src/tk023/component/pages/page/page.component.ts" + }, { "replace": "src/app/_modules/registries/registry/entries/entry/registry-entry.component.ts", "with": "src/tk023/component/registries/registry/entries/entry/registry-entry.component.ts" @@ -564,6 +568,10 @@ "replace": "src/app/_modules/pages/menu/slider-menu/slider-menu.component.ts", "with": "src/tk023/component/pages/menu/slider-menu/slider-menu.component.ts" }, + { + "replace": "src/app/_modules/pages/page/page.component.ts", + "with": "src/tk023/component/pages/page/page.component.ts" + }, { "replace": "src/app/_modules/registries/registry/entries/entry/registry-entry.component.ts", "with": "src/tk023/component/registries/registry/entries/entry/registry-entry.component.ts" diff --git a/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.scss b/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.scss index 8c8654c..73a21c2 100644 --- a/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.scss +++ b/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.scss @@ -1,47 +1,47 @@ -:host{ - display: block; -} -.breadcrumbs { - padding: 12px 0 0 0; - display: block; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - color:var(--prime); - li { - padding: 0; - display: inline; - list-style-type: none; - margin-right: 22px; - position: relative; - font-size: 20px; - font-style: normal; - font-weight: 400; - line-height: 16px; /* 160% */ +// :host{ +// display: block; +// } +// .breadcrumbs { +// padding: 12px 0 0 0; +// display: block; +// white-space: nowrap; +// overflow: hidden; +// text-overflow: ellipsis; +// color:var(--prime); +// li { +// padding: 0; +// display: inline; +// list-style-type: none; +// margin-right: 22px; +// position: relative; +// font-size: 20px; +// font-style: normal; +// font-weight: 400; +// line-height: 16px; /* 160% */ - color: var(--prime); +// color: var(--prime); - &::before { - display: inline; - content: ""; - position: absolute; - width: 20px; - height: 20px; - right: -22px; - top: 4px; - vertical-align: -5px; - background: url("~src/assets/images/icons/chevron_right_24dp.svg") no-repeat center; - } - &:first-child{ - display: none; - } - &:last-child { - &::before { - background: none; - } - } - a { - color: var(--grey-7); - } - } -} +// &::before { +// display: inline; +// content: ""; +// position: absolute; +// width: 20px; +// height: 20px; +// right: -22px; +// top: 4px; +// vertical-align: -5px; +// background: url("~src/assets/images/icons/chevron_right_24dp.svg") no-repeat center; +// } +// &:first-child{ +// display: none; +// } +// &:last-child { +// &::before { +// background: none; +// } +// } +// a { +// color: var(--grey-7); +// } +// } +// } diff --git a/src/tk023/component/pages/page/page.component.html b/src/tk023/component/pages/page/page.component.html new file mode 100644 index 0000000..03cfdb6 --- /dev/null +++ b/src/tk023/component/pages/page/page.component.html @@ -0,0 +1,17 @@ +
+
+ +
+
+ + + + + +

Page type {{page?.type?.name}} is undefined

+
+
+
+ +
+ diff --git a/src/tk023/component/pages/page/page.component.scss b/src/tk023/component/pages/page/page.component.scss new file mode 100644 index 0000000..33f8f35 --- /dev/null +++ b/src/tk023/component/pages/page/page.component.scss @@ -0,0 +1,9 @@ +@media screen and (min-width: 1330px){ + +} + + +@media screen and (max-width: 480px) { + + +} diff --git a/src/tk023/component/pages/page/page.component.ts b/src/tk023/component/pages/page/page.component.ts new file mode 100644 index 0000000..a42f1a1 --- /dev/null +++ b/src/tk023/component/pages/page/page.component.ts @@ -0,0 +1,90 @@ +import {Component} from '@angular/core'; +import {NavigationEnd, Router} from "@angular/router"; +import {Subscription} from "rxjs"; +import {PagesService} from "@app/_services/pages.service"; +import {ListsService} from "@app/_services"; +import {Title} from "@angular/platform-browser"; + +@Component({ + templateUrl: 'page.component.html', + styleUrls: ['page.component.scss'] +}) +export class PageComponent { + public page: any; + public loading = false; + private url: string; + private inited = false; + routeSubscription?: Subscription; + listSubscription: Subscription; + + constructor( + private router: Router, + private pagesService: PagesService, + private listsService: ListsService, + private titleService:Title){ + this.routeSubscription = this.router.events.subscribe(event => { + if (event instanceof NavigationEnd) this.onNavigationEnd(event); + }); + } + + + get editMode() { + return this.pagesService.editMode; + } + + get permissions() { + return this.page?.permissions; + } + + get isEditable() { + return this.permissions?.edit || this.permissions?.anything; + } + + + ngOnInit() { + this.listSubscription = this.listsService.controls().subscribe(res => { + this.inited ? this.fetch() : this.inited = true; + }); + } + + ngOnDestroy() { + this.routeSubscription?.unsubscribe(); + this.listSubscription?.unsubscribe() + } + + onNavigationEnd(event: NavigationEnd) { + let url = event.url.split('(')[0].split('?')[0]; + if (url !== this.url) { + this.url = url; + this.fetch(); + this.pagesService.editMode = false; + } + } + + fetch() { + this.loading = true; + let include = [ + 'parents.children', + 'parents.picture', + 'children', + 'sections.type', + 'sections.groups.fields.value', + 'sections.objects.groups.fields.value', + 'sidebars.groups.fields.value', + 'sidebars.type', + 'permissions', + 'picture', + 'posters' + ]; + this.pagesService.find(this.url, {include: include.join(',')}).subscribe(res => { + this.page = res?.data; + if (this.page) { + this.pagesService.currentPage = this.page; + // this.titleService.setTitle(this.page.title||this.page.h1||this.page.name) + } + this.loading = false; + }, error => { + this.loading = false; + }); + } +} diff --git a/src/tk023/css/_admin.scss b/src/tk023/css/_admin.scss index 642ebbe..a637388 100644 --- a/src/tk023/css/_admin.scss +++ b/src/tk023/css/_admin.scss @@ -4,7 +4,6 @@ font-style: normal; font-weight: 400; line-height: 24px; - padding: 32px; h2{ color: var(--second-act); margin-bottom: 48px; diff --git a/src/tk023/css/_basics.scss b/src/tk023/css/_basics.scss index 4fb305b..5021ae9 100644 --- a/src/tk023/css/_basics.scss +++ b/src/tk023/css/_basics.scss @@ -107,8 +107,8 @@ $pxxs:4px; --radius-1: 12px; --radius-2: 20px; --white: #ffffff; - --light: #B1B1B1 - ; + --light: #B1B1B1; + --prime-light: #E5F0F7; --prime: #0079C2; @@ -200,12 +200,11 @@ body { } p { - color: #000; - font-family: Golos; - font-size: 16px; - font-style: normal; - font-weight: 400; - line-height: 24px; +font-family: Roboto; +font-size: 15px; +font-weight: 300; +line-height: 22px; + } strong{ @@ -213,41 +212,34 @@ strong{ } h1{ - color: var(--white); - font-family: "PT Serif"; - font-size: 76px; - font-style: normal; - font-weight: 400; - line-height: 76px; /* 100% */ - letter-spacing: 0.76px; +font-family: Roboto; +font-size: 32px; +font-weight: 300; +line-height: 32px; +letter-spacing: 0em; } h2 { - color: var(--second-act); - font-family: "PT Serif"; - font-size: 50px; - font-style: normal; - font-weight: 400; - line-height: 60px; /* 120% */ - letter-spacing: 0.5px; - margin:0; + font-family: Roboto; + font-size: 24px; + font-weight: 300; + line-height: 30px; + letter-spacing: 0em; + text-align: left; + } h3 { - font-family: "PT Serif"; - font-size: 24px; - font-style: normal; - font-weight: 400; + font-family: Roboto; + font-size: 15px; + font-weight: 500; line-height: 30px; - margin-top: 16px; - margin-bottom: 0px; } h4 { - color: #6A6868; - font-family: "PT Serif"; - font-size: 20px; - font-style: normal; - font-weight: 400; - line-height: 25px; + font-family: Roboto; + font-size: 15 px; + font-weight: 500; + line-height: 22px; + color: var(--second); } a { @@ -367,13 +359,6 @@ span.link { } -file-ico{ - width: 52px; - height: 60px; - display: inline-flex; -} - - modal{ position: fixed; width: 100vw; diff --git a/src/tk023/css/_buttons.scss b/src/tk023/css/_buttons.scss index 792feab..482b882 100644 --- a/src/tk023/css/_buttons.scss +++ b/src/tk023/css/_buttons.scss @@ -61,3 +61,16 @@ button, .btn, a.btn { } } + +.cms-modal-footer, auth-form-login{ + button{ + font-family: Roboto!important; + font-size: 15px !important; + padding: 4px 11px !important; + } + input{ + font-family: Roboto!important; + font-size: 15px !important; + font-weight: 300 !important; + } +} diff --git a/src/tk023/css/_documents-lists.scss b/src/tk023/css/_documents-lists.scss index 31c6ed1..1e731bc 100644 --- a/src/tk023/css/_documents-lists.scss +++ b/src/tk023/css/_documents-lists.scss @@ -5,6 +5,16 @@ display: flex; gap: 8px; margin: 0 0 16px; + file-ico{ + display: inline-block; + width: 24px; + height: 24px; + img{ + object-fit: contain; + width: 100%; + height: 100%; + } + } .value{ display: flex; flex-direction: column; @@ -12,7 +22,6 @@ display: inline-block; } .description{ - font-size: 16px; line-height: 24px; color: var(--second); } @@ -20,6 +29,7 @@ &:last-child { margin: 0; } + } .none { color: #7f7f7f; diff --git a/src/tk023/css/_forms.scss b/src/tk023/css/_forms.scss index 16ceefa..1fea96c 100644 --- a/src/tk023/css/_forms.scss +++ b/src/tk023/css/_forms.scss @@ -4,8 +4,6 @@ input, select, textarea { padding: 8px 16px; border-radius: 4px; border: solid 1px var(--second-dis); - font-family: "PT Sans"; - font-size: 20px; color: var(--second-act); background-color: #fff; &:hover{ diff --git a/src/tk023/css/_main-menu.scss b/src/tk023/css/_main-menu.scss index 9e83c0f..f257627 100644 --- a/src/tk023/css/_main-menu.scss +++ b/src/tk023/css/_main-menu.scss @@ -146,7 +146,7 @@ left-content{ font-weight: 500; } } - pages-menu.current>pages-menu-item>.item{ + pages-menu.current>pages-menu-item>.item, pages-menu.parent>pages-menu-item>.item{ display: flex; } diff --git a/src/tk023/css/_pages-section.scss b/src/tk023/css/_pages-section.scss index 4f92092..f5a639c 100644 --- a/src/tk023/css/_pages-section.scss +++ b/src/tk023/css/_pages-section.scss @@ -1,20 +1,82 @@ + +page-breadcrumbs{ + display: block; + + .breadcrumbs{ + display: flex; + flex-wrap: wrap; + gap:2px; + padding: 0; + list-style-type: none; + li{ + &:first-child{ + display: inline-flex; + width: 24px; + overflow: hidden; + height: 24px; + ::before{ + content: ''; + display: inline-block; + width: 24px; + height: 24px; + background: url("/assets/images/ico/home_prime_24.svg") no-repeat center; + vertical-align: -5px; + } + } + ::before{ + content: ''; + display: inline-block; + width: 24px; + height: 24px; + background: url("/assets/images/ico/chevron_right_second_24.svg") no-repeat center; + vertical-align: -7px; + } + &:last-child{ + display: block; + width: 100%; + font-size: 32px; + font-weight: 300; + line-height: 32px; + margin-top: 20px; + + } + &:nth-last-child(2)::after{ + content: ''; + display: inline-block; + width: 24px; + height: 24px; + background: url("/assets/images/ico/chevron_right_second_24.svg") no-repeat center; + vertical-align: -7px; + } + + } + } +} + + + + + page-sections{ display: flex; flex-direction: column; + gap: 15px; .section{ display: flex; flex-direction: column; + } h2{ - margin-bottom: 8px; + margin-block: 10px 0; } - h4 { - margin-bottom: -16px; + h4, h3 { + margin-top: -5px; + margin-bottom: -20px; } - p+p{ - padding-top: 16px; + p{ + margin-block: 0; } page-section:first-child{ .menu .block .up{ @@ -30,6 +92,7 @@ page-sections{ } html-section { + display: block; text-align: justify; ul{ @@ -93,9 +156,7 @@ add-section, publications-list{ }; } } - background: var(--light); - border: 1px solid var(--second-dis); - border-radius: 4px; + background: var(--prime-light); padding: 8px 24px; display: flex; margin-bottom: 24px; @@ -206,6 +267,8 @@ cards-section-items{ } } } + + } } } @@ -226,12 +289,11 @@ cards-section-items{ .cards-section-default{ display: flex; - flex-wrap: wrap; - justify-content: center; - gap: 40px; + flex-direction: row; + gap: 15px !important; cards-section-item{ - flex-basis: 340px; - flex-shrink: 1; + flex-grow: 1; + flex-basis: 100%; } .alternative{ display: flex; @@ -259,60 +321,29 @@ cards-section-items{ .default{ display: flex; flex-direction: column; - cursor: pointer; - margin-bottom: -8px; + width: 100%; .card-image{ - width: 100%; - max-height: 212px; - height: calc(( 100vw - 32px ) * 0.62); - border: 1px solid var(--bk22); - border-radius: 8px; - object-fit: cover; - } - .card-subheader{ - font-size: 18px; - font-style: normal; - font-weight: 400; - line-height: 27px; - color: var(--bk66); - order: 1; - margin-top: 16px; - } - .card-header{ - font-size: 32px; - font-style: normal; - font-weight: 400; - line-height: 125%; - color: var(--bk44); - order: 2; - margin-top: 8px; - } - .card-text{ display: none; } - &::after{ - order: 3; - content: ''; - width: 120px; - height: 24px; - background-image: url(/assets/images/ico/arrow_forward_24.svg); + .card-subheader{ + font-size: 15px; + font-style: normal; + font-weight: 500; + line-height: 22px; + order: 0; } - &:hover{ - .card-image{ - border-color: var(--bk44); - } - .card-subheader{ - color: var(--bk88); - } - .card-header{ - color: var(--bk66); - } - &::after{ - background-image: url(/assets/images/ico/arrow_forward_24_hover.svg); - } - + .card-header{ + font-size: 15px; + font-style: normal; + font-weight: 500; + line-height: 22px; + color: var(--second); + order: 0; + } + .card-text{ } + } } @@ -418,7 +449,6 @@ cards-section-items{ images-section{ display: block; - margin-block: 32px; .mobile{ display: none; @@ -446,12 +476,16 @@ images-section{ } &.tiles{ + display: flex; + flex-wrap: wrap; + gap: 2px; .item{ - margin-bottom: 16px; + height: 106px; + width: 160px; img{ - border: 1px solid var(--second-dis); - max-height: 273px; - max-width: 273px; + height: 100%; + width: 100%; + display: cover; } } } @@ -579,82 +613,53 @@ publications-list{ .add a, .publication-read-more{ display: inline-flex; align-items: flex-end; - gap: 8px; } publications-list-item { display: block; background-color: #FFF; - padding-top: 32px; - &:last-child{ + + &:first-child{ .publication-content{ - border-bottom-color: transparent; + border-top: solid 1px var(--second-dis); } } .publication-content{ + padding-top: 15px; width: 100%; display: flex; flex-direction: column; position: relative; - min-height: 232px; - border-bottom: solid 1px #E5E5E5; + border-bottom: solid 1px var(--second-dis); gellery{ - display: block; - order: 0; - position: absolute; - left: 0; - top: 0; - width: 200px; - height: 200px; - overflow: hidden; - .poster{ - width: 200px; - height: 200px; - img{ - border: none; - width: 100%; - height: 100%; - object-fit: cover; - border-radius: 0; - } - } - .gellery-fullscreen{ - display: none; - } + display: none; } .date{ - margin-left: 232px; display: block; - order: 1; - color: #6A6868; - font-family: Golos; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 21px; - margin-bottom: 16px; + order: 0; + color: var(--second); + margin-bottom: 5px; } .name h3{ - margin: 0 0 8px 232px; + margin: 0 0 8px 0; display: block; order: 1; - color: #000; - font-family: "PT Serif"; - font-size: 24px; - font-style: normal; - font-weight: 400; - line-height: 30px; + color: var(--prime); + font-family: Roboto; + font-size: 18px; + font-weight: 300; + line-height: 22px; + cursor: pointer; } .excerpt{ - margin-left: 232px; display: block; - order: 1; - margin-bottom: 32px; + order: 2; + margin-bottom: 15px; } .publication-read-more{ display: none; @@ -675,15 +680,17 @@ publication-page { .name{ - margin-bottom: 24px; + display: none; } .content{ margin-top: $p; display: flex; flex-direction: column; - gap: $p; text-align: justify; + p{ + margin-block: 7.5px; + } }; .publication-page-back { @@ -866,42 +873,34 @@ page-section feedback-section{ } - .pagination { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; - gap: 12px; + gap: 2px; button { - &:not(.next, .count){ - display: flex; - padding: 1px 0px 2px 0px; - flex-direction: column; - justify-content: center; - align-items: center; - width: 24px; - height: 24px; - border-radius: 12px; - border: 1px solid var(--prime); + background: #FFF; + border: none; color: var(--prime); text-align: center; - font-family: Golos; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 21px; + border-radius: 0; + padding: 3px 6px; + border-radius: 0; + font-family: Roboto; + font-size: 15px; + font-weight: 300; + text-transform: none; &.active { - color: #FFF; - border-color: var(--prime); - background-color: var(--prime); + color: #000; + background-color: var(--prime-light); } - } + &.next { - display: none; + } } .dots { @@ -911,10 +910,11 @@ page-section feedback-section{ } .count { display: flex; - justify-content: right; + justify-content: left; flex-grow: 1; color: var(--black); - font-size: 16px; + + order: -1; } } diff --git a/src/tk023/css/_registry.scss b/src/tk023/css/_registry.scss index 2602368..066a1c0 100644 --- a/src/tk023/css/_registry.scss +++ b/src/tk023/css/_registry.scss @@ -25,36 +25,52 @@ registry-page{ padding: 12px 24px; margin-bottom: 24px; .name{ - color: var(--white); - font-family: PT Sans; - font-size: 16px; - font-style: normal; - font-weight: 700; - line-height: 24px; /* 150% */ + + font-weight: 500; + font-size: 15px; + } .menu{ display: flex; gap: $p; svg{ cursor: pointer; - color: var(--white); + color: #000; } } drop-down{ margin-left: 24px; + height: 24px; + .toggle{ + ico{ + transform: rotate(-90deg); + svg{ + color: transparent; + background: url('/assets/images/ico/drop_down_24.svg') 50% 50% no-repeat; + opacity: 0.5; + } + } + + } } } registry-category { display: block; .bar{ - background-color: var(--second); - + background-color: var(--second-dis); + border-top: 1px solid var(--light); + border-bottom: 1px solid var(--light); .name{ - color: #fff; + color: #646464; + } + .menu{ + svg{ + color: #646464 ; + } } svg{ - color: #fff; + color: #646464 ; } } @@ -157,6 +173,7 @@ registry-entry { } .toggle { margin-left: auto; + button { display: block; width: 20px; @@ -200,7 +217,6 @@ registry-entry { pagination{ display: block; - padding: 0 24px; &:first-child { margin-bottom: 12px; } diff --git a/src/tk023/css/_slider.scss b/src/tk023/css/_slider.scss index 7ef212a..1a86560 100644 --- a/src/tk023/css/_slider.scss +++ b/src/tk023/css/_slider.scss @@ -30,11 +30,7 @@ h2 { - font-family: PT Sans; - font-size: 20px; - font-style: normal; - font-weight: 700; - line-height: 28px; + } ico{ @@ -109,11 +105,6 @@ } .body { - font-family: PT Sans; - font-size: 16px; - font-style: normal; - font-weight: 400; - line-height: 24px; form-frame, object-filters{ @@ -143,11 +134,6 @@ border-radius: 4px; padding: 8px 12px; - font-family: PT Sans; - font-size: 16px; - font-style: normal; - font-weight: 400; - line-height: 24px; } input{ height: 40px; @@ -170,15 +156,7 @@ box-shadow: 0px -2px 8px 0px rgba(0, 0, 0, 0.12); button{ - font-family: PT Sans; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 24px; /* 171.429% */ - letter-spacing: 0.56px; - text-transform: uppercase; - border-radius: 4px; - padding: 8px 20px; + } .left { @@ -188,11 +166,6 @@ } .notice { - font-family: PT Sans; - font-size: 16px; - font-style: normal; - font-weight: 400; - line-height: 24px; } } diff --git a/src/tk023/images/ico/PDF_60.svg b/src/tk023/images/ico/PDF_60.svg index 05d0f14..e842fa5 100644 --- a/src/tk023/images/ico/PDF_60.svg +++ b/src/tk023/images/ico/PDF_60.svg @@ -1,14 +1,7 @@ - - - - - - - - - - - - - + + + + + + diff --git a/src/tk023/images/ico/chevron_right_second_24.svg b/src/tk023/images/ico/chevron_right_second_24.svg new file mode 100644 index 0000000..46a5762 --- /dev/null +++ b/src/tk023/images/ico/chevron_right_second_24.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/tk023/images/ico/drop_down_24.svg b/src/tk023/images/ico/drop_down_24.svg index c031fe9..2dddc1e 100644 --- a/src/tk023/images/ico/drop_down_24.svg +++ b/src/tk023/images/ico/drop_down_24.svg @@ -1,5 +1,3 @@ - - - - + + diff --git a/src/tk023/images/ico/home_prime_24.svg b/src/tk023/images/ico/home_prime_24.svg new file mode 100644 index 0000000..c37bda3 --- /dev/null +++ b/src/tk023/images/ico/home_prime_24.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file