Skip to content

Instantly share code, notes, and snippets.

@chrishieu
Last active November 5, 2018 10:24
Show Gist options
  • Save chrishieu/85003b2dbfe6dee4aec008755ee6a1cf to your computer and use it in GitHub Desktop.
Save chrishieu/85003b2dbfe6dee4aec008755ee6a1cf to your computer and use it in GitHub Desktop.
<html>
<head>
<title>Quà tặng từ Savy</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="shortcut icon" type="image/png" href="https://savy.tpb.vn/money_saving/images/popup/20181104/1541297408704.png"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style type="text/css">
@font-face {
font-family: TP;
src: url("http://178.128.17.225/sv/TPB_Neo_Sans.ttf");
}
@font-face {
font-family: "TPBo";
src: url("http://178.128.17.225/sv/TPB_Neo_Sans_Bold.ttf");
}
.container {
margin-top: 50px;
}
.code {
padding: 10px 40px;
border: solid 1px #fff;
border-radius: 5px;
font-family: "TPBo";
font-size: 18px;
font-style: normal;
font-stretch: normal;
line-height: 0.89;
letter-spacing: normal;
}
ul.peanut-list {
padding: 0;
padding-left: 25px;
list-style-image: url('http://178.128.17.225/sv/fill-1.svg');
}
ul.peanut-list li {
font-family: Tahoma;
font-size: 12px;
color: #4a4a4a;
margin-top: 20px;
}
p.thankyou {
margin-top: 50px;
font-family: Tahoma;
font-size: 12px;
color: #4a4a4a;
}
h4 {
color: #6b50d3;
font-family: Tahoma;
font-weight: bold;
font-size: 14px;
}
.time {
color: #ff9800;
font-family: Tahoma;
font-size: 12px;
}
.money {
color: #ff9800;
font-family: Tahoma;
font-weight: bold;
font-size: 12px;
}
.partnership {
color: #007ff0;
font-family: "TPBo";
font-size: 12px;
}
.value {
color: #6b50d3;
font-family: "TPBo";
font-size: 12px;
}
.img {
border: solid 1px #f1f1f1;
}
</style>
</head>
<body>
<div class="container">
<h4 class="text-uppercase">Quà tặng từ Savy</h4>
<p class="time">#DATE#</p>
<img src="https://savy.tpb.vn/money_saving/images/popup/20181103/1541255874265.png" class="img-responsive img" alt="Savy xin chào bạn" />
<span class="code text-center">#CODE#</span>
<p class="thankyou">Cảm ơn bạn đã lựa chọn Savy cho hành trình tiết kiệm của mình! Savy gửi tặng bạn voucher mua sắm <span class="partnership">TIKI</span> trị giá <span class="money">50.000 VNĐ</span>.</p>
<ul class="peanut-list">
<li> Hạn sử dụng: 10/01/2019</li>
<li> Voucher chỉ có giá trị sử dụng 01 lần</li>
<li> Áp dụng cho các đơn hàng giá trị từ <span class="value">100.000 VNĐ trở lên</span> trên website và app <span class="partnership">TIKI</span></li>
</ul>
</div>
<script type="text/javascript">
$(document).ready(function(){
sw = $('.container').outerWidth();
scw = $('span.code').outerWidth();
cml = (sw - scw - 15)/2 + 'px';
$('span.code').css( {
"margin-left" : cml,
"color": "#007ff0",
"background-color": "#fff",
"box-shadow": "5px 0 50px #ddf"
} );
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment