| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212 |
- <!doctype html>
- <html lang="en">
- <head>
- <title>Test</title>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE-edge">
- <meta name="viewport" content="width=device-width, initial-scal=1">
- <link rel="stylesheet" type="text/css" href="/static/css/test.css">
- <link rel="stylesheet" type="text/css" href="/static/css/test-theme.css">
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
- <style type="text/css">
-
- html, body {
- margin: 0;
- padding: 0;
- background-color: #010010;
- }
- h3 {color: #fff;}
-
- * {
- box-sizing: border-box;
- }
-
- .slider {
- width: 100%;
- }
-
- .slick-slide {
- margin: 0px 10px;
- }
-
- .slick-slide img {
- width: 100%;
- height: 250px;
- }
-
-
- .slick-prev:before,
- .slick-next:before {
- color: #fff;
- }
-
-
- .slick-slide {
- transition: all ease-in-out .3s;
- opacity: .2;
- }
-
- .slick-active {
- opacity: .5;
- }
-
- .menu {
- width: 35px;
- height: 5px;
- background-color: #fff;
- margin: 6px 0;
- }
- .searchicon{
- margin-top: 15px;
- margin-right: 20px;
- color: #fff;
- }
- .fontwhite{
- color: #fff;
- }
-
- </style>
- </head>
- <body>
-
-
- <div class="subNav hidden-lg">
- <nav id="subNav">
- <button type="button" class="hidden-lg-up navbar-toggle hamberger-menu pull-left" data-toggle="collapse" data-target="#collapsingSubNavbar">
- <span class="sr-only">Toggle navigation</span>
- <span class="icon-bar" style="background-color:#fff"></span>
- <span class="icon-bar" style="background-color:#fff"></span>
- <span class="icon-bar" style="background-color:#fff"></span>
- </button>
- <div class='pull-right avt-container' style='display:none'>
- <fb-avatar></fb-avatar>
- </div>
- <div>
- <a class="navbar-brand hidden-lg-up brand mcot-logo-box" ui-sref="app.index" >
- <img src="http://imgs.mcot.net/images/2017/10/1509338573304.png" style="height:auto; width:55px; margin-left:55px;;display:inherit;margin-top: -5px;">
- </a>
- </div>
- <div class="" style="background-color: #2860AA;">
- <a class="">
- <span class="glyphicon glyphicon-search searchicon" style="margin-left: 85px;"></span>
- </div>
-
- <div class="container" style="background-color: #2860AA;">
- <div id="collapsingSubNavbar" class="collapse navbar-toggleable-md hidden-lg-up" style="margin-top:50px;">
- <ul class="nav navbar-nav">
- <li class="nav-item text-center">
- <a class="nav-link" href="http://www.tnamcot.com" target="_blank">ข่าว</a>
- </li>
- <li class="nav-item text-center">
- <a class="nav-link" href="http://www.nineentertain.tv" target="_blank">บันเทิง</a>
- </li>
- <li class="nav-item text-center">
- <a class="nav-link" href="http://lively.mcot.net/index" target="_blank">ไลฟ์สไตล์</a>
- </li>
- <li class="nav-item text-center">
- <a class="nav-link" href="http://tv.mcot.net" target="_blank">โทรทัศน์</a>
- </li>
- <li class="nav-item text-center">
- <a class="nav-link" href="http://mcot-web.mcot.net/radio/" target="_blank">วิทยุ</a>
- </li>
- <li class="nav-item text-center">
- <a class="nav-link" href="/category/กิจกรรม">กิจกรรม</a>
- </li>
- <li class="nav-item text-center">
- <a class="nav-link" href="/category/ประชาสัมพันธ์">ประชาสัมพันธ์</a>
- </li>
- </ul>
- </div>
- </div>
- </nav>
- </div>
-
-
-
- <!--Titlebar-->
- <div class="container-fluid visible-lg" style="background-color: #2860AA;">
- <div class="navbar-header" style="margin-top: 5px; margin-left: -10px;">
- <div class="menu"></div>
- <div class="menu"></div>
- <div class="menu"></div>
- </div>
- <div>
- <a class="navbar-brand hidden-lg-up brand mcot-logo-box" ui-sref="app.index" >
- <img src="http://imgs.mcot.net/images/2017/10/1509338573304.png" style="height:auto; width:55px; margin-left:600px;;display:inherit;margin-top: -5px;">
- </a>
- </div>
- <span class="visible-lg glyphicon glyphicon-search" style="color: #fff; margin-top: 15px; float: right;"></span>
- </div>
-
-
- <!--Hilight-->
- <div class="hidden-lg">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=260x320" style="height: 260px;width: 100%;"></a>
- </div>
-
- <div class="visible-lg">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=1350x500" style="height: 500px;width:100%;"></a>
- </div>
- <div class="container">
- <p><h3 class="fontwhite">The Walking Dead</h3></p>
- <button type="button" class="btn btn-default">Add Favorite</button>
- <button type="button" class="btn btn-default">Rate</button>
- </div>
- <hr>
- <!--End Hilight-->
-
- <!--ContinueWatch-->
- <!--Moblie Continue-->
- <div class="container hidden-lg " style="margin-top: -30px;">
- <h3>Season7</h3>
- </div>
- <div class="col-lg-6 hidden-lg">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=160x140" style="height: 130px;width: 143px;"></a>
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=160x140" style="height: 130px;width: 143px;"></a>
- </div>
- <br>
- <div class="col-lg-6 hidden-lg">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=160x140" style="height: 130px;width: 143px;"></a>
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=160x140" style="height: 130px;width: 143px;"></a>
- </div><br>
- </div>
- <!--End Moblie Continue-->
-
- <div class="container visible-lg">
- <h3>Continue Watch For You</h3>
- <div class="col-lg-12">
-
- <div class="col-lg-6">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=250x540" style="height: 250px;width: 540px;"></a>
- </div>
-
- <div class="col-lg-6">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=250x540" style="height: 250px;width: 540px;"></a>
- </div>
- </div><br>
-
- <div class="col-lg-12" style="margin-top: 15px;">
- <div class="col-lg-6">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=250x540" style="height: 250px;width: 540px;"></a>
- </div>
-
- <div class="col-lg-6">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=250x540" style="height: 250px;width: 540px;"></a>
- </div></div><br>
-
- <div class="col-lg-12" style="margin-top: 15px;">
- <div class="col-lg-6">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=250x540" style="height: 250px;width: 540px;"></a>
- </div>
-
- <div class="col-lg-6">
- <a href="#"><img src="https://placeholdit.imgix.net/~text?txtsize=18&txt=250x540" style="height: 250px;width: 540px;"></a>
- </div></div><br>
- </div>
- <!--endcon-->
-
- </body>
- </html>
|