diff --git a/src/app/_modules/auth/login/login.component.scss b/src/app/_modules/auth/login/login.component.scss index c3b0c6d..ccd1f46 100644 --- a/src/app/_modules/auth/login/login.component.scss +++ b/src/app/_modules/auth/login/login.component.scss @@ -130,7 +130,7 @@ } } -@media screen and (max-width: 960px) { +@media screen and (max-width: 1264px) { .authentication { flex-direction: column; justify-content: center; diff --git a/src/app/_modules/companies/company/company.component.scss b/src/app/_modules/companies/company/company.component.scss index 8e5f381..afbb1e1 100644 --- a/src/app/_modules/companies/company/company.component.scss +++ b/src/app/_modules/companies/company/company.component.scss @@ -137,7 +137,7 @@ } } -@media screen and (max-width: 960px) { +@media screen and (max-width: 1264px) { .main { .left { margin-right: 0; diff --git a/src/app/_modules/companies/members/member/company-member.component.scss b/src/app/_modules/companies/members/member/company-member.component.scss index ab0596d..2c04be5 100644 --- a/src/app/_modules/companies/members/member/company-member.component.scss +++ b/src/app/_modules/companies/members/member/company-member.component.scss @@ -47,7 +47,7 @@ } -@media screen and (max-width: 960px) { +@media screen and (max-width: 1264px) { .member { .left { .avatar { diff --git a/src/app/_modules/filter-fields/types/date/filter-field-date.component.scss b/src/app/_modules/filter-fields/types/date/filter-field-date.component.scss index 9551530..cd1d941 100644 --- a/src/app/_modules/filter-fields/types/date/filter-field-date.component.scss +++ b/src/app/_modules/filter-fields/types/date/filter-field-date.component.scss @@ -3,7 +3,7 @@ flex-direction: row; align-items: center; input { - padding-right: 50px; + // padding-right: 50px; //background: transparent url('~src/assets/images/icons/notification_date.svg') calc(100% - 20px) 50% no-repeat; background-size: 16px; } diff --git a/src/app/_modules/form-fields/types/date/single/field-date-single.component.scss b/src/app/_modules/form-fields/types/date/single/field-date-single.component.scss index 51c9313..8dfe220 100644 --- a/src/app/_modules/form-fields/types/date/single/field-date-single.component.scss +++ b/src/app/_modules/form-fields/types/date/single/field-date-single.component.scss @@ -1,6 +1,6 @@ input { max-width: 160px; - padding-right: 50px; + // padding-right: 50px; //background: transparent url('~src/assets/images/icons/notification_date.svg') calc(100% - 20px) 50% no-repeat; background-size: 16px; } diff --git a/src/app/_modules/layout/footer/footer.component.scss b/src/app/_modules/layout/footer/footer.component.scss index 1a9079d..f4ea69b 100644 --- a/src/app/_modules/layout/footer/footer.component.scss +++ b/src/app/_modules/layout/footer/footer.component.scss @@ -14,11 +14,17 @@ color: white; } } - display: flex; + display: flex; + flex-wrap: wrap; + grid-gap: 20px; + &>div{ + padding-bottom: 40px; + } div{ display: block; flex-grow: 1; - flex-basis: 25%; + flex-basis: 196px; + flex-shrink: 0; margin-bottom: -16px; div { margin-bottom: 16px; @@ -36,7 +42,7 @@ width: 100%; height: 1px; background-color: var(--blue-1); - margin: 40px 0; + margin-bottom: 40px; } .copyright{ @@ -47,3 +53,10 @@ font-weight: 400; } } + + +@media screen and (max-width: 1264px){ + .footer{ + padding: 40px 24px; + } +} diff --git a/src/app/_modules/layout/header/header.component.html b/src/app/_modules/layout/header/header.component.html index c172a83..a6b414e 100644 --- a/src/app/_modules/layout/header/header.component.html +++ b/src/app/_modules/layout/header/header.component.html @@ -1,4 +1,4 @@ -
+
-
- -
+ +
+ + + + -
+
+
diff --git a/src/app/_modules/layout/header/header.component.scss b/src/app/_modules/layout/header/header.component.scss index c48b60c..8c26831 100644 --- a/src/app/_modules/layout/header/header.component.scss +++ b/src/app/_modules/layout/header/header.component.scss @@ -1,66 +1,99 @@ -.header { - position: relative; - .top { - background-color: var(--white); - .limiter { - .logos { +@media screen and (max-width: 1264px){ +:host{ + display: flex; +} +.header{ + flex-grow: 1; + padding: 12px 24px; + background-color: #FFF; + min-height: 100%; + .bottom{ + display: flex; + align-items: stretch; + justify-content: space-between; + .main-menu-btn{ + button{ + width: 40px; + height: 40px; + background: url('~src/assets/images/icons/burger_blue_40dp.svg') no-repeat center;; } } - } - .top { - padding: 20px 0; - .limiter { - display: flex; - flex-direction: row; - align-items: center; - } - .logos { - display: flex; - flex-direction: row; - align-items: center; - gap: 40px; - .fcs { - width: 190px; - height: 64px; - background-repeat: no-repeat; - background-position: center; - } - .minstroy { - width: 155px; - height: 64px; - background-repeat: no-repeat; - background-position: center; - } - } - .menu { - display: flex; - flex-direction: row; - align-items: center; - gap: 24px; - .icon { - padding: 0; - min-width: 24px; - height: 24px; - background-position: center; - background-repeat: no-repeat; - background-color: transparent; - background-size: auto; - transition: transform 0.2s; - &:hover { - transform: scale(1.5); + .logo{ + width: 114px; + height: 80px; + background: url('~src/assets/images/logo_vniigaz_1163x816.svg') no-repeat center;; + background-size: contain; + header-user-bar{ + position: absolute; + top:144px; + right: 24px; + *{ + display: none; } } } + .fog{ + flex-grow: 1; + } + + .hidemobile{ + display: none; + } + + } + &.showmobile{ + position:fixed; + padding: 0; + width: 100dvw; + height: 100dvh; + background-color:rgba(45, 45, 45, 0.63); + z-index:100; + overflow-y: scroll; + .grid-menu{ + background: var(--blue-3); + color: white; + width: 480px; + min-height: 100dvh; + padding: 32px 40px; + button.close{ + width: 24px; + height: 24px; + padding: 0; + border: none; + border-radius: 0; + background: transparent url('~src/assets/images/icons/close_white_24dp.svg') no-repeat center; + } + .ais{ + display: block; + margin-top: 20px; + padding-top: 20px; + border-top: 1px solid rgba(255, 255, 255, 0.63); + } + } + } + + } + .right{ + display: none; + } + } -@media screen and (min-width: 961px){ + +@media screen and (min-width: 1264px){ .header{ + position: relative; .top{ + padding: 20px 0; + background-color: var(--white); .limiter{ + display: flex; + flex-direction: row; + align-items: center; .main-menu-btn{ display: none; width: 24px; @@ -68,6 +101,10 @@ } .menu{ margin-left: auto; + display: flex; + flex-direction: row; + align-items: center; + gap: 24px; } } } @@ -87,13 +124,18 @@ background-image: url('~src/assets/images/logo_vniigaz_1163x816.svg'); background-size: contain; flex-shrink: 0; - ; + header-user-bar{ + display: none; + } } .grid-menu{ display: flex; .close{ display: none; } + >a{ + display: none; + } } .main-menu { overflow: hidden; @@ -127,123 +169,3 @@ bottom: -96px; } } - - - - -@media screen and (max-width: 960px) { - - .header { - .top { - padding: 12px 0; - background-color: var(--grey-4); - .limiter { - display: flex; - justify-content: space-between; - padding: 0 24px; - .main-menu-btn{ - flex-grow: 1; - flex-basis: 40px; - button{ - width: 48px; - height: 48px; - margin: 0 0 0 -12px; - background: url('~src/assets/images/icons/burger_white_24dp.svg') no-repeat center; - } - } - - .logos { - .minstroy { - display: none; - } - } - .menu { - display: flex; - justify-content: flex-end; - align-items: center; - flex-grow: 1; - flex-basis: 40px; - .goggles, .dial-pad, .search, .login{ - display: none; - } - } - } - } - - .showmobile{ - display:flex; - } - .hidemobile{ - display: none; - } - - .bottom { - position:fixed; - align-items: flex-start; - top:0; - border: none; - width: 100vw; - z-index: 210; - overflow-y:scroll; - - .grid-menu{ - width: 100%; - min-height:100%; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: normal; - align-items: stretch; - align-content: normal; - background-color: rgba(62, 61, 64, 0.70); - } - - .limiter { - display: block; - flex-grow: 1; - flex-shrink: 0; - flex-basis: 360px; - align-self: auto; - order: 0; - margin:0; - background-color: #3E3D40; - padding-left: 24px; - padding-top: 16px; - animation: slide-from-left 0.3s; - .close{ - width: 24px; - height: 24px; - background: transparent; - padding: 0; - background: url('~src/assets/images/icons/close_white_24dp.svg') center no-repeat; - } - } - } - .front{ - z-index: 210; - } - .back{ - - display: block; - flex-grow: 1; - flex-shrink: 1; - flex-basis: auto; - align-self: stretch; - flex-basis: 100vw; - } - .ftr{ - color: #FFF; - font-family: Open Sans; - font-size: 16px; - font-style: normal; - font-weight: 700; - line-height: 24px; - - border-top: 1px solid rgba(255, 255, 255, 0.75); - div{ - margin: 16px 0; - cursor: pointer; - } - } - } -} \ No newline at end of file diff --git a/src/app/_modules/layout/header/user-bar/header-user-bar.component.scss b/src/app/_modules/layout/header/user-bar/header-user-bar.component.scss index 52edac7..4812d19 100644 --- a/src/app/_modules/layout/header/user-bar/header-user-bar.component.scss +++ b/src/app/_modules/layout/header/user-bar/header-user-bar.component.scss @@ -94,10 +94,17 @@ } } -@media screen and (max-width: 960px) { +@media screen and (max-width: 1264px) { .user { .avatar { background-color: var(--white); + margin-right: 18px; + } + .name{ + display: none; } } + } + + diff --git a/src/app/_modules/pages/home/intro/homepage-intro.component.scss b/src/app/_modules/pages/home/intro/homepage-intro.component.scss index 469d06e..f6af8e1 100644 --- a/src/app/_modules/pages/home/intro/homepage-intro.component.scss +++ b/src/app/_modules/pages/home/intro/homepage-intro.component.scss @@ -41,7 +41,7 @@ height: 500px; } } -@media screen and (max-width: 960px) { +@media screen and (max-width: 1264px) { .row { flex-direction: column; .tagline { diff --git a/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.html b/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.html index aa15a97..df812c8 100644 --- a/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.html +++ b/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.html @@ -1,4 +1,4 @@ - \ No newline at end of file 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 fe33362..bedb9d6 100644 --- a/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.scss +++ b/src/app/_modules/pages/page/breadcrumbs/page-breadcrumbs.component.scss @@ -1,9 +1,13 @@ +:host{ + display: block; +} .breadcrumbs { padding: 12px 0 0 0; - display: flex; - flex-wrap: wrap; - row-gap: 12px; - + display: block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + color:var(--blue-1); li { padding: 0; display: inline; @@ -14,19 +18,23 @@ font-style: normal; font-weight: 400; line-height: 16px; /* 160% */ - text-wrap: nowrap; + color: var(--blue-1); &::before { - display: block; + display: inline; content: ""; position: absolute; width: 20px; height: 20px; right: -22px; - top: 0; + top: 4px; + vertical-align: -5px; background: url("~src/assets/images/icons/chevron_right_24dp.svg") no-repeat center; } + &:first-child,&:nth-child(2){ + display: none; + } &:last-child { &::before { background: none; diff --git a/src/app/_modules/pages/page/page.component.scss b/src/app/_modules/pages/page/page.component.scss index 79ce12d..c9e5f00 100644 --- a/src/app/_modules/pages/page/page.component.scss +++ b/src/app/_modules/pages/page/page.component.scss @@ -64,6 +64,12 @@ padding: 16px 0; } + @media screen and (max-width: 1264px) { + .nav-info{ + display: none; + } + } + .holder { margin-bottom: 32px; } diff --git a/src/app/_modules/pages/page/types/tk-structure/tk-structure-page.component.scss b/src/app/_modules/pages/page/types/tk-structure/tk-structure-page.component.scss index 9d47b97..d19fcf0 100644 --- a/src/app/_modules/pages/page/types/tk-structure/tk-structure-page.component.scss +++ b/src/app/_modules/pages/page/types/tk-structure/tk-structure-page.component.scss @@ -117,7 +117,7 @@ } } } -@media screen and (max-width: 960px) { +@media screen and (max-width: 1264px) { .title { span { font-size: 1rem !important; diff --git a/src/app/_modules/pages/sections/page-sections.module.ts b/src/app/_modules/pages/sections/page-sections.module.ts index 44f5223..f079bf5 100644 --- a/src/app/_modules/pages/sections/page-sections.module.ts +++ b/src/app/_modules/pages/sections/page-sections.module.ts @@ -60,6 +60,7 @@ import {MemberSectionListComponent} from "@app/_modules/pages/sections/types/bas ], exports: [ PageSectionsComponent, + ImagesSectionComponent ] }) export class PageSectionsModule { diff --git a/src/app/_modules/pages/sections/types/basic/images/images-section.component.html b/src/app/_modules/pages/sections/types/basic/images/images-section.component.html index 070cee3..fc8bf37 100644 --- a/src/app/_modules/pages/sections/types/basic/images/images-section.component.html +++ b/src/app/_modules/pages/sections/types/basic/images/images-section.component.html @@ -1,40 +1,52 @@ -
- -
-
-
- -
-
+
-