page section css
parent
03495e7b39
commit
1b74e60b76
|
|
@ -1,3 +1 @@
|
|||
.add {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +0,0 @@
|
|||
iframe {
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
iframe {
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,5 +3,4 @@ iframe {
|
|||
max-width: 720px;
|
||||
min-height: 400px;
|
||||
height: 100%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -46,6 +46,9 @@ $pxxs:4px;
|
|||
.menu {
|
||||
display: flex;
|
||||
.block {
|
||||
a{
|
||||
height: 24px;
|
||||
}
|
||||
background: #fff;
|
||||
border: 1px solid var(--second-dis);
|
||||
border-radius: $pxs;
|
||||
|
|
|
|||
|
|
@ -42,11 +42,6 @@ export class JumbotronComponent {
|
|||
this.subscription.unsubscribe();
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
get name(){
|
||||
let name:string
|
||||
if(this.currentPage){
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
|
|
@ -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%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue