proj-iott/modules/announcement/_annc_widget18.html.erb

86 lines
2.4 KiB
Plaintext
Executable File

<div class="w-annc widget-announcement-18">
<div class="w-annc__more-wrap clearfix">
<h2 class="w-annc__widget-title">
<span>{{widget-title}}</span>
</h2>
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
</div>
<ul class="w-annc__list row" data-level="0" data-list="announcements">
<li class="w-annc__item col-md-4">
<div class="w-annc__img-wrap">
<a href="{{link_to_show}}" title="{{title}}">
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
</a>
</div>
<div class="w-annc__content-wrap">
<h4 class="w-annc__entry-title">
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
</h4>
<div class="w-annc__subtitle">{{subtitle}}</div>
<div class="w-annc_read_more"><a href="{{link_to_show}}" title="{{title}}">{{read_more_text}}</a></div>
</div>
</li>
</ul>
</div>
<style type="text/css">
.widget-announcement-18 [data-list="announcements"] li > *{
background: #ffffff;
width: 100%;
float: left;
}
.widget-announcement-18 [data-list="announcements"] .w-annc__img{
width: 100%;
}
.widget-announcement-18 [data-list="announcements"] .w-annc__content-wrap{
padding: 0 1em;
}
.widget-announcement-18 .w-annc__title {
line-height: 1.3;
font-size: 1.2rem;
}
.widget-announcement-18 .w-annc__widget-title {
float: left;
}
.widget-announcement-18 .w-annc__more {
margin-top: 1.5em;
}
.widget-announcement-18 .w-annc__list > .w-annc__item:nth-child(3n+1) {
clear: both;
}
.widget-announcement-18 li.w-annc__item{
float: left;
}
.widget-announcement-18 .w-annc__img-wrap {
padding: 0 0 1em 0;
}
.w-annc_read_more{
display: inline-block;
padding: 1em;
}
.w-annc_read_more a{
float: left;
background: #4a97c2;
color: #ffffff;
padding: 0 0.5em;
border-radius: 0.3em;
border: 0.5em solid #4a97c2;
}
.w-annc__subtitle {
padding-bottom: 0.3em;
}
.w-annc_read_more a:hover{
background: #327397;
border: 0.5em solid #327397;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$("[data-subpart-id=\"{{subpart-id}}\"] .w-annc__subtitle").each(function(i,v){
var subtitle = $(v).text();
if(subtitle.length > 15){
$(v).text(subtitle.slice(0,15) + "...");
}
})
})
</script>