From 159b0529f26f47491d48b6a4f535fe79df51bf84 Mon Sep 17 00:00:00 2001
From: chihyux <chihyux@gmail.com>
Date: Mon, 15 Jun 2020 11:50:03 +0800
Subject: [PATCH] update template style

---
 modules/e_paper/_latest_criteria.html.erb     | 31 ++++++++++--
 modules/e_paper/_latest_slider_aside.html.erb | 33 ++++++++++++-
 .../_latest_slider_full_screen.html.erb       | 48 ++++++++++++++++++-
 modules/e_paper/epaper_index2.html.erb        | 11 ++++-
 4 files changed, 113 insertions(+), 10 deletions(-)

diff --git a/modules/e_paper/_latest_criteria.html.erb b/modules/e_paper/_latest_criteria.html.erb
index 73b3223..f4d86a1 100644
--- a/modules/e_paper/_latest_criteria.html.erb
+++ b/modules/e_paper/_latest_criteria.html.erb
@@ -1,10 +1,31 @@
-<div class="latest-criteria" data-list="categories" data-level="0">
+<!-- <div class="latest-criteria" data-list="categories" data-level="0">
   <h3><a href="{{category-link}}">{{category_title}}</a></h3>
   <div data-list="topics" data-level="1">
-    <div class="latest-riteria-content">
+    <div class="latest-criteria-content" style='margin-bottom: 30px;'>
       <h4 class="latest-criteria-title"><a href="{{link_to_show}}">{{title}}</a></h4>
-      <div class="latest-criteria-description">{{description}}</div>
-      <img src="{{img_url_thumb}}" alt="{{title}}">
+      <div class='latest-cr-inner row'>
+        <div class='latest-cr-img col-lg-4 col-sm-4 col-xs-12' style='text-align: center;'><img src="{{img_url_thumb}}" alt="{{title}}"></div>
+        <div class="latest-criteria-description col-lg-8 col-sm-8 col-xs-12">{{description}}</div>
+        </div>
     </div>
   </div>
-</div>
+</div> -->
+
+
+<div class="latest-criteria epaper-index2" data-list="categories" data-level="0">
+  <h3><a href="{{category-link}}">{{category_title}}</a></h3>
+  <div data-list="topics" data-level="1">
+  <div class='epaper-index2-container row'>
+    <h4>
+    <a href="{{link_to_show}}">{{title}}</a>
+    <a href="{{link_to_show}}"><span>{{category_title}}</span></a>
+    </h4>
+    
+    <div class="epaper-leftimg col-lg-5 col-xs-12">
+      <img src="{{img_url_thumb}}" alt="{{title}}">
+    </div>
+    <div class="epaper-rightContent col-lg-7 col-xs-12" >
+      <div class="epaper-description"><a href="{{link_to_show}}">{{description}}</a></div>
+    </div>
+  </div>
+</div> 
\ No newline at end of file
diff --git a/modules/e_paper/_latest_slider_aside.html.erb b/modules/e_paper/_latest_slider_aside.html.erb
index 6343052..d9650ac 100644
--- a/modules/e_paper/_latest_slider_aside.html.erb
+++ b/modules/e_paper/_latest_slider_aside.html.erb
@@ -1,3 +1,7 @@
+<%= javascript_include_tag "plugin/owl.carousel.min.js"%>
+<link rel="stylesheet" type="text/css" href="/assets/template/owl.carousel.min.css">
+<link rel="stylesheet" type="text/css" href="/assets/template/owl.theme.default.min.css">
+
 <div class="latest_slider" data-list="categories" data-level="0">
   <div class="banner-Container owl-carousel owl-theme" data-list="topics" data-level="1">
       <div class="item">
@@ -6,9 +10,36 @@
       <a href="{{link_to_show}}">
           <h4>{{title}}</h4>
           <img src="{{img_url_thumb}}" alt="{{title}}">
-          <div>{{description}}</div>
+          <div class='epaper-description'>{{description}}</div>
       </a>
     </div>
     </div>
   </div>
 </div>
+
+<script>
+$(".owl-carousel").owlCarousel({
+  loop: true,
+  center: true,
+  items: 1,
+  autoplay: true,
+  autoplayHoverPause: true,
+  responsiveClass:true,
+  responsive:{
+    600:{
+        items: 1,
+        nav:false
+    }
+  }
+});
+  $(function(){
+  var len = 50; 
+  $(".latest_slider .epaper-description").each(function(i){
+      if($(this).text().length>len){
+          $(this).attr("title",$(this).text());
+          var text= $(this).text().substring(0,len-1)+" ...";
+          $(this).text(text);
+      }
+  });
+});
+</script>
\ No newline at end of file
diff --git a/modules/e_paper/_latest_slider_full_screen.html.erb b/modules/e_paper/_latest_slider_full_screen.html.erb
index f1feab3..01b04c7 100644
--- a/modules/e_paper/_latest_slider_full_screen.html.erb
+++ b/modules/e_paper/_latest_slider_full_screen.html.erb
@@ -1,17 +1,20 @@
+<%= javascript_include_tag "plugin/owl.carousel.min.js"%>
+<link rel="stylesheet" type="text/css" href="/assets/template/owl.carousel.min.css">
+<link rel="stylesheet" type="text/css" href="/assets/template/owl.theme.default.min.css">
 
 <div class="latest-fullslider" data-list="categories" data-level="0">
   <div class="banner-Container owl-carousel owl-theme" data-list="topics" data-level="1">
     <div class="item">
         <div class="row epaper-container">
 
-              <div class="left-fullslider col-lg-8 col-xs-12">
+              <div class="left-fullslider col-lg-7 col-md-7 col-xs-12">
                   <a href="{{link_to_show}}">
                   <img src="{{img_url_thumb}}" alt="{{title}}">
                     </a>
               </div>
 
 
-              <div class="right-fullslider col-lg-4 col-xs-12">
+              <div class="right-fullslider col-lg-5 col-md-5 col-xs-12">
                   <div class="right-box">
                       <a href="{{link_to_show}}">
                       <h3>{{category_title}}</h3>
@@ -28,6 +31,47 @@
   </div>
 </div>
 
+<script>
+$(".owl-carousel").owlCarousel({
+  loop: true,
+  center: true,
+  items: 1,
+  autoplay: true,
+  autoplayHoverPause: true,
+  responsiveClass:true,
+  responsive:{
+    600:{
+        items: 1,
+        nav:false
+    }
+  }
+});
+
+$(function(){
+  var len = 200; 
+  $(".latest-fullslider .epaper-description").each(function(i){
+      if($(this).text().length>len){
+          $(this).attr("title",$(this).text());
+          var text=$(this).text().substring(0,len-1)+" ...";
+          $(this).text(text);
+      }
+  });
+});
+
+if ($(window).width() < 768) {
+  $(function(){
+  var len = 30; 
+  $(".latest-fullslider .epaper-description").each(function(i){
+      if($(this).text().length>len){
+          $(this).attr("title",$(this).text());
+          var text=$(this).text().substring(0,len-1)+" ...";
+          $(this).text(text);
+      }
+  });
+});
+}
+</script>
+
 <!-- <div data-list="categories" data-level="0">
   <h3><a href="{{category_link}}">{{category_title}}</a></h3>
   <div data-list="topics" data-level="1">
diff --git a/modules/e_paper/epaper_index2.html.erb b/modules/e_paper/epaper_index2.html.erb
index 960781e..cb1a270 100644
--- a/modules/e_paper/epaper_index2.html.erb
+++ b/modules/e_paper/epaper_index2.html.erb
@@ -9,9 +9,15 @@
 <div class="epaper-index2" data-list="topics" data-level="0">
 	<!-- <div class="banner-Container "> </div> -->
 	<div class="epaper-index2-container row">
-		<h4><a href="{{link_to_show}}">{{title}}</a>
-			<a href="{{link_to_show}}"><span>{{category_title}}</span></a>
+		<h4>
+		<a href="{{link_to_show}}">{{title}}</a>
+		<span class='data-status'>
+		<span date-format="%Y-%m-%d">{{publish_date}}</span>
+		<span>{{criteria_title}}</span>
+		<span>{{category_title}}</span>
+		</span>
 		</h4>
+		
 		<div class="epaper-leftimg col-lg-5 col-xs-12">
 			<img src="{{img_url_thumb}}" alt="{{title}}">
 		</div>
@@ -20,3 +26,4 @@
 		</div>
 	</div>
 </div>
+