-
-
Save dnohales/51fc7a54b644367f095a21571c9708ee to your computer and use it in GitHub Desktop.
OCASA HTML sample
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta http-equiv="X-UA-Compatible" content="IE=9"> | |
| <title>OCASA Tracking</title> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <link rel="stylesheet" href="Content/3.3.7/bootstrap.min.css"> | |
| <script type="text/javascript"> | |
| var _gaq = _gaq || []; | |
| _gaq.push(['_setAccount', 'UA-3425625-3']); | |
| _gaq.push(['_trackPageview']); | |
| (function() { | |
| var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; | |
| ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; | |
| var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); | |
| })(); | |
| </script> | |
| <script src="Scripts/3.2.1/jquery.min.js"></script> | |
| <script src="Scripts/3.3.7/bootstrap.min.js"></script> | |
| <!--Start of Zendesk Chat Script--> | |
| <script type="text/javascript"> | |
| window.$zopim || (function (d, s) { | |
| var z = $zopim = function (c) { z._.push(c) }, $ = z.s = | |
| d.createElement(s), e = d.getElementsByTagName(s)[0]; z.set = function (o) { | |
| z.set. | |
| _.push(o) | |
| }; z._ = []; z.set._ = []; $.async = !0; $.setAttribute("charset", "utf-8"); | |
| $.src = "https://v2.zopim.com/?2QYsfSCACYsvpLpiiHRj87IvFDtFjK2U"; z.t = +new Date; $. | |
| type = "text/javascript"; e.parentNode.insertBefore($, e) | |
| })(document, "script"); | |
| </script> | |
| <script type="text/javascript"> | |
| $(document).ready(function () { | |
| $("#sidenavcontent").css('height', $("#bodycontent").height() + 20); | |
| }); | |
| $("#bodycontent").change('height', function () { | |
| $("#sidenavcontent").css('height', $("#bodycontent").height() + 20); | |
| }); | |
| //$("#idgridtracking").change('width', function () { | |
| // if ($("#idgridtracking").width() < 335) { | |
| // $("#idgridtracking").css('padding-left', '30px'); | |
| // } | |
| // else { | |
| // $("#idgridtracking").css('padding-left', '0px'); | |
| // } | |
| //}); | |
| </script> | |
| <!--End of Zendesk Chat Script--> | |
| <style> | |
| /* On small screens, set height to 'auto' for the grid */ | |
| @media screen and (max-width: 767px) { | |
| .row.content { | |
| height: auto; | |
| } | |
| } | |
| body { | |
| padding-top: 0px; | |
| padding-bottom: 0px; | |
| } | |
| .navbar { | |
| margin-bottom: 20px; | |
| } | |
| /* Set height of the grid so .sidenav can be 100% (adjust as needed) */ | |
| /*.row.content {height: 550px}*/ | |
| /*.row.content { | |
| height: 870px; | |
| }*/ | |
| /* Set gray background color and 100% height */ | |
| /*background-color: #0099A8;*/ | |
| .sidenav { | |
| background-color: rgba(65, 186, 197, 1); | |
| height: 100%; | |
| } | |
| /**/ | |
| /*.navbar | |
| { | |
| border-color:transparent; | |
| }*/ | |
| .navbar-inverse { | |
| background-color: #0099A8; | |
| border: 0; | |
| border-color: transparent; | |
| } | |
| /*color: #000;*/ | |
| /*.container-fluid{ | |
| background-color: #0099A8; | |
| color: #000; | |
| border-color:transparent; | |
| }*/ | |
| /*.myNavbar{ | |
| color: #0099A8; | |
| border-color:transparent; | |
| } | |
| .navbar-collapse{ | |
| border-color:transparent; | |
| }*/ | |
| .headlogo { | |
| padding-top: 46px; | |
| } | |
| /*padding-top: 35px; | |
| padding-left: 10px;*/ | |
| /*float:left;*/ | |
| .headtraking { | |
| /*padding-right: 0px;*/ | |
| /*padding-left: 0px;*/ | |
| } | |
| .divttraking { | |
| background-color: #EDEDED; | |
| float: right; | |
| } | |
| /*classdeliverytracking*/ | |
| .texttrakinglg { | |
| /*width: 150px;*/ | |
| background-color: #EDEDED; | |
| padding-left: 40px; | |
| color: #000; | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| font-weight: normal; | |
| font-size: 22px; | |
| line-height: 1.42857143; | |
| } | |
| .texttrakingmd { | |
| /*width: 150px;*/ | |
| background-color: #EDEDED; | |
| padding-left: 40px; | |
| color: #000; | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| font-weight: normal; | |
| font-size: 17px; | |
| line-height: 1.42857143; | |
| } | |
| .texttrakingsm { | |
| /*width: 150px;*/ | |
| background-color: #EDEDED; | |
| padding-left: 15px; | |
| color: #000; | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| font-weight: normal; | |
| font-size: 17px; | |
| line-height: 1.42857143; | |
| } | |
| .texttrakingxs { | |
| background-color: #EDEDED; | |
| padding-left: 10px; | |
| color: #000; | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| font-weight: normal; | |
| font-size: 17px; | |
| line-height: 1.42857143; | |
| } | |
| .image_logo { | |
| width: 98%; | |
| } | |
| /*width: 110%;*/ | |
| .image_logosm { | |
| width: 253px; | |
| height: 62px; | |
| } | |
| /*width: 253px; | |
| height: 62px;*/ | |
| /*width: 130%; | |
| height: 130%;*/ | |
| /*width: 300px; | |
| height: 74px;*/ | |
| .image_logoxs { | |
| width: 253px; | |
| height: 62px; | |
| } | |
| .image_gif { | |
| width: 50%; | |
| height: 50%; | |
| } | |
| /*width: 476px; | |
| height: 137px; | |
| float: left;*/ | |
| /*page-break-before: 100px;*/ | |
| .label-gris { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 14px; | |
| line-height: 1.42857143; | |
| color: #333; | |
| } | |
| .text-gris { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 14px; | |
| line-height: 1.42857143; | |
| color: #333; | |
| } | |
| .li-gris { | |
| background-color: #EDEDED; | |
| margin-top: 1em; | |
| padding-left: 3px; | |
| padding-right: 3px; | |
| } | |
| .li-text { | |
| margin-top: 0.2em; | |
| } | |
| .ul-magen { | |
| list-style-type: none; | |
| margin: 0; | |
| padding: 0; | |
| padding-left: 3px; | |
| } | |
| /*########################################LINETIME########################################*/ | |
| .divlinetime { | |
| float: left; | |
| } | |
| .textlinetime { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 10px; | |
| line-height: 1.32857143; | |
| color: rgba(128, 128, 128, 0.83); | |
| } | |
| .timelinetime { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 14px; | |
| line-height: 0.52857143; | |
| color: rgba(128, 128, 128, 0.83); | |
| } | |
| /*########################################LINETIME########################################*/ | |
| /*########################################GRID########################################*/ | |
| /*.row-titulo-container { | |
| background-color: #EDEDED; | |
| border-left-width: 3px; | |
| border-left-style: solid; | |
| color: #ffffff; | |
| } | |
| .row-titulo { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 13px; | |
| line-height: 1.42857143; | |
| color: #333; | |
| padding-top: 5px; | |
| padding-bottom: 5px; | |
| } | |
| .row-item-fecha-container { | |
| background-color: #EDEDED; | |
| border-left-width: 3px; | |
| border-left-style: solid; | |
| border-top-width: 3px; | |
| border-top-style: solid; | |
| color: #ffffff; | |
| } | |
| .row-item-fecha { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 14px; | |
| color: #333; | |
| padding-top: 2px; | |
| padding-bottom: 2px; | |
| } | |
| .row-item-estado-container { | |
| background-color: #EDEDED; | |
| border-left-width: 3px; | |
| border-left-style: solid; | |
| border-top-width: 3px; | |
| border-top-style: solid; | |
| color: #ffffff; | |
| } | |
| .row-item-estado { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 14px; | |
| color: #333; | |
| padding-top: 2px; | |
| padding-bottom: 2px; | |
| } | |
| .row-seleccionado-fecha-container { | |
| background-color: #0099A8; | |
| border-left-width: 3px; | |
| border-left-style: solid; | |
| border-top-width: 3px; | |
| border-top-style: solid; | |
| color: #ffffff; | |
| } | |
| .row-seleccionado-fecha { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 14px; | |
| color: #333; | |
| padding-top: 2px; | |
| padding-bottom: 2px; | |
| } | |
| .row-seleccionado-estado-container { | |
| background-color: #0099A8; | |
| border-left-width: 3px; | |
| border-left-style: solid; | |
| border-top-width: 3px; | |
| border-top-style: solid; | |
| color: #ffffff; | |
| } | |
| .row-seleccionado-estado { | |
| background-color: #0099A8; | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 14px; | |
| color: #333; | |
| padding-top: 2px; | |
| padding-bottom: 2px; | |
| }*/ | |
| .row-titulo { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 12px; | |
| color: #333; | |
| } | |
| .row-item { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 11px; | |
| color: #333; | |
| } | |
| .gridtracking { | |
| } | |
| .griddetalle { | |
| margin-left: -38px; | |
| } | |
| /*border-collapse:collapse;padding-left: -10px;border-left-width: -10px;border-left-style: solid;margin-left: -38px;*/ | |
| /*########################################GRID########################################*/ | |
| /*########################################EMAIL########################################*/ | |
| .agregarmail { | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 13px; | |
| color: #333; | |
| } | |
| /*########################################EMAIL########################################*/ | |
| /*########################################FOOTER########################################*/ | |
| /*.atencion { | |
| background-color: #F4951E; | |
| float: left; | |
| }*/ | |
| .textatencion { | |
| /*width: 150px;*/ | |
| border-top-right-radius: 5px; | |
| border-top-left-radius: 5px; | |
| background-color: #F4951E; | |
| padding-left: 40px; | |
| color: #ffffff; | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 14px; | |
| line-height: 1.42857143; | |
| } | |
| .textenvio { | |
| color: #000000; | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: normal; | |
| font-size: 15px; | |
| line-height: 1.42857143; | |
| } | |
| .textenvionumero { | |
| color: #000000; | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 15px; | |
| line-height: 1.42857143; | |
| } | |
| .ocasaonline { | |
| border-top-right-radius: 5px; | |
| border-top-left-radius: 5px; | |
| background-color: #0099A8; | |
| margin-top: -10px; | |
| height: 70px; | |
| width: 200px; | |
| } | |
| .textocasaoline { | |
| color: #ffffff; | |
| font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |
| font-weight: bold; | |
| font-size: 16px; | |
| line-height: 1.42857143; | |
| } | |
| .footer { | |
| /*position: absolute;*/ | |
| /*bottom: 0; | |
| width: 100%;*/ | |
| /* Set the fixed height of the footer here */ | |
| /*background-color: #222;*/ | |
| /*position: absolute; | |
| bottom: 30px;*/ | |
| } | |
| /*########################################FOOTER########################################*/ | |
| </style> | |
| <script> | |
| </script> | |
| </head> | |
| <body> | |
| <form method="post" action="./tracking.aspx?i=18&airbillnumber=123456789" id="ctl00"> | |
| <div class="aspNetHidden"> | |
| <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="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" /> | |
| </div> | |
| <div class="aspNetHidden"> | |
| <input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="414E4794" /> | |
| </div> | |
| <div class="container"> | |
| <nav class="navbar navbar-inverse visible-xs"> | |
| <div class="container-fluid"> | |
| <div class="navbar-header"> | |
| <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> | |
| <span class="icon-bar"></span> | |
| <span class="icon-bar"></span> | |
| <span class="icon-bar"></span> | |
| </button> | |
| <a class="navbar-brand" href="#"></a> | |
| </div> | |
| <div class="collapse navbar-collapse" id="myNavbar"> | |
| <ul class="nav navbar-nav ul-magen"> | |
| <li class="li-gris"> | |
| <b><label id="lbltitleseguimientoxs" name="lbltitleseguimientoxs">NÚMERO DE SEGUIMIENTO DE ENVÍO:</label></b> | |
| <label id="lblseguimientoxs" class="text-gris" name="lblseguimientoxs">123456789</label> | |
| </li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| <li class="li-gris"> | |
| <b><label id="lbltitleremitentexs" name="lbltitleremitentexs">REMITENTE:</label></b> | |
| <label id="lblremitentexs" class="text-gris" name="lblremitentexs">Sender</label> | |
| </li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| <li class="li-gris"> | |
| <b><label id="lbltitledestinatarioxs" name="lbltitledestinatarioxs">DESTINATARIO:</label></b> | |
| <label id="lbldestinatarioxs" class="text-gris" name="lbldestinatarioxs">John Doe</label> | |
| </li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| <li class="li-gris"> | |
| <b><label id="lbltitledomicilioxs" name="lbltitledomicilioxs">DOMICILIO:</label></b> | |
| <label id="lbldomicilioxs" class="text-gris" name="lbldomicilioxs">Destination address</label> | |
| </li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </nav> | |
| <div class="container-fluid"> | |
| <div class="row content"> | |
| <div id="bodycontent" class="col-sm-9" style="padding-left: 0px; padding-right: 0px;"> | |
| <div id="head"> | |
| <div class="row"> | |
| <div class="col-md-4 visible-lg hidden-md hidden-sm hidden-xs"> | |
| <div class="row"> | |
| <div class="col-sm-12 headlogo" style="padding-top: 27px;"> | |
| <br /> | |
| </div> | |
| </div> | |
| <div> | |
| <img src="Images/ocasa.png" class="image_logo" style="padding-left: 38px;" /> | |
| </div> | |
| <div class="row" style="margin-right: -45px; margin-top: 9px;"> | |
| <div class="col-sm-12"> | |
| <label id="lbldeliverytracking" class="texttrakinglg" style="padding-right: 10px;">DELIVERY TRACKING </label> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-4 hidden-lg visible-md hidden-sm hidden-xs"> | |
| <div class="row"> | |
| <div class="col-sm-12 headlogo" style="padding-top: 27px;"> | |
| <br /> | |
| </div> | |
| </div> | |
| <div> | |
| <img src="Images/ocasa.png" class="image_logo" style="padding-left: 35px;" /> | |
| </div> | |
| <div class="row" style="margin-right: -45px; margin-top: 9px;"> | |
| <div class="col-sm-12"> | |
| <label id="lbldeliverytrackingmd" class="texttrakingmd" style="padding-right: 10px;">DELIVERY TRACKING </label> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-4 hidden-lg hidden-md visible-sm hidden-xs"> | |
| <div> | |
| <img src="Images/ocasa.png" class="image_logosm" style="margin-top: 20px;margin-left: 15px;" /> | |
| </div> | |
| <div class="row" style="margin-right: -45px; margin-top: 2px;"> | |
| <div class="col-sm-12"> | |
| <label id="lbldeliverytrackingsm" class="texttrakingsm" style="padding-right: 10px;">DELIVERY TRACKING </label> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-4 hidden-lg hidden-md hidden-sm visible-xs"> | |
| <div> | |
| <img src="Images/ocasa.png" class="image_logoxs" style="margin-left: 10px;" /> | |
| </div> | |
| <div class="row" style="margin-right: -45px; margin-top: 2px;"> | |
| <div class="col-sm-12"> | |
| <label id="lbldeliverytrackingxs" class="texttrakingxs" style="padding-right: 10px;">DELIVERY TRACKING </label> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-8 hidden-sm hidden-xs"> | |
| <div col-md-4 col-sm-4 col-xs-4> | |
| <img src="Images/TRACK-AND-TRACE-GIF.gif" style="width: 95%; margin-left: 0px;" height="144"> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="body"> | |
| <br /> | |
| <div id="lineaTiempo5" class="tracking hidden-xs"> | |
| <div class="row"> | |
| <div class="col-sm-12"> | |
| <div> | |
| <div style="width: 7%; float: left"> | |
| | |
| </div> | |
| <div style="width: 19.2%; float: left"> | |
| <label id="fecha1" class="timelinetime" name="fecha1">10/01</label> | |
| </div> | |
| <div style="width: 20.4%; float: left"> | |
| <label id="fecha2" class="timelinetime" name="fecha2">10/01</label> | |
| </div> | |
| <div style="width: 20.4%; float: left;"> | |
| <label id="fecha3" class="timelinetime" name="fecha3">10/01</label> | |
| </div> | |
| <div style="width: 20.4%; float: left;"> | |
| <label id="fecha4" class="timelinetime" name="fecha4"></label> | |
| </div> | |
| <div style="width: 1.6%; float: left;"> | |
| <label id="fecha5" class="timelinetime" name="fecha5"></label> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-sm-1"> | |
| </div> | |
| <div class="col-sm-10"> | |
| <img id="ImagenTracking" name="ImagenTracking" src="images/TRACK5LG3.jpg" alt="Tracking" style="width:100%;" /> | |
| </div> | |
| <div class="col-sm-1"> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-sm-12"> | |
| <div> | |
| <div style="width: 4%; float: left"> | |
| | |
| </div> | |
| <div style="width: 22.0%;" class="divlinetime"> | |
| <label id="texto1" class="textlinetime">En proceso de Retiro</label> | |
| </div> | |
| <div style="width: 16.4%;" class="divlinetime"> | |
| <label id="texto2" class="textlinetime">Retirado</label> | |
| </div> | |
| <div style="width: 19.4%;" class="divlinetime"> | |
| <label id="texto3" class="textlinetime">En camino a destino</label> | |
| </div> | |
| <div style="width: 24.0%;" class="divlinetime"> | |
| <label id="texto4" class="textlinetime"></label> | |
| </div> | |
| <div style="width: 10%;" class="divlinetime"> | |
| <label id="texto5" class="textlinetime"></label> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="lineaTiempo5xs" class="tracking visible-xs"> | |
| <div class="row"> | |
| <div class="col-xs-1"> | |
| | |
| </div> | |
| <div class="col-xs-1"> | |
| <div class="row"> | |
| <div class="col-xs-6"> | |
| <label id="fecha1xs" style="text-align: left;" name="fecha1xs">10/01</label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-6"> | |
| <label id="fecha2xs" style="padding-top: 15px;" name="fecha2xs">10/01</label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-6"> | |
| <label id="fecha3xs" style="padding-top: 21.0px;" name="fecha3xs">10/01</label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-6"> | |
| <label id="fecha4xs" style="padding-top: 20.0px;" name="fecha4xs"></label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-6"> | |
| <label id="fecha5xs" style="padding-top: 22.2px;" name="fecha5xs"></label> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-xs-1"> | |
| | |
| </div> | |
| <div class="col-xs-1" style="padding-top: 4px;"> | |
| <img id="ImagenTrackingXS" name="ImagenTrackingXS" src="images/TRACK5XS3.jpg" style="height:191px;" /> | |
| </div> | |
| <div class="col-xs-7"> | |
| <div class="row"> | |
| <div class="col-xs-12"> | |
| <label id="texto1xs" name="texto1xs">En proceso de Retiro</label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-12" style="padding-top: 15px;"> | |
| <label id="texto2xs">Retirado</label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-12" style="padding-top: 21.0px;"> | |
| <label id="texto3xs">En camino a destino</label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-12" style="padding-top: 20.0px;"> | |
| <label id="texto4xs"></label> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-xs-12" style="padding-top: 22.2px;"> | |
| <label id="texto5xs"></label> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <br /> | |
| <div id="idgridtracking" class="gridtracking"> | |
| <div class="row"> | |
| <div class="col-xs-1 col-md-1"> | |
| </div> | |
| <div class="col-xs-11 col-md-11"> | |
| <div> | |
| <table class="table table-hover table-striped griddetalle" cellspacing="0" id="griddetalle" style="border-collapse:collapse;"> | |
| <tr> | |
| <th class="col-sm-3 col-xs-3 row-titulo" scope="col">FECHA</th><th class="col-sm-9 col-xs-9 hidden-xs row-titulo" scope="col">DETALLE TRACKING</th><th class="col-sm-9 col-xs-9 visible-xs row-titulo" scope="col">DETALLE TRACKING</th> | |
| </tr><tr class="cursor-pointer"> | |
| <td class="col-sm-3 col-xs-3 row-item">10/01/2018 22:10:25</td><td class="hidden-xs row-item">El envío fue recibido en nuestra planta, y está siendo preparado para enviarlo al domicilio de destino.</td><td class="visible-xs row-item">El envío fue recibido en nuestra planta, y está siendo preparado para enviarlo al domicilio.</td> | |
| </tr><tr class="cursor-pointer"> | |
| <td class="col-sm-3 col-xs-3 row-item">10/01/2018 22:10:25</td><td class="hidden-xs row-item">Pasamos a buscar el envío por el domicilio del remitente y lo estamos llevando a nuestra planta para iniciar el proceso de entrega.</td><td class="visible-xs row-item">Pasamos a buscar el envío por el domicilio del remitente.</td> | |
| </tr><tr class="cursor-pointer"> | |
| <td class="col-sm-3 col-xs-3 row-item">10/01/2018 22:10:25</td><td class="hidden-xs row-item">El envío ya está confirmado para que lo retiremos por el domicilio del remitente.</td><td class="visible-xs row-item">El envío ya está confirmado para que lo retiremos por el domicilio del remitente.</td> | |
| </tr> | |
| </table> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <br /> | |
| </div> | |
| <br /> | |
| <div id="divfooter" class="footer"> | |
| <div class="row"> | |
| <div class="col-sm-5"> | |
| <div class="row"> | |
| <div class="col-sm-12"> | |
| <label id="lbltencion" class="textatencion" style=""><label id="lbltitletencion" name="lbltitletencion">ATENCIÓN AL CLIENTE</label> </label> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-lg-11 col-sm-11 hidden-xs"> | |
| <div class=""> | |
| <label id="lblenviomercado" class="textenvio" style="padding-left: 40px;"><label id="lbltitleenviomercado" name="lbltitleenviomercado">ATENCIÓN AL CLIENTE</label><label id="lblenviomercadonumero0" class="textenvionumero" style="">0810-888-4343 | </label></label> | |
| <label id="lblenvioocasa" class="textenvio" style=""><label id="lbltitleenvioocasa" name="lbltitleenvioocasa">ENVÍOS MERCADO LIBRE:</label><label id="lblenvioocasanumero" class="textenvionumero" style="">0810-888-6227</label></label> | |
| </div> | |
| </div> | |
| <div class="col-lg-11 col-sm-11 visible-xs"> | |
| <div class=""> | |
| <label id="lblenviomercado2" class="textenvio" style=""><label id="lbltitleenviomercado2" name="lbltitleenviomercado2">ENVÍOS MERCADO LIBRE:</label><label id="lblenviomercadonumero" class="textenvionumero" style=""><a href="tel:08108884343">0810-888-4343</a> </label></label> | |
| <label id="lblenvioocasa2" class="textenvio" style=""><label id="lbltitleenvioocasa2" name="lbltitleenvioocasa2">ENVÍOS OCASA:</label><label id="lblenvioocasanumero" class="textenvionumero" style=""><a href="tel:08108886227">0810-888-6227</a></label></label> | |
| <br /> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="sidenavcontent" class="col-sm-3 sidenav hidden-xs"> | |
| <br /> | |
| <br /> | |
| <ul class="nav nav-pills nav-stacked"> | |
| <li class="li-gris"> | |
| <b><label id="lbltitleseguimiento" name="lbltitleseguimiento">NÚMERO DE SEGUIMIENTO DE ENVÍO:</label></b> | |
| <label id="lblseguimiento" class="text-gris" name="lblseguimiento">123456789</label></li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| <li class="li-gris"> | |
| <b><label id="lbltitleremitente" name="lbltitleremitente">REMITENTE:</label></b> | |
| <label id="lblremitente" class="text-gris" name="lblremitente">Sender</label> | |
| </li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| <li class="li-gris"> | |
| <b><label id="lbltitledestinatario" name="lbltitledestinatario">DESTINATARIO:</label></b> | |
| <label id="lbldestinatario" class="text-gris" name="lbldestinatario">John Doe</label> | |
| </li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| <li class="li-gris"> | |
| <b><label id="lbltitledomicilio" name="lbltitledomicilio">DOMICILIO:</label></b> | |
| <label id="lbldomicilio" class="text-gris" name="lbldomicilio">Destination address</label> | |
| </li> | |
| <li class="li-text"> | |
| | |
| </li> | |
| </ul> | |
| <br /> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </form> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment