263 lines
9.5 KiB
HTML
263 lines
9.5 KiB
HTML
<!DOCTYPE html>
|
|
<html xmlns:th="http://www.thymeleaf.org" th:lang="${#locale.language}" lang="en">
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
<meta name="viewport" content="width=device-width" />
|
|
<!-- Forcing initial-scale shouldn't be necessary -->
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<!-- Use the latest (edge) version of IE rendering engine -->
|
|
<meta name="x-apple-disable-message-reformatting" />
|
|
<!-- Disable auto-scale in iOS 10 Mail entirely -->
|
|
<title th:text="#{email.receipt.title}">JHipster activation</title>
|
|
<link rel="icon" th:href="@{|${baseUrl}/favicon.ico|}" />
|
|
<link href="https://fonts.googleapis.com/css?family=NotoSansSP:300,400,700" rel="stylesheet" />
|
|
<link rel="manifest" href="manifest.webapp" />
|
|
<link
|
|
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
|
|
rel="stylesheet"
|
|
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk"
|
|
crossorigin="anonymous"
|
|
/>
|
|
|
|
<style>
|
|
body {
|
|
margin-top: 20px;
|
|
color: #484b51;
|
|
}
|
|
|
|
.brc-default-l1 {
|
|
border-color: #dce9f0 !important;
|
|
}
|
|
|
|
.ml-n1,
|
|
.mx-n1 {
|
|
margin-left: -0.25rem !important;
|
|
}
|
|
.mr-n1,
|
|
.mx-n1 {
|
|
margin-right: -0.25rem !important;
|
|
}
|
|
.mb-4,
|
|
.my-4 {
|
|
margin-bottom: 1.5rem !important;
|
|
}
|
|
|
|
hr {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
border: 0;
|
|
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.text-grey-m2 {
|
|
color: #888a8d !important;
|
|
}
|
|
|
|
.font-bolder,
|
|
.text-600 {
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.text-110 {
|
|
font-size: 110% !important;
|
|
}
|
|
.text-blue {
|
|
color: #478fcc !important;
|
|
}
|
|
.pb-25,
|
|
.py-25 {
|
|
padding-bottom: 0.75rem !important;
|
|
}
|
|
|
|
.pt-25,
|
|
.py-25 {
|
|
padding-top: 0.75rem !important;
|
|
}
|
|
.bgc-default-tp1 {
|
|
background-color: rgba(121, 169, 197, 0.92) !important;
|
|
}
|
|
|
|
.page-header .page-tools {
|
|
-ms-flex-item-align: end;
|
|
align-self: flex-end;
|
|
}
|
|
|
|
.text-blue-m2 {
|
|
color: #68a3d5 !important;
|
|
}
|
|
.text-150 {
|
|
font-size: 150% !important;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body width="100%" style="margin: 0; padding: 0 !important; mso-line-height-rule: exactly; background-color: #f1f1f1">
|
|
<center style="width: 100%; background-color: #f1f1f1">
|
|
<div
|
|
style="
|
|
display: none;
|
|
font-size: 1px;
|
|
max-height: 0px;
|
|
max-width: 0px;
|
|
opacity: 0;
|
|
overflow: hidden;
|
|
mso-hide: all;
|
|
font-family: sans-serif;
|
|
"
|
|
>
|
|
‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌
|
|
</div>
|
|
<div style="max-width: 600px; margin: 0 auto" class="email-container">
|
|
<!-- BEGIN BODY -->
|
|
<table align="center" role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: auto">
|
|
<tr>
|
|
<td valign="top" class="bg_white" style="padding: 1em 2.5em 0 2.5em">
|
|
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">
|
|
<tr>
|
|
<td class="logo" style="text-align: center">
|
|
<h1>
|
|
<a href="#"
|
|
><img
|
|
src="https://res.cloudinary.com/marielascloud/image/upload/v1626333881/DataSurveyLogo2_smr2ok.png"
|
|
alt=""
|
|
width="300"
|
|
/></a>
|
|
</h1>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
<!-- end tr -->
|
|
|
|
<!-- end tr -->
|
|
|
|
<div class="page-content container">
|
|
<div class="container px-0">
|
|
<div class="row mt-4">
|
|
<div class="col-12 col-lg-10 offset-lg-1">
|
|
<!-- .row -->
|
|
|
|
<hr class="row brc-default-l1 mx-n1 mb-4" />
|
|
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<div>
|
|
<span class="text-sm text-grey-m2 align-middle">Usuario:</span>
|
|
<span
|
|
class="text-600 text-110 text-blue align-middle"
|
|
th:text="#{email.receipt.user(${factura.getNombreUsuario()})}"
|
|
></span>
|
|
</div>
|
|
</div>
|
|
<!-- /.col -->
|
|
|
|
<div class="text-95 col-sm-6 align-self-start d-sm-flex justify-content-end">
|
|
<hr class="d-sm-none" />
|
|
<div class="text-grey-m2">
|
|
<div class="my-2">
|
|
<i class="fa fa-circle text-blue-m2 text-xs mr-1"></i>
|
|
<span class="text-600 text-90" th:text="#{email.receipt.fecha(${factura.getFecha()}, 'dd-MM-yyyy HH:mm' )}"
|
|
>Fecha:</span
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.col -->
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
<div class="row text-600 text-white bgc-default-tp1 py-25">
|
|
<div class="col-9 col-sm-5">Plantilla</div>
|
|
<div class="d-none d-sm-block col-4 col-sm-2">Cantidad</div>
|
|
<div class="d-none d-sm-block col-sm-2">Precio</div>
|
|
</div>
|
|
|
|
<div class="text-95 text-secondary-d3">
|
|
<div class="row mb-2 mb-sm-0 py-25">
|
|
<div class="col-9 col-sm-5" th:text="#{email.receipt.plantilla(${factura.getNombrePlantilla()})}"></div>
|
|
<div class="d-none d-sm-block col-2">1</div>
|
|
<div class="d-none d-sm-block col-2 text-95" th:text="#{email.receipt.precio(${factura.getCosto()})}"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mt-3">
|
|
<div class="col-12 col-sm-5 text-grey text-90 order-first order-sm-last">
|
|
<div class="row my-2 align-items-center bgc-primary-l3 p-2">
|
|
<div class="col-7 text-right">Monto total</div>
|
|
<div class="col-5">
|
|
<span class="text-150 text-success-d3 opacity-2" th:text="#{email.receipt.precio(${factura.getCosto()})}"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- end tr -->
|
|
<!-- 1 Column Text + Button : END -->
|
|
</table>
|
|
<table align="center" role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: auto">
|
|
<tr>
|
|
<td valign="middle" class="bg_light footer email-section">
|
|
<table>
|
|
<tr>
|
|
<td valign="top" width="33.333%" style="padding-top: 20px">
|
|
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
|
|
<tr>
|
|
<td style="text-align: left; padding-right: 10px">
|
|
<h3 class="heading">Acerca de</h3>
|
|
<p>DataSurvey es su compañero más cercano para poder recolectar información valiosa para usted</p>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
<td valign="top" width="33.333%" style="padding-top: 20px">
|
|
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
|
|
<tr>
|
|
<td style="text-align: left; padding-left: 5px; padding-right: 5px">
|
|
<h3 class="heading">Información de contacto</h3>
|
|
<ul>
|
|
<li><span href="mailto:datasurveyapp@gmail.com" class="text">datasurveyapp@gmail.com</span></li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
<!-- end: tr -->
|
|
<tr>
|
|
<td class="bg_light" style="text-align: center">
|
|
<p><a href="https://datasurvey.org" style="color: rgba(0, 0, 0, 0.8)">DataSurvey.org</a></p>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</center>
|
|
|
|
<script
|
|
src="https://code.jquery.com/jquery-3.5.1.min.js"
|
|
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
|
|
crossorigin="anonymous"
|
|
></script>
|
|
|
|
<script
|
|
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.4.1/cjs/popper.min.js"
|
|
integrity="sha256-T3bYsIPyOLpEfeZOX4M7J59ZoDMzuYFUsPiSN3Xcc2M="
|
|
crossorigin="anonymous"
|
|
></script>
|
|
|
|
<script
|
|
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
|
|
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
|
|
crossorigin="anonymous"
|
|
></script>
|
|
</body>
|
|
</html>
|