Академический Документы
Профессиональный Документы
Культура Документы
v.cdk-global-overlay-wrapper {
text-align: -webkit-right !important;
}
________________
html toas
<ng-template #dangerTpl>
<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" width="24" height="24"
viewBox="0 0 24 24"><path d="M10.872 6.831l1.695 3.904 3.654-1.561-1.79 3.426
3.333.954-3.417 1.338 2.231 4.196-4.773-2.582-2.869 2.287.413-3.004-3.792-.726
2.93-1.74-1.885-2.512 3.427.646.843-4.626zm-.786-6.831l-1.665 9.119-6.512-1.228
3.639 4.851-5.548 3.294 7.108 1.361-.834 6.076 5.742-4.577 9.438 5.104-4.288-8.064
6.834-2.677-6.661-1.907 3.25-6.22-6.98 2.982-3.523-8.114z"/></svg> Danger Danger
!
</ng-template>
<button class="btn btn-danger" (click)="showDanger(dangerTpl)" ngbTooltip="Will
disappear in 15s">Danger toast</button>
.info,
.correcto,
.ojo,
.error,
.validation {
border: 1px solid;
margin: 0px 10px;
padding: 10px;
background-repeat: no-repeat;
background-position: 10px center;
font-family: Arial, Helvetica, sans-serif;
/* font-size: 13px; */
/* text-align: left; */
width: 300px;
margin-bottom: 15px;
}
.info {
color: #00529B;
background-color: #BDE5F8;
display: flex;
max-height: 70px;
/* background-image: url('imagenes/info.jpg'); */
}
.correcto {
color: #4F8A10;
background-color: #DFF2BF;
display: flex;
max-height: 70px;
/* background-image:url('imagenes/correcto.JPG'); */
}
.ojo {
color: #9F6000;
background-color: #FEEFB3;
display: flex;
max-height: 70px;
/* background-image: url('imagenes/ojo.JPG'); */
}
.error {
color: #D8000C;
background-color: #FFBABA;
display: flex;
max-height: 70px;
/* background-image: url('imagenes/error.jpg'); */
}
.closeAlert {
position: relative;
right: 20px;
top: 5px;
cursor: pointer;
}
____________________________
<div *ngIf="this.iconType=='success'" class="alert alert-success" style="width:
300px;">
<div class="col-md-12" style="text-align: initial;line-height: 10px">
<span (click)="close()" class="closeAlert">×</span>
<p> <i class="fas fa-check-circle"></i> ejemplo de titulo </p>
<b>{{ iconType }} {{ data.text }}</b>
</div>
</div>
<div *ngIf="this.iconType=='info'" class="alert alert-info" style="width: 300px;">
<div class="col-md-12" style="text-align: initial;line-height: 10px">
<span (click)="close()" class="closeAlert">×</span>
<p> <i class="fas fa-question-circle"></i> ejemplo de titulo </p>
<b>{{ iconType }} {{ data.text }}</b>
</div>
</div>
<div *ngIf="this.iconType=='warning'" class="alert alert-warning" style="width:
300px;">
<div class="col-md-12" style="text-align: initial;line-height: 10px">
<span (click)="close()" class="closeAlert">×</span>
<p> <i class="fas fa-exclamation-circle"></i> ejemplo de titulo </p>
<b>{{ iconType }} {{ data.text }}</b>
</div>
</div>
<div *ngIf="this.iconType=='danger'" class="alert alert-danger" style="width:
300px;">
<div class="col-md-12" style="text-align: initial;line-height: 10px">
<span (click)="close()" class="closeAlert">×</span>
<p> <i class="fas fa-exclamation-triangle"></i> ejemplo de titulo </p>
<b>{{ iconType }} {{ data.text }}</b>
</div>
</div>
toas