Update templates.
This commit is contained in:
parent
6d05aee356
commit
07f8450132
|
@ -233,6 +233,7 @@ body{
|
|||
}
|
||||
.colorbox{
|
||||
background-color:#e7e8ea;
|
||||
padding-top: 1em;
|
||||
}
|
||||
.group{
|
||||
width: 100%;
|
||||
|
@ -351,7 +352,7 @@ body{
|
|||
.onesection{
|
||||
color: #fff;
|
||||
@media(max-width:$screen-xs){
|
||||
padding: 0 15px;
|
||||
padding:0;
|
||||
}
|
||||
}
|
||||
.onepicture{
|
||||
|
|
|
@ -157,13 +157,13 @@ a#content{
|
|||
}
|
||||
}
|
||||
@media screen and (min-width: 769px){
|
||||
height: 100vh;
|
||||
height: 100vh!important;
|
||||
}
|
||||
@media screen and(min-width:$screen-xs) and (max-width:768px){
|
||||
height: 1000px;
|
||||
height: 1000px!important;
|
||||
}
|
||||
@media screen and (max-width: $screen-xs){
|
||||
height: 720px;
|
||||
height: 720px!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
.w-ba-banner {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
height: auto!important;
|
||||
|
||||
.cursor {
|
||||
cursor: pointer;
|
||||
|
@ -436,7 +437,6 @@ ul.button-mid{
|
|||
.w-ba-banner__caption {
|
||||
color: $theme-color-main;
|
||||
z-index: 200;
|
||||
padding: 4em;
|
||||
|
||||
h2 {
|
||||
font-family: $main-font;
|
||||
|
@ -451,7 +451,7 @@ ul.button-mid{
|
|||
}
|
||||
@media(max-width: $screen-sm) {
|
||||
.ad-overlay {
|
||||
padding: 0.5em 1em;
|
||||
padding: 1.5em 1em;
|
||||
position: relative;
|
||||
background:#72bcad;
|
||||
h3 { font-size: 1em; }
|
||||
|
@ -588,4 +588,4 @@ ul.button-mid{
|
|||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -78,9 +78,8 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-1
|
||||
.widget-announcement-1 {
|
||||
// Widget-0
|
||||
.widget-announcement-0 {
|
||||
.w-annc__postdate-wrap{
|
||||
color: #fff!important;
|
||||
}
|
||||
|
@ -157,6 +156,159 @@
|
|||
}
|
||||
}
|
||||
|
||||
}
|
||||
.card{
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
margin:0 0.5em;
|
||||
padding: 20px 25px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(32%, #ffffff00), color-stop(89%, #00000080));
|
||||
background-image: linear-gradient(
|
||||
180deg
|
||||
, #ffffff00 32%, #00000080 89%);
|
||||
}
|
||||
.card:before{
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
background-color: #288E8E;
|
||||
z-index: -1;
|
||||
-webkit-transition: height .6s;
|
||||
transition: height .6s;
|
||||
}
|
||||
}
|
||||
// Widget-1
|
||||
.widget-announcement-1 {
|
||||
.w-annc__postdate-wrap{
|
||||
color: #fff!important;
|
||||
}
|
||||
.w-annc__status-wrap{
|
||||
color: #fff!important;
|
||||
}
|
||||
.w-annc__category-wrap{
|
||||
color: #fff!important;
|
||||
}
|
||||
|
||||
.w-annc__title{
|
||||
color: #fff;
|
||||
@media(min-width:1920px){
|
||||
font-size: 1.6rem!important;
|
||||
}
|
||||
}
|
||||
.w-annc__subtitle{
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-box-decoration-break: clone;
|
||||
box-decoration-break: clone;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
max-height: 0;
|
||||
opacity: 0;
|
||||
-webkit-transition: max-height .6s,opacity .6s;
|
||||
transition: max-height .6s,opacity .6s;
|
||||
@media(min-width:1920px){
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
.w-annc__img-wrap {
|
||||
height: 25em;
|
||||
margin: 0.5em;
|
||||
@media(max-width:$screen-xs){
|
||||
height:20em;
|
||||
}
|
||||
@media(min-width:1920px){
|
||||
height: 30em;
|
||||
}
|
||||
img{
|
||||
width: auto!important;
|
||||
height: 100%!important;
|
||||
margin: 0 !important;
|
||||
max-width: fit-content;
|
||||
}
|
||||
}
|
||||
.w
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.w-annc__list{
|
||||
@media(min-width:$screen-xs){
|
||||
display: grid;
|
||||
grid-template: auto auto/repeat(12, 1fr);
|
||||
grid-gap: 0 10px;
|
||||
}
|
||||
li{
|
||||
&:hover{
|
||||
.card:before{
|
||||
height:100%;
|
||||
}
|
||||
.w-annc__subtitle{
|
||||
max-height: 100px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
position: relative;
|
||||
@media only screen and (max-width: 769px) and(min-width:500px){
|
||||
flex: 0 0 50%;
|
||||
}
|
||||
&:nth-child(1){
|
||||
grid-area: 1 / 1 / 3 / 5;
|
||||
-ms-grid-row: 1;
|
||||
-ms-grid-column: 1;
|
||||
-ms-grid-row-span: 3;
|
||||
-ms-grid-column-span: 7;
|
||||
.w-annc__img-wrap{
|
||||
height: 53em;
|
||||
}
|
||||
@media(max-width:$screen-xs){
|
||||
.w-annc__img-wrap{
|
||||
height: 40em;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:nth-child(2){
|
||||
grid-area: 1 / 5 / 2 / 9;
|
||||
-ms-grid-row: 1;
|
||||
-ms-grid-column: 9;
|
||||
-ms-grid-row-span: 1;
|
||||
-ms-grid-column-span: 7;
|
||||
}
|
||||
&:nth-child(3){
|
||||
grid-area: 1 / 9 / 2 / 13;
|
||||
-ms-grid-row: 1;
|
||||
-ms-grid-column: 17;
|
||||
-ms-grid-row-span: 1;
|
||||
-ms-grid-column-span: 7;
|
||||
}
|
||||
&:nth-child(4){
|
||||
grid-area: 2 / 5 / 3 / 9;
|
||||
-ms-grid-row: 3;
|
||||
-ms-grid-column: 9;
|
||||
-ms-grid-row-span: 1;
|
||||
-ms-grid-column-span: 7;
|
||||
}
|
||||
&:nth-child(5){
|
||||
grid-area: 2 / 9 / 3 / 13;
|
||||
-ms-grid-row: 3;
|
||||
-ms-grid-column: 17;
|
||||
-ms-grid-row-span: 1;
|
||||
-ms-grid-column-span: 7;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
.card{
|
||||
position: absolute;
|
||||
|
|
|
@ -24,9 +24,11 @@
|
|||
<section class="layout-content-box box " data-pp="4"></section>
|
||||
<section class="layout-content-box box " data-pp="1"></section>
|
||||
</div>
|
||||
|
||||
<div class="row colorbox">
|
||||
<section class="extra-box col-sm-12" data-pp="33"></section>
|
||||
|
||||
<div class="colorbox">
|
||||
<div class=" row">
|
||||
<section class="extra-box col-sm-12" data-pp="33"></section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-content-box2 colorbox container row">
|
||||
<section class="body-banner line" data-pp="8"></section>
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
|
||||
<div class="layout-content">
|
||||
<section class="layout-slide no-print single-child-datapp" data-pp="301"></section>
|
||||
<div class="layout-content-inner pagecontainer inner-page">
|
||||
<div class="layout-content-inner pagecontainer inner-page">
|
||||
<div class="sitemenu">
|
||||
<div class="sitemenu-wrap container" data-pp="400"></div>
|
||||
</div>
|
||||
|
@ -27,11 +27,12 @@
|
|||
<main id="main-content" class="main-content" data-content="true">
|
||||
<%= yield %>
|
||||
</main>
|
||||
</section>
|
||||
<div class="extra" data-pp="900"></div>
|
||||
<%= render_every_page_sharer %>
|
||||
<div class="extra" data-pp="700"></div>
|
||||
</section>
|
||||
</div>
|
||||
<div class="extra" data-pp="800"></div>
|
||||
</div>
|
||||
<div class="extra" data-pp="800"></div>
|
||||
</div>
|
||||
</div>
|
||||
<%= render_footer %>
|
||||
|
|
|
@ -32,7 +32,7 @@
|
|||
<div class="w-ad-banner__pager-1 w-ba-banner__caption banner-pager banner_caption_{{subpart-id}}" data-list="images" data-level="0">
|
||||
<li><button title="Slide {{slide_number}}"><span style="display: none;">Slide {{slide_number}}</span></button></li>
|
||||
</div>
|
||||
<ul class="controlplay"><a href="javascript:;" class="resume-slide active" title="<%= I18n.t("ad_banner.resume") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.resume") %>"></i></a><a href="javascript:;" class="pause-slide" title="<%= I18n.t("ad_banner.pause") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.pause") %>"></i></a></ul>
|
||||
<ul class="controlplay"><a href="javascript:;" class="resume-slide active" title="<%= I18n.t("ad_banner.resume") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.resume") %>"></i><p style="display: none;"><%= I18n.t("ad_banner.resume") %></p></a><a href="javascript:;" class="pause-slide" title="<%= I18n.t("ad_banner.pause") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.pause") %>"></i><p style="display: none;"><%= I18n.t("ad_banner.pause") %></p></a></ul>
|
||||
<ul class="button-mid">
|
||||
<i class="fa fa-angle-left prev-button" aria-label="<%= I18n.t("ad_banner.prev") %>"></i>
|
||||
<i class="fa fa-angle-right next-button" aria-label="<%= I18n.t("ad_banner.next") %>"></i>
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
</div>
|
||||
<div class="ad-overlay w-ad-banner__overlay_{{subpart-id}}"></div>
|
||||
<div class="w-ba-banner__caption w-ad-banner__pager-2 banner-pager banner_caption_{{subpart-id}}"></div>
|
||||
<ul class="controlplay"><a href="javascript:;" class="resume-slide active" title="<%= I18n.t("ad_banner.resume") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.resume") %>"></i></a><a href="javascript:;" class="pause-slide" title="<%= I18n.t("ad_banner.pause") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.pause") %>"></i></a></ul>
|
||||
<ul class="controlplay"><a href="javascript:;" class="resume-slide active" title="<%= I18n.t("ad_banner.resume") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.resume") %>"></i><p style="display: none;"><%= I18n.t("ad_banner.resume") %></p></a><a href="javascript:;" class="pause-slide" title="<%= I18n.t("ad_banner.pause") %>"><i aria-hidden="true" aria-label="<%= I18n.t("ad_banner.pause") %>"></i><p style="display: none;"><%= I18n.t("ad_banner.pause") %></p></a></ul>
|
||||
<ul class="button-mid">
|
||||
<i class="fa fa-angle-left prev-button" aria-label="<%= I18n.t("ad_banner.prev") %>"></i>
|
||||
<i class="fa fa-angle-right next-button" aria-label="<%= I18n.t("ad_banner.next") %>"></i>
|
||||
|
|
|
@ -0,0 +1,32 @@
|
|||
<div class="w-annc widget-announcement-0">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<ul class="w-annc__list" data-level="0" data-list="announcements">
|
||||
<li class="w-annc__item">
|
||||
<div class="w-annc__img-wrap bullseye">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="w-annc__meta">
|
||||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||||
<span class="w-annc__status label status {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<span class="w-annc__postdate-wrap" date-format="%Y-%m-%d">
|
||||
<span class="w-annc__postdate">{{postdate}}</span>
|
||||
</span>
|
||||
<span class="w-annc__category-wrap">
|
||||
<span class="w-annc__category">{{category}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<h4 class="w-annc__entry-title">
|
||||
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
|
||||
</h4>
|
||||
<p class="w-annc__subtitle">{{subtitle}}</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="w-annc__more-wrap clearfix">
|
||||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
|
||||
</div>
|
||||
</div>
|
|
@ -138,10 +138,18 @@
|
|||
}
|
||||
],
|
||||
"widgets": [
|
||||
{
|
||||
"filename": "annc_widget0",
|
||||
"name": {
|
||||
"zh_tw": "0. 標準圖文四張 ( 模組標題, 圖片, 狀態, 日期, 類別, 標題, 副標題 )",
|
||||
"en": "0. Standard Image + Text (widget-title, image, status, postdate, category, title, subtitle)"
|
||||
},
|
||||
"thumbnail": "annc_widget1_thumbs.png"
|
||||
},
|
||||
{
|
||||
"filename": "annc_widget1",
|
||||
"name": {
|
||||
"zh_tw": "1. 標準圖文 ( 模組標題, 圖片, 狀態, 日期, 類別, 標題, 副標題 )",
|
||||
"zh_tw": "1. 標準圖文五張 ( 模組標題, 圖片, 狀態, 日期, 類別, 標題, 副標題 )",
|
||||
"en": "1. Standard Image + Text (widget-title, image, status, postdate, category, title, subtitle)"
|
||||
},
|
||||
"thumbnail": "annc_widget1_thumbs.png"
|
||||
|
|
Loading…
Reference in New Issue