master
Boris Voropaev 2023-12-06 16:36:32 +03:00
parent 8a84557f54
commit 24a869fd29
11 changed files with 177 additions and 149 deletions

View File

@ -1,4 +1,4 @@
<div class="user" (click)="ddHidden=!ddHidden"(mouseover)="ddHidden=false" (mouseleave)="ddHidden=true" *ngIf="user">
<div class="user" (click)="ddHidden=!ddHidden" (mouseleave)="ddHidden=true" *ngIf="user">
<div class="avatar">
<img *ngIf="avatar" [src]="avatar.links?.thumb" />
<span *ngIf="!avatar" class="initials">{{user.initials}}</span>

View File

@ -1,65 +0,0 @@
.user {
position: relative;
display: flex;
padding: 11px;
height: 64px;
justify-content: center;
background-color: #fff;
border-radius: 32px;
border: 1px solid var(--second-dis);
.avatar {
width: 38px;
height: 38px;
color: var(--prime);
border: 1px solid var(--prime);
background: #fff;
border-radius: 100%;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
overflow: hidden;
.initials {
}
img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
}
.name{
margin: 8px 4px 0 12px;
color: var(--second-act);
white-space: nowrap;
}
drop-down {
margin-top: 6px;
}
}
@media screen and (max-width: 1330px) {
.user {
.avatar {
background-color: var(--white);
margin-right: 18px;
}
.name{
display: none;
}
}
}

View File

@ -1,4 +1,7 @@
<div class="add" *ngIf="editMode">
<button type="button" class="outline" (click)="add()">Добавить карточку</button>
</div>
<div class="cards-add" *ngIf="editMode">
<span>Группа изображений</span>
<ico ico="add_circle_24" (click)="add()"></ico>
</div>
<cards-section-items [section]="section" [type]="type" [editMode]="editMode"></cards-section-items>

View File

@ -33,7 +33,7 @@ export class CardsItemPersonsComponent {
}
get textOnly(){
return this.html.replace(/<[^>]*>?/gm, '').replace(/\s/g, "").replace(/\&nbsp;/gm,'');
return this.html?.replace(/<[^>]*>?/gm, '').replace(/\s/g, "").replace(/\&nbsp;/gm,'');
}
ngOnInit() {

View File

@ -1,3 +1,3 @@
<div class="toggle" (click)="click()">
<div class="toggle" (click)="click()" [ngClass]="{on:visible,off:!visible}" >
<ico [ico]="ico" [rotate]="visible?angle[1]:angle[0]"></ico>
</div>

View File

@ -7,4 +7,5 @@
position: relative;
align-items: flex-start;
display: inline-flex;
}
}

View File

@ -8,7 +8,7 @@
<pages-menu class="lvl-0"></pages-menu>
<div class="inline center">
<div class="inline center header-right">
<locale></locale>
<a class="btn vnii" href="" target="_blank">АИС СЦ ВНИИГАЗ</a>
</div>

View File

@ -43,22 +43,7 @@ $pxxs:4px;
.menu {
display: flex;
.block {
a{
height: 24px;
}
background: #fff;
border: 1px solid var(--second-dis);
border-radius: $pxs;
padding: $pxs $ps;
display: flex;
margin-bottom: $ps;
margin-top: $ps;
column-gap: $ps;
}
}
.size-little {
* {
@ -260,7 +245,7 @@ h4 {
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 44px; /* 133.333% */
line-height: 32px; /* 133.333% */
letter-spacing: 0.24px;
margin:0;
}
@ -321,21 +306,7 @@ span.link {
.op-63{
opacity: 0.63;
}
html-section ul{
padding: 0;
>li{
list-style: none;
&::before{
display: inline-block;
content: "";
width: 16px;
height: 2px;
background-color: var(--prime);
margin-bottom: 5px;
margin-right: 16px;
}
}
}
header{
.locale{

View File

@ -56,18 +56,32 @@ header{
}
.item.nav + pages-menu.selected.lvl-1{
position: absolute;
left:0px;
top:100px;
display: flex;
background-color: var(--white);
width: 100%;
justify-content: center;
padding-bottom: 36px;
z-index: 1;
position: absolute;
left:0px;
top:100px;
display: flex;
background-color: var(--white);
width: 100%;
justify-content: center;
padding-bottom: 36px;
z-index: 1;
}
}
}
.header-right{
gap: $p;
.locales-btn{
drop-down {
.on{
svg{
color:var(--dark)
}
}
}
cursor: pointer;
display: inline-flex;
align-items: center;
gap: $pxxs;
}
}
};
@ -84,21 +98,14 @@ a.logo{
@media screen and (max-width: 1330px){
.header{
pages-menu, >a.vnii{
display: none !important;
}
}
}
@media screen and (min-width: 1330px){
.header{
.burger{

View File

@ -1,2 +1,72 @@
header-user-bar{
.user {
position: relative;
display: flex;
padding: 11px;
height: 64px;
justify-content: center;
background-color: #fff;
border-radius: 32px;
border: 1px solid var(--second-dis);
.avatar {
width: 38px;
height: 38px;
color: var(--prime);
border: 1px solid var(--prime);
background: #fff;
border-radius: 100%;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
overflow: hidden;
.initials {
}
img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
}
.name{
margin: 8px 4px 0 12px;
color: var(--second-act);
white-space: nowrap;
}
.dropdown{
right: 16px;
top: 48px;
}
drop-down {
display: flex;
margin-top: 10px;
.on{
svg{
color:var(--dark)
}
}
}
}
@media screen and (max-width: 1330px) {
.user {
.avatar {
background-color: var(--white);
margin-right: 18px;
}
.name{
display: none;
}
}
}
}

View File

@ -17,18 +17,42 @@ page-sections{
}
}
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;
}
&+li{
margin-top: 24px;
}
}
}
add-section{
.add{
position: relative;
margin: 24px 0;
ico{
margin-right: $pxs;
}
.toggle{
position:inherit;
display: flex;
gap:8px;
align-items: center;
padding-bottom: 8px;
drop-down{
margin-top: 4px;
margin-top: $pxxs;
margin-left: $pxxs;
}
&.active{
@ -42,6 +66,45 @@ add-section{
top:32px;
}
}
}
.menu {
display: flex;
.block {
a{
height: 24px;
}
background: #fff;
border: 1px solid var(--second-dis);
border-radius: $pxs;
padding: $pxs $ps;
display: flex;
margin-bottom: $p;
column-gap: $ps;
}
}
cards-section{
.cards-add{
display: flex;
align-items: center;
justify-content: space-between;
padding: 12px 16px;
border-top: 1px solid var(--second-dis);
border-bottom: 1px solid var(--second-dis);
ico{
cursor: pointer;
svg{
color: var(--prime) !important;
}
&:hover{
svg{
color: var(--prime-act) !important;
}
}
}
}
}
@ -195,28 +258,6 @@ images-section{
}
}
.carousel {
width: 100%;
display: flex;
align-items: center;
justify-content:center;
gap: 24px;
.prev, .next {
cursor: pointer;
z-index: 1;
&.prev{
left:0;
}
&.next{
right:0;
}
}
.center {
display: block;
width: 100%;
aspect-ratio: 16 / 9;
}
}
.swiper-box{
width: 100%;