<<<<<<< HEAD
<body class="animsition">
<!-- Header -->
<header>
<!-- Header Mobile -->
<div class="wrap-header-mobile">
<!-- Logo moblie -->
<div class="logo-mobile">
<a href="index.html"><img src="images/logo_1.png" alt="IMG-LOGO"></a>
</div>
<!-- Button show menu -->
<div class="btn-show-menu-mobile hamburger hamburger--squeeze m-r--8">
<span class="hamburger-box">
<span class="hamburger-inner"></span>
</span>
</div>
</div>
<!-- Menu Mobile -->
<div class="menu-mobile">
<ul class="topbar-mobile">
<li class="right-topbar">
<a href="#">
<span class="fab fa-facebook-f"></span>
</a>
<a href="#">
<span class="fab fa-twitter"></span>
</a>
<a href="#">
<span class="fab fa-pinterest-p"></span>
</a>
<a href="#">
<span class="fab fa-vimeo-v"></span>
</a>
<a href="#">
<span class="fab fa-youtube"></span>
</a>
</li>
</ul>
<ul class="main-menu-m">
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="category-01.html">Categories</a>
</li>
<li>
<a href="category-02.html">Entertainment </a>
</li>
<li>
<a href="category-01.html">Business</a>
</li>
<li>
<a href="category-02.html">Travel</a>
</li>
<li>
<a href="category-01.html">Life Style</a>
</li>
<li>
<a href="category-02.html">Video</a>
</li>
</ul>
</div>
<!-- -->
<div class="wrap-logo container">
<!-- Logo desktop -->
<div class="logo">
<a href="index.html"><img src="images/logo_1.png" alt="LOGO"></a>
</div>
</div>
<!-- -->
<div class="wrap-main-nav">
<div class="main-nav">
<!-- Menu desktop -->
<nav class="menu-desktop">
<a class="logo-stick" href="index.html">
<img src="images/icons/logo-01.png" alt="LOGO">
</a>
<ul class="main-menu">
<li>
<a href="index.html">Home</a>
</li>
<li class="mega-menu-item category">
<a href="#">Categories</a>
<div class="sub-mega-menu">
<div class="nav flex-column nav-pills" role="tablist">
<div data-ng-repeat="catagori in catagories">
<a ng-click="show(catagori.id)" class="nav-link " data-toggle="pill" href="#{{catagori.id}}" role="tab">{{catagori.name}}</a>
</div>
</div>
<div class="tab-content">
<span data-ng-repeat="catagori in catagories">
<span class="tab-pane" id="{{catagori.id}}" role="tabpanel"></span>
</span>
<div class="row">
<div class="col-3" data-ng-repeat="news in newestNews">
<!-- Item post -->
<div >
<a href="http://localhost:8080/index.html#/news/{{news.id}}" class="wrap-pic-w hov1 trans-03">
<img src="{{news.thumbnail}}" alt="IMG">
</a>
<div class="p-t-10">
<h5 class="p-b-5">
<a href="http://localhost:8080/index.html#/news/{{news.id}}" class="f1-s-5 cl3 hov-cl10 trans-03">
{{news.content}}
</a>
</h5>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li>
<a href="index.html">About Us</a>
</li>
<li>
<a href="#">Login</a>
</li>
<li>
<a href="#s">Sign up</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</header>
<!-- Headline -->
<div class="container">
<div class="bg0 flex-wr-sb-c p-rl-20 p-tb-8">
<div class="f2-s-1 p-r-30 size-w-0 m-tb-6 flex-wr-s-c">
<span class="text-uppercase cl2 p-r-8">
Welcome :
</span>
<span class="dis-inline-block cl6 slide100-txt pos-relative size-w-0" data-in="fadeInDown" data-out="fadeOutDown">
<span class="dis-inline-block slide100-txt-item animated visible-false">
Have a nice day!
</span>
<span class="dis-inline-block slide100-txt-item animated visible-false">
Discover our page with amazing news!!
</span>
<span class="dis-inline-block slide100-txt-item animated visible-false">
You are awesome!
</span>
</span>
</div>
<div class="pos-relative size-a-2 bo-1-rad-22 of-hidden bocl11 m-tb-6">
<input class="f1-s-1 cl6 plh9 s-full p-l-25 p-r-45" type="text" name="search" placeholder="Search">
<button class="flex-c-c size-a-1 ab-t-r fs-20 cl2 hov-cl10 trans-03">
<i class="zmdi zmdi-search"></i>
</button>
</div>
</div>
</div>
<!--body-->
<div>
<div ui-view="content"></div>
</div>
<footer>
<div class="bg2 p-t-40 p-b-25">
<div class="container">
<div class="row">
<div class="col-lg-4 p-b-20">
<div class="size-h-3 flex-s-c">
<a href="index.html">
<img class="max-s-full" src="images/icons/logo-02.png" alt="LOGO">
</a>
</div>
<div>
<p class="f1-s-1 cl11 p-b-16">
Thanks for visiting our page!
</p>
<p class="f1-s-1 cl11 p-b-16">
Any questions? Call us on 0968099149
</p>
<div class="p-t-15">
<a href="#" class="fs-18 cl11 hov-cl10 trans-03 m-r-8">
<span class="fab fa-facebook-f"></span>
</a>
<a href="#" class="fs-18 cl11 hov-cl10 trans-03 m-r-8">
<span class="fab fa-twitter"></span>
</a>
<a href="#" class="fs-18 cl11 hov-cl10 trans-03 m-r-8">
<span class="fab fa-pinterest-p"></span>
</a>
<a href="#" class="fs-18 cl11 hov-cl10 trans-03 m-r-8">
<span class="fab fa-vimeo-v"></span>
</a>
<a href="#" class="fs-18 cl11 hov-cl10 trans-03 m-r-8">
<span class="fab fa-youtube"></span>
</a>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4 p-b-20">
<div class="size-h-3 flex-s-c">
<h5 class="f1-m-7 cl0">
Popular Posts
</h5>
</div>
<ul>
<li class="flex-wr-sb-s p-b-20">
<a href="#" class="size-w-4 wrap-pic-w hov1 trans-03">
<img src="images/popular-post-01.jpg" alt="IMG">
</a>
<div class="size-w-5">
<h6 class="p-b-5">
<a href="#" class="f1-s-5 cl11 hov-cl10 trans-03">
Donec metus orci, malesuada et lectus vitae
</a>
</h6>
<span class="f1-s-3 cl6">
Feb 17
</span>
</div>
</li>
<li class="flex-wr-sb-s p-b-20">
<a href="#" class="size-w-4 wrap-pic-w hov1 trans-03">
<img src="images/popular-post-02.jpg" alt="IMG">
</a>
<div class="size-w-5">
<h6 class="p-b-5">
<a href="#" class="f1-s-5 cl11 hov-cl10 trans-03">
Lorem ipsum dolor sit amet, consectetur
</a>
</h6>
<span class="f1-s-3 cl6">
Feb 16
</span>
</div>
</li>
<li class="flex-wr-sb-s p-b-20">
<a href="#" class="size-w-4 wrap-pic-w hov1 trans-03">
<img src="images/popular-post-03.jpg" alt="IMG">
</a>
<div class="size-w-5">
<h6 class="p-b-5">
<a href="#" class="f1-s-5 cl11 hov-cl10 trans-03">
Suspendisse dictum enim quis imperdiet auctor
</a>
</h6>
<span class="f1-s-3 cl6">
Feb 15
</span>
</div>
</li>
</ul>
</div>
<div class="col-sm-6 col-lg-4 p-b-20">
<div class="size-h-3 flex-s-c">
<h5 class="f1-m-7 cl0">
Category
</h5>
</div>
<ul class="m-t--12">
<li class="how-bor1 p-rl-5 p-tb-10" data-ng-repeat="catagori in catagories">
<a href="#" class="f1-s-5 cl11 hov-cl10 trans-03 p-tb-8">
{{catagori.name}}
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<!-- Back to top -->
<div class="btn-back-to-top" id="myBtn">
<span class="symbol-btn-back-to-top">
<span class="fas fa-angle-up"></span>
</span>
</div>
<!-- Modal Video 01-->
<div class="modal fade" id="modal-video-01" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" role="document" data-dismiss="modal">
<div class="close-mo-video-01 trans-0-4" data-dismiss="modal" aria-label="Close">×</div>
<div class="wrap-video-mo-01">
<div class="video-mo-01">
<iframe src="https://www.youtube.com/embed/wJnBTPUQS5A?rel=0" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
<script src="../js/main.js"></script>
<!-- <script src="../js/ui-bootstrap-tpls-0.3.0.min.js"></script>-->
</body>
=======
<div>
<div ui-view="content"></div>
</div>
>>>>>>> ed09ed47f5d092a7753469913def1ab676073023