310 lines
32 KiB
HTML
310 lines
32 KiB
HTML
<html lang="vn"><head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
|
<title>Vòng quay may mắn - Hái lộc đầu xuân</title>
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet" />
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css" />
|
|
|
|
<style>
|
|
:root{--color-primary:#f3cb00;--color-secondary:#2182ed;--red:#ff2140;--white:#fff;--black:#000;--bg-primary:linear-gradient(180deg,#f3cb00 4.69%,#fcff62 60.94%,#ffa115 100%)}.color-primary{color:var(--color-primary)}.color-secondary{color:var(--color-secondary)}.color-white{color:var(--white);font-style:normal}.color-black{color:var(--black)}.color-red{color:var(--red)}.bg-primary{background:var(--bg-primary)}.bg-primary-text{background:var(--bg-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-fill-color:transparent}*,::after,::before{padding:0;margin:0;-webkit-box-sizing:inherit;box-sizing:inherit}html{font-size:16px}body{background-color:#2182ed;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:Inter,sans-serif;color:#000;word-break:break-word;line-height:1.3;font-weight:400}.container{max-width:1220px;width:100%;padding:0 10px;margin:0 auto}a{text-decoration:none;font-size:inherit;line-height:inherit;color:inherit}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{font-family:inherit}input::-moz-placeholder,textarea::-moz-placeholder{font-family:inherit}input:-ms-input-placeholder,textarea:-ms-input-placeholder{font-family:inherit}input::-ms-input-placeholder,textarea::-ms-input-placeholder{font-family:inherit}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{font-family:inherit}input::-moz-placeholder,textarea::-moz-placeholder{font-family:inherit}input:-ms-input-placeholder,textarea:-ms-input-placeholder{font-family:inherit}input::-ms-input-placeholder,textarea::-ms-input-placeholder{font-family:inherit}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{font-family:inherit}input::-moz-placeholder,textarea::-moz-placeholder{font-family:inherit}input:-ms-input-placeholder,textarea:-ms-input-placeholder{font-family:inherit}input::-ms-input-placeholder,textarea::-ms-input-placeholder{font-family:inherit}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{font-family:inherit}input::-moz-placeholder,textarea::-moz-placeholder{font-family:inherit}input:-ms-input-placeholder,textarea:-ms-input-placeholder{font-family:inherit}input::-ms-input-placeholder,textarea::-ms-input-placeholder{font-family:inherit}input,input::placeholder,select,textarea,textarea::placeholder{font-family:inherit}.text-center{text-align:center}.text-uppercase{text-transform:uppercase}.text-line-through{text-decoration:line-through}.text-32{font-size:32px;line-height:36px}.text-28{font-size:28px;line-height:32px}.text-26{font-size:26px;line-height:30px}.text-24{font-size:24px;line-height:28px}.text-22{font-size:22px;line-height:26px}.text-20{font-size:20px;line-height:24px}.text-18{font-size:18px;line-height:22px}.text-16{font-size:16px;line-height:20px}.text-15{font-size:15px;line-height:19px}.text-14{font-size:14px;line-height:18px}.text-13{font-size:13px;line-height:17px}.text-12{font-size:12px;line-height:16px}.text-10{font-size:10px;line-height:14px}.font-weight-900{font-weight:900}.font-weight-800{font-weight:800}.font-weight-700{font-weight:700}.font-weight-600{font-weight:600}.font-weight-500{font-weight:500}.font-weight-400{font-weight:400}.font-weight-300{font-weight:300}.grid{display:-ms-grid;display:grid;gap:12px}.grid--2-cols{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}.grid--4-cols{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr)}.grid--2-rows{-ms-grid-rows:(1fr)[2];grid-template-rows:repeat(2,1fr)}.d-flex{display:-webkit-box;display:-ms-flexbox;display:flex}.align-items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.align-items-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.align-items-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.align-items-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.justify-content-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-content-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.flex-column{-ms-flex-direction:column;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.flex-row{-ms-flex-direction:row;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.flex-1{-webkit-box-flex:1;-ms-flex:1;flex:1}.flex-wrap{-ms-flex-wrap:wrap;flex-wrap:wrap}.m-0{margin:0!important}.mt-0,.my-0{margin-top:0!important}.mr-0,.mx-0{margin-right:0!important}.mb-0,.my-0{margin-bottom:0!important}.ml-0,.mx-0{margin-left:0!important}.m-1{margin:4px!important}.mt-1,.my-1{margin-top:4px!important}.mr-1,.mx-1{margin-right:4px!important}.mb-1,.my-1{margin-bottom:4px!important}.ml-1,.mx-1{margin-left:4px!important}.m-2{margin:8px!important}.mt-2,.my-2{margin-top:8px!important}.mr-2,.mx-2{margin-right:8px!important}.mb-2,.my-2{margin-bottom:8px!important}.ml-2,.mx-2{margin-left:8px!important}.m-3{margin:16px!important}.mt-3,.my-3{margin-top:16px!important}.mr-3,.mx-3{margin-right:16px!important}.mb-3,.my-3{margin-bottom:16px!important}.ml-3,.mx-3{margin-left:16px!important}.m-4{margin:24px!important}.mt-4,.my-4{margin-top:24px!important}.mr-4,.mx-4{margin-right:24px!important}.mb-4,.my-4{margin-bottom:24px!important}.ml-4,.mx-4{margin-left:24px!important}.m-5{margin:48px!important}.mt-5,.my-5{margin-top:48px!important}.mr-5,.mx-5{margin-right:48px!important}.mb-5,.my-5{margin-bottom:48px!important}.ml-5,.mx-5{margin-left:48px!important}.p-0{padding:0!important}.pt-0,.py-0{padding-top:0!important}.pr-0,.px-0{padding-right:0!important}.pb-0,.py-0{padding-bottom:0!important}.pl-0,.px-0{padding-left:0!important}.p-1{padding:4px!important}.pt-1,.py-1{padding-top:4px!important}.pr-1,.px-1{padding-right:4px!important}.pb-1,.py-1{padding-bottom:4px!important}.pl-1,.px-1{padding-left:4px!important}.p-2{padding:8px!important}.pt-2,.py-2{padding-top:8px!important}.pr-2,.px-2{padding-right:8px!important}.pb-2,.py-2{padding-bottom:8px!important}.pl-2,.px-2{padding-left:8px!important}.p-3{padding:16px!important}.pt-3,.py-3{padding-top:16px!important}.pr-3,.px-3{padding-right:16px!important}.pb-3,.py-3{padding-bottom:16px!important}.pl-3,.px-3{padding-left:16px!important}.p-4{padding:24px!important}.pt-4,.py-4{padding-top:24px!important}.pr-4,.px-4{padding-right:24px!important}.pb-4,.py-4{padding-bottom:24px!important}.pl-4,.px-4{padding-left:24px!important}.p-5{padding:48px!important}.pt-5,.py-5{padding-top:48px!important}.pr-5,.px-5{padding-right:48px!important}.pb-5,.py-5{padding-bottom:48px!important}.pl-5,.px-5{padding-left:48px!important}.w-100{width:100%!important}.h-100{height:100%!important}.w-auto{width:auto!important}.h-auto{height:auto!important}.d-block{display:block!important}.d-none{display:none!important}.m-auto{margin:0 auto}.min-width-0{min-width:0}.overflow-hidden{overflow:hidden}.p-relative{position:relative!important}.ws-pre-line{white-space:pre-line}.gap-0{gap:0}.gap-2{gap:2px}.gap-4{gap:4px}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.gap-24{gap:24px}.gap-32{gap:32px}.blink{-webkit-animation:blink 1s steps(1,end) infinite;animation:blink 1s steps(1,end) infinite}@-webkit-keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}@keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}.header{position:relative}.header #navbar{padding:10px 0;background:#fff;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.3);box-shadow:0 1px 5px rgba(0,0,0,.3)}.header #navbar .wrapper{max-width:800px;margin:0 auto}.header #navbar .logo-ap{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex}.header #navbar .logo-ap img{max-width:150px}.header #navbar .list{display:-webkit-box;display:-ms-flexbox;display:flex;gap:50px}.header #navbar a{font-weight:800;color:#3d5466;font-size:17px}.header #navbar a:hover{color:#ff2140}.main-content-sub .time{margin:50px 0 20px}.main-content-sub .time-countdown .clock{font-size:36px;line-height:40px;font-weight:900;border-radius:8px;background:var(--bg-primary);width:66px;height:66px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:#000}.main-content .col-left .game-wheel{position:relative}.main-content .col-left .wheel-bg{max-width:540px;margin:0 auto}.main-content .col-left .wheel-roll{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);max-width:470px;width:100%}.main-content .col-left .wheel-center{max-width:57px;position:absolute;top:45%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.play-container{background:#fff;padding:15px;border-radius:15px}.play-game-btn{background:url(https://aman.gleecdn.com/file/1/qg/QGvPhUv3KdqQJdj.png) no-repeat;background-size:contain;width:263px;height:59px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.player-recents{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around;gap:16px;padding:10px;border:2px dashed var(--color-primary);border-radius:10px;font-size:14px;line-height:18px;font-weight:500;color:#fff;max-width:450px;margin:0 auto}.game-features #js-recent-winners{max-height:500px;overflow:auto}.game-features .game-prize-recent table{border-collapse:collapse;border-radius:10px;overflow:hidden}.game-features .game-prize-recent table tr{height:40px;border-radius:5px}.game-features .game-prize-recent table thead, .game-features .game-prize-recent table tr:nth-child(even){background-color:#f5f5f5}.game-features .game-prize-recent table th{text-align:start;padding-left:10px;min-width:40px}.game-features .game-prize-recent table td:first-child,.game-prize .game-prize-recent table th:first-child{padding:0 8px}.p-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.p-item .p-picture{position:relative;max-width:280px;-webkit-box-flex:1;-ms-flex:1;flex:1}.p-item .p-content{-webkit-box-flex:1;-ms-flex:1;flex:1}.p-item .p-img{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);max-width:110px;max-height:110px}.p-item .p-title{font-size:14px;line-height:18px;font-weight:900;color:#fff;text-transform:uppercase}.p-item .p-quantity{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;margin:4px 0;flex-wrap:wrap}.p-item .p-quantity .p-total{font-size:48px;line-height:52px;font-weight:900;color:#fff;text-shadow:-2px -1px 0 var(--color-primary),2px -1px 0 var(--color-primary),-2px 2px 0 var(--color-primary),2px 2px 0 var(--color-primary);white-space:nowrap;letter-spacing:1px}.p-item .p-quantity .p-remaint{font-size:14px;line-height:18px;font-weight:900;text-transform:uppercase;color:#00094e;background-color:var(--color-primary);-webkit-clip-path:polygon(10% 1%,100% 0,100% 100%,0% 100%);clip-path:polygon(10% 1%,100% 0,100% 100%,0% 100%);max-width:90px;padding:0 4px 0 8px;height:34px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:4px}.p-item .p-price{font-size:14px;line-height:18px;font-weight:600;color:var(--color-primary)}.p-item:first-child{-ms-grid-column-span:2;grid-column:span 2}.p-item:first-child .p-content{-webkit-box-flex:unset;-ms-flex:unset;flex:unset}.p-item:first-child .p-title{font-size:20px;line-height:24px}.p-item:first-child .p-img{max-width:160px;top:45%;left:45%}.p-item:first-child .p-img-bg-nomarl{display:none!important}.p-item:first-child .p-img-bg-special{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important}.box{padding:16px;background-color:#fff;border-radius:20px}.modal-global{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.7);overflow:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.modal-global .game-box{position:relative;padding:20px 10px;border-radius:20px;border:4px solid #fff;background-color:#fff}.modal-global .game-box .btn-close{position:absolute;top:-27px;right:-27px;width:54px;height:54px;background:#000;-webkit-box-shadow:0 1px 8px rgba(0,0,0,.25);box-shadow:0 1px 8px rgba(0,0,0,.25);border-radius:50%;border:4px solid #fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer}.modal-global .play-game{max-width:491px}.modal-global .play-game .form-input{display:block;width:100%;background:#fff;border:1px solid #dadada;border-radius:8px;height:42px;padding:0 18px;outline-color:var(--color-primary)}.modal-global .play-game .form-input:not(:last-child){margin-bottom:12px}.modal-global .play-game .form-btn-submit{padding:10px 30px;border-radius:8px;max-width:232px;margin:16px auto}#play-game-outside .form-title{display:none}#play-game-outside #js-user-info{display:none}#play-game-outside .play-container{width:100%}@media screen and (max-width:1024px){.grid--4-cols{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}.main-content .col-left .wheel-roll{width:88%}.p-item:first-child{-ms-grid-column-span:3;grid-column:span 3}.p-item .p-quantity .p-total{font-size:40px;line-height:44px}.p-item .p-price{font-size:12px;line-height:16px}.p-item .p-img{max-width:90px}}@media screen and (max-width:768px){.grid--4-cols{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}.header #navbar .wrapper{max-width:600px}.header .logo{top:24px;width:90px;height:36px}.game-features,.main-content{-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr)}.main-content{padding-bottom:16px!important}.main-content .col-right{-webkit-box-ordinal-group:0}.modal-global{padding:30px}.modal-global h2.text-28{font-size:20px;line-height:24px}.modal-global .game-box{padding:20px 10px}.p-item:first-child{-ms-grid-column-span:2;grid-column:span 2}.p-item:first-child .p-picture{-webkit-box-flex:unset;-ms-flex:unset;flex:unset}.p-item .p-img{max-width:110px}.game-features .game-prize-recent{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}.main-content .col-left{display:-ms-grid;display:grid}.main-content-sub .time{margin-top:10px;-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}}@media screen and (max-width:500px){.d-flex-mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.reward{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.game-features{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.box{padding:12px}.game-features .game-prize-recent table th{padding-left:4px}.header #navbar .logo-ap .logo-img{width:90px}.header .logo{top:10px;width:58px;height:26px}.header #navbar .list{gap:10px}.grid{gap:16px}.main-content-sub .time-date{font-size:20px;line-height:24px}.grid--2-cols{-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr)}.grid--4-cols{-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr);gap:0}.main-content .col-left .wheel-center{max-width:36px}.play-game-btn{width:230px;height:50px;font-size:20px}.p-item:first-child{grid-column:auto}.p-item .p-picture{max-width:unset}.p-item:first-child .p-picture{max-width:200px}.p-item:first-child .p-img{max-width:110px}.modal-global .game-box{padding:0}}@media screen and (max-width:375px){.header #navbar a{font-size:14px}.play-container .form-title{font-size:18px;line-height:22px}.p-item:first-child .p-picture{max-width:140px}.p-item:first-child .p-img{max-width:90px}.main-content-sub .time-countdown{gap:8px}}.example{display:-ms-grid;display:grid;-webkit-transition:all .5s;-o-transition:all .5s;transition:all .5s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background:-webkit-gradient(linear,left top,left bottom,from(white),to(black));background:-o-linear-gradient(top,#fff,#000);background:linear-gradient(to bottom,#fff,#000)}.game-policy p{margin: 0;}
|
|
</style>
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="main-game">
|
|
<!-- HEADER -->
|
|
<div class="header">
|
|
<!-- NAVBAR -->
|
|
<div id="navbar" class="d-flex align-items-center">
|
|
<div class="container">
|
|
<div class="wrapper d-flex align-items-center justify-content-between">
|
|
<!-- LOGO AP -->
|
|
<a target="_blank" href="javascript:;" class="js-hura-drag logo-ap js-hura-edit" data-hura-type="file" id="logo-game">
|
|
<img src="https://aman.gleecdn.com/file/1/tl/TL1MzbLUhPQoaGI.png" alt="logo-anphat" class="logo-img">
|
|
</a>
|
|
|
|
<!-- LIST -->
|
|
<div class="list js-hura-edit js-hura-drag" data-hura-type="text">
|
|
<a target="_blank" href="https://demxanh.com/" class="item">Trang chủ</a>
|
|
<a target="_blank" href="https://demxanh.com/chinh-sach-bao-hanh.html" class="item"><span>Bảo hành</span></a>
|
|
<a target="_blank" href="https://demxanh.com/lien-he.html" class="item">Liên hệ</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- BANNER HEADER - THAY ẢNH BANNER TRÊN ĐẦU Ở ĐÂY: src="link-ảnh" -->
|
|
<div class="banner js-hura-edit js-hura-drag" data-hura-type="file">
|
|
<img src="https://aman.gleecdn.com/file/1/fo/fOE3m0gpFuzy7LU.jpg" alt="banner" class="d-flex w-100">
|
|
</div>
|
|
|
|
|
|
<div class="container d-flex-mobile js-hura-drag">
|
|
<!-- REWARD -->
|
|
<div class="reward mt-4">
|
|
<!-- LIST -->
|
|
<div class="list grid grid--4-cols" id="js-reward-product-list">
|
|
<!-- ITEM -->
|
|
<div class="p-item" data-id="U01BQ1">
|
|
<div class="p-picture"><img src="https://aman.gleecdn.com/file/1/dv/Dv312BoPbwJbwb9.png" alt="reward-product-bg" class="p-img-bg p-img-bg-special d-flex w-100 d-none">
|
|
<img src="https://aman.gleecdn.com/file/1/lx/lXvXqtRHg8Rrk6x.png" alt="reward-product-bg" class="p-img-bg p-img-bg-nomarl d-flex w-100">
|
|
<img src="https://aman.gleecdn.com/file/1/ie/IEKmSq4QrtuXYN9.png" alt="Đệm bông ép Nanomax" class="p-img d-flex">
|
|
</div>
|
|
<div class="p-content">
|
|
<div class="p-title">Giải đặc biệt</div>
|
|
<div class="p-quantity">
|
|
<p class="p-total">10</p>
|
|
<p class="p-remaint">Còn <span class="js-remaining-U01BQ1">0</span></p>
|
|
</div>
|
|
<p class="p-price">Trị giá: <span class="p-price-value">2.189.000</span> VNĐ</p>
|
|
</div>
|
|
</div>
|
|
<!-- ITEM -->
|
|
<div class="p-item" data-id="6rUSQZ">
|
|
<div class="p-picture">
|
|
<img src="https://aman.gleecdn.com/file/1/lx/lXvXqtRHg8Rrk6x.png" alt="reward-product-bg" class="p-img-bg p-img-bg-nomarl d-flex w-100">
|
|
<img src="https://aman.gleecdn.com/file/1/xj/XjYtqUFJpyBhJ4v.png" alt="Gối cao su Kim Cương" class="p-img d-flex">
|
|
</div>
|
|
<div class="p-content">
|
|
<div class="p-title">Giải nhất</div>
|
|
<div class="p-quantity">
|
|
<p class="p-total">10</p>
|
|
<p class="p-remaint">Còn <span class="js-remaining-6rUSQZ">6</span></p>
|
|
</div>
|
|
<p class="p-price">Trị giá: <span class="p-price-value">590.000</span> VNĐ</p>
|
|
</div>
|
|
</div>
|
|
<!-- ITEM -->
|
|
<div class="p-item" data-id="GAXkB1">
|
|
<div class="p-picture">
|
|
<img src="https://aman.gleecdn.com/file/1/lx/lXvXqtRHg8Rrk6x.png" alt="reward-product-bg" class="p-img-bg p-img-bg-nomarl d-flex w-100">
|
|
<img src="https://aman.gleecdn.com/file/1/qb/QbuNJiCpqXFBduU.png" alt="Chăn lông cừu" class="p-img d-flex">
|
|
</div>
|
|
<div class="p-content">
|
|
<div class="p-title">Giải nhì</div>
|
|
<div class="p-quantity">
|
|
<p class="p-total">10</p>
|
|
<p class="p-remaint">Còn <span class="js-remaining-GAXkB1">0</span></p>
|
|
</div>
|
|
<p class="p-price">Trị giá: <span class="p-price-value">390.000</span> VNĐ</p>
|
|
</div>
|
|
</div>
|
|
<!-- ITEM -->
|
|
<div class="p-item" data-id="RQtAG7">
|
|
<div class="p-picture">
|
|
<img src="https://aman.gleecdn.com/file/1/lx/lXvXqtRHg8Rrk6x.png" alt="reward-product-bg" class="p-img-bg p-img-bg-nomarl d-flex w-100">
|
|
<img src="https://aman.gleecdn.com/file/1/5x/5xm0xgBukjqDrW3.png" alt="Voucher 200K" class="p-img d-flex">
|
|
</div>
|
|
<div class="p-content">
|
|
<div class="p-title">Giải ba</div>
|
|
<div class="p-quantity">
|
|
<p class="p-total">15</p>
|
|
<p class="p-remaint">Còn <span class="js-remaining-RQtAG7">9</span></p>
|
|
</div>
|
|
<p class="p-price">Trị giá: <span class="p-price-value">200.000</span> VNĐ</p>
|
|
</div>
|
|
</div>
|
|
<!-- ITEM -->
|
|
<div class="p-item" data-id="yh1H8M">
|
|
<div class="p-picture">
|
|
<img src="https://aman.gleecdn.com/file/1/lx/lXvXqtRHg8Rrk6x.png" alt="reward-product-bg" class="p-img-bg p-img-bg-nomarl d-flex w-100">
|
|
<img src="https://aman.gleecdn.com/file/1/b7/B7LyR3LMfSEZKKi.png" alt="Ruột gối ép Olympia" class="p-img d-flex">
|
|
</div>
|
|
<div class="p-content">
|
|
<div class="p-title">Giải tư</div>
|
|
<div class="p-quantity">
|
|
<p class="p-total">20</p>
|
|
<p class="p-remaint">Còn <span class="js-remaining-yh1H8M">4</span></p>
|
|
</div>
|
|
<p class="p-price">Trị giá: <span class="p-price-value">125.000</span> VNĐ</p>
|
|
</div>
|
|
</div>
|
|
<!-- ITEM -->
|
|
<div class="p-item" data-id="FQiltX">
|
|
<div class="p-picture">
|
|
<img src="https://aman.gleecdn.com/file/1/lx/lXvXqtRHg8Rrk6x.png" alt="reward-product-bg" class="p-img-bg p-img-bg-nomarl d-flex w-100">
|
|
<img src="https://aman.gleecdn.com/file/1/sn/SnhvT4vzoGJ64PD.png" alt="Voucher 100K" class="p-img d-flex">
|
|
</div>
|
|
<div class="p-content">
|
|
<div class="p-title">Giải năm</div>
|
|
<div class="p-quantity">
|
|
<p class="p-total">25</p>
|
|
<p class="p-remaint">Còn <span class="js-remaining-FQiltX">16</span></p>
|
|
</div>
|
|
<p class="p-price">Trị giá: <span class="p-price-value">100.000</span> VNĐ</p>
|
|
</div>
|
|
</div>
|
|
<!-- ITEM -->
|
|
<div class="p-item" data-id="Ho7qny">
|
|
<div class="p-picture">
|
|
<img src="https://aman.gleecdn.com/file/1/lx/lXvXqtRHg8Rrk6x.png" alt="reward-product-bg" class="p-img-bg p-img-bg-nomarl d-flex w-100">
|
|
<img src="https://aman.gleecdn.com/file/1/9x/9Xj3oruFFGb4HJo.png" alt="Mũ bảo hiểm Đệm Xanh" class="p-img d-flex">
|
|
</div>
|
|
<div class="p-content">
|
|
<div class="p-title">Giải sáu</div>
|
|
<div class="p-quantity">
|
|
<p class="p-total">25</p>
|
|
<p class="p-remaint">Còn <span class="js-remaining-Ho7qny">17</span></p>
|
|
</div>
|
|
<p class="p-price">Trị giá: <span class="p-price-value">50.000</span> VNĐ</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="main-content-sub js-hura-drag">
|
|
<!-- TIME -->
|
|
<div class="time d-flex flex-column align-items-center text-uppercase color-white">
|
|
<p class="time-date text-32 font-weight-900 font-uppercase bg-primary-text">Thời gian còn lại</p>
|
|
<div class="time-countdown text-center d-flex my-3 gap-24" id="js-time-game-left">
|
|
<b class="item">
|
|
<p class="clock">07</p>
|
|
<span class="type text-12">Ngày</span>
|
|
</b>
|
|
<b class="item">
|
|
<p class="clock">14</p>
|
|
<span class="type text-12">Giờ</span>
|
|
</b>
|
|
<b class="item">
|
|
<p class="clock">03</p>
|
|
<span class="type text-12">Phút</span>
|
|
</b>
|
|
<b class="item">
|
|
<p class="clock">05</p>
|
|
<span class="type text-12">Giây</span>
|
|
</b>
|
|
</div>
|
|
</div>
|
|
<!-- PLAYER-RECENTS -->
|
|
<div class="player-recents mt-3">
|
|
<p class="title">Đang online: <span class="js-users-status-online blink font-weight-900">1</span></p>
|
|
<p class="title">Đang chơi: <span class="js-users-status-playing blink font-weight-900">0</span></p>
|
|
<p class="title">Đã chơi: <span class="js-users-status-played blink font-weight-900">493</span></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- MAIN CONTENT -->
|
|
<div class="main-content grid grid--2-cols py-5 align-items-center js-hura-drag">
|
|
<!-- COL LEFT -->
|
|
<div class="col-left">
|
|
<!-- GAME WHEEL -->
|
|
<div class="game-wheel">
|
|
<img src="https://aman.gleecdn.com/file/1/n6/n6rC03ldv6IFHb6.png" alt="wheel" class="wheel-bg d-flex w-100">
|
|
<div class="vqmm-ct-ct in-wheel wheel-roll">
|
|
<div class="vq-ct js-hura-edit" data-hura-type="wheel">
|
|
<canvas id="canvas" width="772" height="772" class="wheel-canvas d-flex w-100">
|
|
<p style="color: white" align="center">Sorry, your browser doesn't support canvas. Please try another.
|
|
</p>
|
|
</canvas>
|
|
</div>
|
|
</div>
|
|
<img src="https://aman.gleecdn.com/file/1/ok/ok47NqgmXq9ayOp.png" alt="wheel" class="wheel-center d-flex w-100">
|
|
</div>
|
|
</div>
|
|
<!-- COL RIGHT -->
|
|
<div class="col-right">
|
|
<!-- PLAY GAME -->
|
|
<div class="d-flex justify-content-center my-4" id="play-game-outside">
|
|
<a href="javascript:void(0)" onclick="if(is_user_exist){start_game()}else{toggleModal('#js-modal-play-game')}" class="play-game-btn text-24 font-weight-800 text-uppercase color-black">
|
|
Chơi ngay
|
|
</a>
|
|
</div>
|
|
<div class="justify-content-center my-4" id="js-reset-btn" style="display:none;">
|
|
<a href="javascript:void(0)" onclick="Adman.MiniGame.reset()" class="play-game-btn text-24 font-weight-800 text-uppercase color-black">
|
|
Chơi lại
|
|
</a>
|
|
</div>
|
|
<!-- PLAYER-REWARD -->
|
|
<div class="player-reward box color-black text-16 my-4">
|
|
<h2 class="text-20 font-weight-900 text-uppercase color-secondary my-3">Danh sách kết quả của bạn</h2>
|
|
<p class="js-reward-notify color-red text-16 font-weight-600 mb-3"></p>
|
|
<ol id="js-reward-list">
|
|
<li class="item mb-1 ml-4">
|
|
Gối cao su Kim Cương
|
|
<i class="js-chose-reward color-red font-weight-700">
|
|
<a href="javascript:;" data-id="zQz9FHxIIc" class="js-chose-reward-btn">Chọn giải này</a>
|
|
</i>
|
|
</li>
|
|
<li class="item mb-1 ml-4">
|
|
Voucher 200K
|
|
<i class="js-chose-reward color-red font-weight-700">
|
|
<a href="javascript:;" data-id="twruISIx3F" class="js-chose-reward-btn">Chọn giải này</a>
|
|
</i>
|
|
</li>
|
|
</ol>
|
|
</div>
|
|
<!-- GAME POLICY -->
|
|
<div class="game-policy box">
|
|
<h2 class="text-20 font-weight-900 color-secondary my-3">THỂ LỆ CHƯƠNG TRÌNH</h2>
|
|
|
|
<div class="game-policy js-hura-edit" data-hura-type="text" style="line-height:1.5;">
|
|
<p>1. Quý khách cần đăng nhập Thông tin chính xác để quay thưởng.</p>
|
|
<p>2. Mỗi khách hàng được quay 5 lần và chỉ được chọn 1 phần quà.</p>
|
|
<p>3. Mã giảm giá sử dụng trong vòng 15 ngày kể từ ngày nhận thưởng.</p>
|
|
<p>4. Voucher được phát hành và áp dụng đến khi hết số lượng.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- GAME FEATURES -->
|
|
<div class="game-features grid">
|
|
<!-- REWARD PLAYER -->
|
|
<div class="game-prize-recent box">
|
|
<!-- HEADING -->
|
|
<h2 class="heading-p-recent text-20 font-weight-900 color-secondary my-3">
|
|
DANH SÁCH TRÚNG THƯỞNG
|
|
</h2>
|
|
|
|
<div class="js-hura-edit" data-hura-type="reward" style="padding: 4px;">
|
|
<div id="js-recent-winners"><table class="text-14 text-12-mb w-100"><thead><tr><th>STT</th><th>Khách hàng</th><th>Giải thưởng</th><th>Thời gian</th></tr></thead><tbody><tr><td>1</td><td>***ngoc@gmail.com</td><td>Voucher 100K</td><td>15-Mar-2023 9:43</td></tr><tr><td>2</td><td>***312@gmail.com</td><td>Mũ bảo hiểm Đệm Xanh</td><td>15-Mar-2023 9:10</td></tr><tr><td>3</td><td>***apoptod@gmail.com</td><td>Ruột gối ép Olympia</td><td>15-Mar-2023 8:39</td></tr><tr><td>4</td><td>***atest232124@gmail.com</td><td>Gối cao su Kim Cương</td><td>7-Mar-2023 15:5</td></tr><tr><td>5</td><td>***atest@gmail.com</td><td>Ruột gối ép Olympia</td><td>7-Mar-2023 14:56</td></tr><tr><td>6</td><td>***nnd@hurasoft.com</td><td>Voucher 100K</td><td>4-Mar-2023 11:42</td></tr><tr><td>7</td><td>***c@gmail.com</td><td>Ruột gối ép Olympia</td><td>27-Feb-2023 14:18</td></tr><tr><td>8</td><td>***21212@gmail.com</td><td>Ruột gối ép Olympia</td><td>27-Feb-2023 11:52</td></tr><tr><td>9</td><td>***yenvanname100@gmail.com</td><td>Gối cao su Kim Cương</td><td>27-Feb-2023 11:46</td></tr><tr><td>10</td><td>***yenthiname10@mail.com</td><td>Ruột gối ép Olympia</td><td>27-Feb-2023 11:44</td></tr><tr><td>11</td><td>***wqewqwed@gmail.com</td><td>Mũ bảo hiểm Đệm Xanh</td><td>27-Feb-2023 11:37</td></tr><tr><td>12</td><td>***424240@mail.com</td><td>Voucher 200K</td><td>27-Feb-2023 10:37</td></tr><tr><td>13</td><td>***424242@mail.com</td><td>Mũ bảo hiểm Đệm Xanh</td><td>27-Feb-2023 10:35</td></tr><tr><td>14</td><td>***d323423@gmail.com</td><td>Ruột gối ép Olympia</td><td>23-Feb-2023 17:26</td></tr><tr><td>15</td><td>***121212d@gmail.com</td><td>Ruột gối ép Olympia</td><td>23-Feb-2023 17:16</td></tr><tr><td>16</td><td>***d1212@gmail.com</td><td>Voucher 100K</td><td>23-Feb-2023 17:11</td></tr><tr><td>17</td><td>***sd@gmail.com</td><td>Chăn lông cừu</td><td>23-Feb-2023 17:10</td></tr><tr><td>18</td><td>***atest123321123@gmail.com</td><td>Chăn lông cừu</td><td>22-Feb-2023 17:19</td></tr><tr><td>19</td><td>***atest431123@gmail.com</td><td>Voucher 100K</td><td>22-Feb-2023 16:44</td></tr><tr><td>20</td><td>***driver@gmail.com</td><td>Ruột gối ép Olympia</td><td>22-Feb-2023 8:54</td></tr></tbody></table></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- FOOTER -->
|
|
<div class="footer">
|
|
<!-- MODAL PLAY GAME -->
|
|
<div class="modal-global modal-player d-none" id="js-modal-play-game">
|
|
<div class="game-box game-policy">
|
|
<!-- PLAYER -->
|
|
<div class="play-game" id="play-game-inside">
|
|
<div action="" class="form play-container">
|
|
<p class="form-title text-22 font-weight-900 text-uppercase color-secondary mb-4 text-center">
|
|
Vui lòng nhập thông tin của bạn để bắt đầu quay
|
|
</p>
|
|
<div class="form-list mb-3" id="js-user-info"><input type="email" placeholder="Email*" id="js-user-email" class="form-input" value="test@mail.com"> <input type="text" placeholder="Họ tên*" id="js-user-name" class="form-input" value="đức"> <input type="text" placeholder="Số điện thoại*" id="js-user-mobile" class="form-input" value="0987654211"></div>
|
|
<div id="js-game-status" class="font-weight-700 color-red my-2"></div>
|
|
<div id="js-game-notify" class="font-weight-700 color-red my-2"></div>
|
|
<a href="javascript:;" type="submit" id="js-spin-btn" style="display:flex;" class="play-game-btn text-24 font-weight-900 color-black text-center text-uppercase m-auto" onclick="updateUserInfo()">
|
|
Cập nhật
|
|
</a> <!-- js-spin-btn -->
|
|
<!--<a href="javascript:;" type="submit" id="js-reset-btn" style="display:none;"
|
|
class="play-game-btn text-24 font-weight-900 color-black text-center text-uppercase m-auto"
|
|
onclick="Adman.MiniGame.reset()">
|
|
Chơi lại
|
|
</a>-->
|
|
</div>
|
|
</div>
|
|
<button class="btn-close" onclick="toggleModal('#js-modal-play-game')">
|
|
<span class="text-24 font-weight-500 color-white">X</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<!-- PHONE CONTACT -->
|
|
<div class="font-weight-900 color-white text-center py-3 js-hura-edit" data-hura-type="text">
|
|
<a href="tel:0828826688">Hotline liên hệ: <span class="text-24">0828.826.688</span></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html> |