AnisB
/
XJC
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

nouvelle subcard1 pour admin

Browse Source
thierry
Viiciouss 7 years ago
parent d3f085f3da
commit 9965ed70a6
6 changed files with 242 additions and 126 deletions
Show Stats Download Patch File Download Diff File

44
src/app/components/admin/demande-op-commercial/demande-op-commercial.component.html
Unescape Escape View File

@ -7,22 +7,18 @@
<div class="list-group wow fadeInLeftBig">
<div class="card mainCard" *ngFor="let op of opCommDataEnCours | async">
<div class="row no-margin" id="testt">
<div class="col-md-6 mb-1 subCard1" id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="view">
<div class="mask pattern-6">
<div class="row firstRow">
<div class="col-md-6 flex-center card-block cardPart1"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="col-md-6 flex-center card-block card-image mb-1 cardPart2 image2" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
<div class="col-md-6 d-flex flex-column " id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="img-fluid mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="subCard1-row d-flex flex-row">
<div class="merchant-name d-flex flex-center"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="merchant-logo" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
</div>
</div>
<div class="row no-margin secondRow">
<div class="col-md-6 flex-center cardPart3"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="col-md-6 flex-center cardPart4"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
</div>
<div class="subCard1-row d-flex flex-row">
<div class="operation-data flex-center"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="operation-id flex-center"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
<div class="col-md-6 card subCard2">
<div class="card-block row no-margin">
@ -76,22 +72,18 @@
<div class="card mainCard" *ngFor="let op of opCommDataRejeter | async">
<div class="row no-margin" id="testt">
<div class="col-md-6 mb-1 subCard1" id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="view">
<div class="mark pattern-3">
<div class="row firstRow">
<div class="col-md-6 flex-center card-block cardPart1"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="col-md-6 flex-center card-block card-image mb-1 cardPart2 image2" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
<div class="col-md-6 d-flex flex-column " id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="img-fluid mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="subCard1-row d-flex flex-row">
<div class="merchant-name d-flex flex-center"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="merchant-logo" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
</div>
</div>
<div class="row no-margin secondRow">
<div class="col-md-6 flex-center cardPart3"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="col-md-6 flex-center cardPart4"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
</div>
<div class="subCard1-row d-flex flex-row">
<div class="operation-data flex-center"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="operation-id flex-center"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
<div class="col-md-6 card subCard2">
<div class="card-block row no-margin">

60
src/app/components/admin/demande-op-commercial/demande-op-commercial.component.scss
Unescape Escape View File

@ -28,35 +28,46 @@
font-size: 1.05rem;
}
.firstRow {
height: 50%;
.subCard1-row {
height: 100%;
z-index: 3;
}
.secondRow {
height: 50%;
.subCard1-row div {
width: 100%;
}
.cardPart1 {
//background-color: red;
.merchant-name p {
font-size: 3rem;
}
.cardPart2 {
//background-color: orange;
.merchant-logo {
background-repeat: no-repeat;
background-size:50% auto;
background-size:50%;
background-position : center;
}
.cardPart3 {
//background-color: green;
#image1 {
z-index: 1;
padding: 0;
}
.cardPart4 {
//background-color: yellow;
#subCard1::before {
content: ' ';
display: block;
width: 100%;
height: 100%;
position: absolute;
background-color: fade_out(black, 0.5);
left: 0;
top: 0;
z-index: 2;
}
#subCard2Part1 {
padding-top: 5%;
display: flex;
@ -136,3 +147,22 @@
}
}
@media screen and (max-width: 786px) {
.subCard1-row {
height: 35vw;
.merchant-name p {
font-size: 2rem;
}
.operation-data p {
font-size: 1rem;
}
.operation-id p {
font-size: 0.8rem;
font-weight: bold;
}
}
}

20
src/app/components/admin/list-carte-envoyer/list-carte-envoyer.component.html
Unescape Escape View File

@ -6,22 +6,18 @@
<h4 class="font-up mb-5 mt-1 font-bold wow fadeInDown text-center" style="padding-top: 5%;">Aperçu de votre opération commerciale</h4>
<div class="card mainCard wow fadeInLeft">
<div class="row no-margin" id="testt">
<div class="col-md-6 mb-1 subCard1" id="subCard1">
<div class="col-md-6 d-flex flex-column " id="subCard1">
<img src="{{opComm?.carteTemplate.downloadURL}}" id="image1" class="img-fluid mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="view">
<div class="mask pattern-7">
<div class="row no-margin firstRow">
<div class="col-md-6 flex-center card-block cardPart1">{{opComm?.commercantOpCom.commercialName}}</div>
<div class="col-md-6 flex-center card-block card-image mb-1 cardPart2 image2" [ngStyle]="{ 'background-image': 'url(' + opComm?.commercantOpCom.image.downloadURL + ')'}">
<div class="subCard1-row d-flex flex-row">
<div class="merchant-name d-flex flex-center"><p class="white-text info-text font-bold">{{opComm?.commercantOpCom.commercialName}}</p></div>
<div class="merchant-logo" [ngStyle]="{ 'background-image': 'url(' + opComm?.commercantOpCom.image.downloadURL + ')'}">
</div>
</div>
<div class="row no-margin secondRow">
<div class="col-md-6 flex-center cardPart3"><p>{{opComm?.name}}</p></div>
<div class="col-md-6 flex-center cardPart4"><p>{{opComm?.uid}}</p></div>
</div>
</div>
</div>
<div class="subCard1-row d-flex flex-row">
<div class="operation-data flex-center"><p class="white-text info-text font-bold">{{opComm?.name}}</p></div>
<div class="operation-id flex-center"><p class="white-text info-text font-bold">{{opComm?.uid}}</p></div>
</div>
</div>
<div class="col-md-6 card subCard2">
<div class="card-block row no-margin">

121
src/app/components/admin/list-carte-envoyer/list-carte-envoyer.component.scss
Unescape Escape View File

@ -14,54 +14,52 @@
.subCard1 {
height: 15rem;
background-repeat: no-repeat;
background-size:20% auto;
background-position : center;
}
.subCard2 {
display: flex;
justify-content: center;
}
.subCard2issu {
padding-left: 5%;
display: flex;
justify-content: center;
}
.subCard2issu > label {
padding-bottom: 2%;
height: auto;
background-color: white;
padding-left: 0;
padding-right: 0;
font-size: 1.05rem;
}
.firstRow {
height: 50%;
.subCard1-row {
height: 100%;
z-index: 3;
}
.secondRow {
height: 50%;
.subCard1-row div {
width: 100%;
}
.cardPart1 {
//background-color: red;
.merchant-name p {
font-size: 3rem;
}
.cardPart2 {
//background-color: orange;
.merchant-logo {
background-repeat: no-repeat;
background-size:50% auto;
background-size:50%;
background-position : center;
}
.cardPart3 {
//background-color: green;
#image1 {
z-index: 1;
padding: 0;
}
.cardPart4 {
//background-color: yellow;
#subCard1::before {
content: ' ';
display: block;
width: 100%;
height: 100%;
position: absolute;
background-color: fade_out(black, 0.5);
left: 0;
top: 0;
z-index: 2;
}
#subCard2Part1 {
padding-top: 5%;
display: flex;
@ -131,3 +129,62 @@
}
}
}
@media screen and (max-width: 720px) {
.container {
padding-top: 20%;
}
.mainCard {
margin-bottom: 20%;
}
#nouvelleOp {
margin-bottom: 20%;
}
#subCard2Part2 {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.card-data > ul {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.card-data ul li {
margin-bottom: 2%;
}
}
#footerCard > ul {
padding-left: 0;
}
}
@media screen and (max-width: 982px) {
#subCard2Part1 {
padding-left: 0;
}
}
@media screen and (max-width: 786px) {
.subCard1-row {
height: 35vw;
.merchant-name p {
font-size: 2rem;
}
.operation-data p {
font-size: 1rem;
}
.operation-id p {
font-size: 0.8rem;
font-weight: bold;
}
}
}

44
src/app/components/admin/liste-op-commercial/liste-op-commercial.component.html
Unescape Escape View File

@ -24,22 +24,18 @@
<div class="card mainCard" *ngFor="let op of filteredOpCommercials">
<div class="row no-margin" id="testt">
<div class="col-md-6 mb-1 subCard1" id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="view">
<div class="mask pattern-6">
<div class="row no-margin firstRow">
<div class="col-md-6 flex-center card-block cardPart1"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="col-md-6 flex-center card-block card-image mb-1 cardPart2 image2" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
<div class="col-md-6 d-flex flex-column " id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="img-fluid mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="subCard1-row d-flex flex-row">
<div class="merchant-name d-flex flex-center"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="merchant-logo" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
</div>
</div>
<div class="row no-margin secondRow">
<div class="col-md-6 flex-center cardPart3"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="col-md-6 flex-center cardPart4"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
</div>
<div class="subCard1-row d-flex flex-row">
<div class="operation-data flex-center"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="operation-id flex-center"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
<div class="col-md-6 card subCard2">
<div class="card-block row no-margin">
@ -104,22 +100,18 @@
<div class="card mainCard" *ngFor="let op of opCommDataBloquer | async">
<div class="row no-margin" id="testt">
<div class="col-md-6 mb-1 subCard1" id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="view">
<div class="mask pattern-6">
<div class="row no-margin firstRow">
<div class="col-md-6 flex-center card-block cardPart1"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="col-md-6 flex-center card-block card-image mb-1 cardPart2 image2" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
<div class="col-md-6 d-flex flex-column " id="subCard1">
<img src="{{op.carteTemplate.downloadURL}}" id="image1" class="img-fluid mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
<div class="subCard1-row d-flex flex-row">
<div class="merchant-name d-flex flex-center"><p class="white-text info-text font-bold">{{commercant.commercialName}}</p></div>
<div class="merchant-logo" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
</div>
</div>
<div class="row no-margin secondRow">
<div class="col-md-6 flex-center cardPart3"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="col-md-6 flex-center cardPart4"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
</div>
<div class="subCard1-row d-flex flex-row">
<div class="operation-data flex-center"><p class="white-text info-text font-bold">{{op.name}}</p></div>
<div class="operation-id flex-center"><p class="white-text info-text font-bold">{{op.uid}}</p></div>
</div>
</div>
<div class="col-md-6 card subCard2">
<div class="card-block row no-margin">

79
src/app/components/admin/liste-op-commercial/liste-op-commercial.component.scss
Unescape Escape View File

@ -20,35 +20,43 @@
font-size: 1.05rem;
}
.firstRow {
height: 50%;
.subCard1-row {
height: 100%;
z-index: 3;
}
.secondRow {
height: 50%;
.subCard1-row div {
width: 100%;
}
.cardPart1 {
//background-color: red;
.merchant-name p {
font-size: 3rem;
}
.cardPart2 {
//background-color: orange;
.merchant-logo {
background-repeat: no-repeat;
background-size:50% auto;
background-size:50%;
background-position : center;
}
.cardPart3 {
//background-color: green;
#image1 {
z-index: 1;
padding: 0;
}
.cardPart4 {
//background-color: yellow;
#subCard1::before {
content: ' ';
display: block;
width: 100%;
height: 100%;
position: absolute;
background-color: fade_out(black, 0.5);
left: 0;
top: 0;
z-index: 2;
}
#subCard2Part1 {
padding-top: 5%;
display: flex;
@ -136,4 +144,45 @@
}
}
@media screen and (max-width: 720px) {
.container {
padding-top: 20%;
}
.mainCard {
margin-bottom: 20%;
}
#nouvelleOp {
margin-bottom: 20%;
}
#subCard2Part2 {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.card-data > ul {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.card-data ul li {
margin-bottom: 2%;
}
}
#footerCard > ul {
padding-left: 0;
}
}
@media screen and (max-width: 982px) {
#subCard2Part1 {
padding-left: 0;
}
}

Write Preview
Loading…
Cancel
Save