'update'
This commit is contained in:
parent
916f05b0ae
commit
a4216b6a4a
Binary file not shown.
|
After Width: | Height: | Size: 559 B |
|
|
@ -55,14 +55,14 @@
|
|||
},
|
||||
|
||||
// 外掛，所有的外掛都可以放到這個物件裡
|
||||
plugins: {
|
||||
// 自適應圖片裁切，Ray的外掛
|
||||
bullEye: function() {
|
||||
$('.bullseye').bullseye({
|
||||
fadeEffect: false
|
||||
});
|
||||
}
|
||||
},
|
||||
// plugins: {
|
||||
// // 自適應圖片裁切，Ray的外掛
|
||||
// bullEye: function() {
|
||||
// $('.bullseye').bullseye({
|
||||
// fadeEffect: false
|
||||
// });
|
||||
// }
|
||||
// },
|
||||
|
||||
// nav: {
|
||||
// 自適應使用的下拉選單
|
||||
|
|
@ -413,7 +413,6 @@
|
|||
orbit.goBackTop('top', 800);
|
||||
orbit.plugins.bullEye();
|
||||
orbit.setColumn('.left-column', '.right-column');
|
||||
orbit.ClickMenuHandler();
|
||||
|
||||
// 自適應網頁使用，當網頁載入時，如果視窗寬度小於769，就執行orbit.nav.setDropdown函數
|
||||
if ($(window).width() < 769) {
|
||||
|
|
@ -421,7 +420,7 @@
|
|||
orbit.MobileMenu();
|
||||
$('.mobile-menu').append($('.modules-menu'));
|
||||
$('.header-buttom').appendTo($('.modules-menu'));
|
||||
|
||||
orbit.ClickMenuHandler();
|
||||
}
|
||||
|
||||
// 自適應網頁使用，當使用者改變瀏覽器寬度時呼叫orbit.nav.setDropdown函數
|
||||
|
|
@ -466,83 +465,325 @@
|
|||
// $('.header-buttom').appendTo($('.dropdowns'));
|
||||
// }
|
||||
function forFreeGo() {
|
||||
//刪除空的h1
|
||||
$('h1').each(function() {
|
||||
if ($(this).text().trim() === '') {
|
||||
$(this).remove();
|
||||
}
|
||||
});
|
||||
//
|
||||
// $('.epaper-index2-container h4 a').each(function() {
|
||||
// var $this = $(this);
|
||||
// // 取得 a 內部的純文字內容，移除前後空白
|
||||
// var textContent = $this.text().trim();
|
||||
// // 檢查 a 內部是否所有子元素都是 display: none
|
||||
// var hasVisibleContent = $this.children().filter(function() {
|
||||
// return $(this).css('display') !== 'none';
|
||||
// }).length > 0;
|
||||
// // 如果 a 內部沒有純文字，且內部所有元素都是 display: none，則刪除該 a
|
||||
// if (textContent === '' || !hasVisibleContent) {
|
||||
// $this.remove();
|
||||
// }
|
||||
// });
|
||||
//refresh_btn加上aria-label
|
||||
$('#refresh_btn').each(function() {
|
||||
var $this = $(this);
|
||||
|
||||
// 如果 button 尚未有 aria-label，則新增
|
||||
if (!$this.attr('aria-label')) {
|
||||
$this.attr('aria-label', '重新整理');
|
||||
}
|
||||
});
|
||||
//無障礙會員表格刪除沒有顯示的th
|
||||
$('.i-member-tr-head').each(function() {
|
||||
if ($(this).css('display') === 'none') {
|
||||
$(this).remove();
|
||||
}
|
||||
});
|
||||
//無障礙公告a是空的
|
||||
$('.w-annc__subtitle').each(function () {
|
||||
var $this = $(this);
|
||||
var $link = $this.find('a');
|
||||
|
||||
// 檢查 a 是否存在，且去除空白後是否為空字串
|
||||
if ($link.length && $link.text().trim() === '') {
|
||||
$this.remove(); // 移除外層 .w-annc__subtitle
|
||||
}
|
||||
});
|
||||
//無障礙單位轉換
|
||||
$("[style*='font-size']").each(function() {
|
||||
var fontSize = $(this).css("font-size");
|
||||
if (fontSize.includes("px")) {
|
||||
var pxValue = parseFloat(fontSize); // 取得數值
|
||||
var emValue = pxValue / 16; // 假設 1em = 16px
|
||||
$(this).css("font-size", emValue + "em");
|
||||
}
|
||||
});
|
||||
$("[style*='font-size']").each(function() {
|
||||
var fontSize = $(this).css("font-size");
|
||||
if (fontSize.includes("pt")) {
|
||||
var ptValue = parseFloat(fontSize); // 取得數值
|
||||
var emValue = ptValue / 12; // 1em = 12pt（一般轉換標準）
|
||||
$(this).css("font-size", emValue + "em");
|
||||
}
|
||||
});
|
||||
$("table").each(function() {
|
||||
$(this).find("tr").each(function(rowIndex) {
|
||||
$(this).find("th").each(function(colIndex) {
|
||||
if (rowIndex === 0) {
|
||||
// 第一列的 th，適用於該欄
|
||||
$(this).attr("scope", "col");
|
||||
} else if (colIndex === 0) {
|
||||
// 其他列的第一個 th，適用於該行
|
||||
$(this).attr("scope", "row");
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
$(".banner-pager button").addClass('banner-pagerbtn');
|
||||
$(".banner-pager button").attr("type","button");
|
||||
$(".banner-pager button").append('<span style="display: none;">下一張</span>');
|
||||
$("button").attr("role", "button");
|
||||
$("select").attr("title","選擇類別");
|
||||
$(".jarallax-video-audio").attr("role", "button");
|
||||
$('button').each(function() {
|
||||
var $this = $(this);
|
||||
if (!$this.attr('title') || $this.attr('title').trim() === '') {
|
||||
$this.attr('title', '按鈕');
|
||||
}
|
||||
});
|
||||
$('img').each(function() {
|
||||
var $this = $(this);
|
||||
if (!$this.attr('alt') || $this.attr('alt').trim() === '') {
|
||||
$this.attr('alt', '這是一張圖片');
|
||||
}
|
||||
});
|
||||
$('img').each(function() {
|
||||
var $this = $(this);
|
||||
if (!$this.attr('title') || $this.attr('title').trim() === '') {
|
||||
$this.attr('title', '這是一張圖片');
|
||||
}
|
||||
});
|
||||
$(".w-annc__img-wrap a").each(function () {
|
||||
var $this = $(this);
|
||||
// 確保 <a> 內沒有文字節點 (避免重複添加)
|
||||
if ($this.text().trim() === "") {
|
||||
$this.append('<span class="sr-only">公告圖片</span>');
|
||||
}
|
||||
});
|
||||
$(".widget-link__widget-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">公告標題</span>');
|
||||
}
|
||||
});
|
||||
$(".sitemenu-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">次選單</span>');
|
||||
}
|
||||
});
|
||||
$(".annc-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">內頁公告標題</span>');
|
||||
}
|
||||
});
|
||||
$(".event-annc-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">內頁活動公告標題</span>');
|
||||
}
|
||||
});
|
||||
$(".show-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">內頁活動公告標題</span>');
|
||||
}
|
||||
});
|
||||
$(".w-annc__widget-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">公告標題</span>');
|
||||
}
|
||||
});
|
||||
$(".widget-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">網路資源標題</span>');
|
||||
}
|
||||
});
|
||||
$(".widget-title").each(function () {
|
||||
if ($(this).text().trim() === "") {
|
||||
$(this).append('<span class="sr-only">網路資源標題</span>');
|
||||
}
|
||||
});
|
||||
$('input').each(function() {
|
||||
var $this = $(this);
|
||||
if (!$this.attr('title') || $this.attr('title').trim() === '') {
|
||||
$this.attr('title', '網內搜尋');
|
||||
}
|
||||
});
|
||||
$('.rucaptcha-image').each(function() {
|
||||
var $button = $(this).next('button'); // 取得緊接在 .rucaptcha-image 之後的 button
|
||||
if ($button.length && !$button.attr('aria-label')) {
|
||||
$button.attr('aria-label', '播放驗證碼語音');
|
||||
}
|
||||
});
|
||||
// 幫有連結目的之所有a標籤加上aria-label
|
||||
$('a').each(function() {
|
||||
var $this = $(this);
|
||||
|
||||
// 如果 <a> 已經有 aria-label，則跳過
|
||||
if ($this.attr('aria-label')) return;
|
||||
|
||||
var href = $this.attr('href');
|
||||
if (!href) return; // 如果沒有 href，則跳過
|
||||
|
||||
var ariaLabel = "";
|
||||
|
||||
// 加入開啟方式
|
||||
if ($this.attr('target') === '_self') {
|
||||
ariaLabel += '在本視窗開啟 ';
|
||||
} else if ($this.attr('target') === '_blank') {
|
||||
ariaLabel += '在新視窗開啟 ';
|
||||
}
|
||||
|
||||
// 取得 <a> 的文字內容
|
||||
var linkText = $this.text().trim();
|
||||
if (linkText) {
|
||||
ariaLabel += linkText;
|
||||
} else if ($this.children('span').length === 1) {
|
||||
ariaLabel += $this.children('span').text().trim();
|
||||
}
|
||||
// 如果包含 <i> 圖示，標示為 icon
|
||||
if ($this.find('i').length) {
|
||||
ariaLabel = "這是 icon";
|
||||
}
|
||||
|
||||
// 如果是圖片連結，標示為照片
|
||||
if ($this.find('img').length) {
|
||||
ariaLabel = "這是一張照片";
|
||||
}
|
||||
|
||||
// 設定 aria-label
|
||||
if (ariaLabel) {
|
||||
$this.attr('aria-label', ariaLabel);
|
||||
}
|
||||
});
|
||||
|
||||
// 幫有連結目的之所有a標籤加上title
|
||||
for(var i=0;i<$('a').length;i++){
|
||||
if($('a').eq(i).attr("href") != "" || $('a').eq(i).attr("href") != undefined ){
|
||||
var titlestr="";
|
||||
if($('a').eq(i).attr('target')=='_self')
|
||||
titlestr += '在本視窗開啟 ';
|
||||
else if($('a').eq(i).attr('target') == '_blank')
|
||||
titlestr += '在新視窗開啟 ';
|
||||
if($('a').eq(i).attr('title') == "" || $('a').eq(i).attr('title')==undefined && $('a').eq(i).html().search('</') == -1)
|
||||
titlestr += $('a').eq(i).html().trim();
|
||||
else if($('a').eq(i).attr('title') == "" || $('a').eq(i).attr('title') == undefined && $('a').eq(i).find('>span').length==1)
|
||||
titlestr += $('a').eq(i).find('>span').html().trim();
|
||||
else if($('a').eq(i).attr('title') == "" || $('a').eq(i).attr('title') == undefined){
|
||||
try{
|
||||
if($('a').eq(i).html().trim().split('>').length==2)
|
||||
titlestr += $('a').eq(i).html().trim().split('>')[1].trim();
|
||||
else if($('a').eq(i).html().trim().split('>').length==3)
|
||||
titlestr += $('a').eq(i).html().trim().split('>')[2].trim();
|
||||
}catch(e){};
|
||||
}
|
||||
else
|
||||
titlestr += $('a').eq(i).attr('title');
|
||||
if(titlestr.search('<img') != -1)
|
||||
titlestr = "這是一張照片";
|
||||
if(titlestr != "")
|
||||
$('a').eq(i).attr('title',titlestr);
|
||||
};
|
||||
};
|
||||
$('a').each(function() {
|
||||
var $this = $(this);
|
||||
var href = $this.attr('href');
|
||||
if (!href) return; // 沒有 href 就跳過
|
||||
// 如果 <a> 已經有 title 屬性，則不進行修改
|
||||
if ($this.attr('title')) return;
|
||||
var titlestr = "";
|
||||
// 加入開啟方式
|
||||
if ($this.attr('target') == '_self') {
|
||||
titlestr += '在本視窗開啟 ';
|
||||
} else if ($this.attr('target') == '_blank') {
|
||||
titlestr += '在新視窗開啟 ';
|
||||
}
|
||||
// 決定 title 內容
|
||||
var linkText = $this.text().trim();
|
||||
if (linkText) {
|
||||
titlestr += linkText;
|
||||
} else if ($this.children('span').length == 1) {
|
||||
titlestr += $this.children('span').text().trim();
|
||||
}
|
||||
// 如果是圖片連結，標示為照片
|
||||
if ($this.find('img').length) {
|
||||
titlestr = "這是一張照片";
|
||||
}
|
||||
// 設定 title
|
||||
if (titlestr) {
|
||||
$this.attr('title', titlestr);
|
||||
}
|
||||
});
|
||||
|
||||
// for(var i=0;i<$('a').length;i++){
|
||||
// if($('a').eq(i).attr("href") != "" || $('a').eq(i).attr("href") != undefined ){
|
||||
// var titlestr="";
|
||||
// if($('a').eq(i).attr('target')=='_self')
|
||||
// titlestr += '在本視窗開啟 ';
|
||||
// else if($('a').eq(i).attr('target') == '_blank')
|
||||
// titlestr += '在新視窗開啟 ';
|
||||
// if($('a').eq(i).attr('title') == "" || $('a').eq(i).attr('title')==undefined && $('a').eq(i).html().search('</') == -1)
|
||||
// titlestr += $('a').eq(i).html().trim();
|
||||
// else if($('a').eq(i).attr('title') == "" || $('a').eq(i).attr('title') == undefined && $('a').eq(i).find('>span').length==1)
|
||||
// titlestr += $('a').eq(i).find('>span').html().trim();
|
||||
// else if($('a').eq(i).attr('title') == "" || $('a').eq(i).attr('title') == undefined){
|
||||
// try{
|
||||
// if($('a').eq(i).html().trim().split('>').length==2)
|
||||
// titlestr += $('a').eq(i).html().trim().split('>')[1].trim();
|
||||
// else if($('a').eq(i).html().trim().split('>').length==3)
|
||||
// titlestr += $('a').eq(i).html().trim().split('>')[2].trim();
|
||||
// }catch(e){};
|
||||
// }
|
||||
// else
|
||||
// titlestr += $('a').eq(i).attr('title');
|
||||
// if(titlestr.search('<img') != -1)
|
||||
// titlestr = "這是一張照片";
|
||||
// if(titlestr != "")
|
||||
// $('a').eq(i).attr('title',titlestr);
|
||||
// };
|
||||
// };
|
||||
|
||||
// 刪除banner-slide的空連結和空連結目標
|
||||
for(var i=0;i<$('.w-ba-banner__slide a').length;i++){
|
||||
if($('.w-ba-banner__slide a').eq(i).attr('href')=="")
|
||||
$('.w-ba-banner__slide a').eq(i).removeAttr('href');
|
||||
if($('.w-ba-banner__slide a').eq(i).attr('target') == "")
|
||||
$('.w-ba-banner__slide a').eq(i).removeAttr('target');
|
||||
};
|
||||
// 幫無標題之iframe加上title
|
||||
for(var i=0;i<$('iframe').length;i++)
|
||||
if($('iframe').eq(i).attr('title')=="" || $('iframe').eq(i).attr('title')== undefined ){
|
||||
if($('iframe').eq(i).attr('src').search('facebook') != -1 )
|
||||
$('iframe').eq(i).attr('title','facebook');
|
||||
else if($('iframe').eq(i).attr('src').search('google') != -1 )
|
||||
$('iframe').eq(i).attr('title','google');
|
||||
else if($('iframe').eq(i).attr('src').search('youtube') != -1 )
|
||||
$('iframe').eq(i).attr('title','youtube');
|
||||
else if($('iframe').eq(i).attr('src').search('twitframe') != -1 )
|
||||
$('iframe').eq(i).attr('title','twitter');
|
||||
else
|
||||
$('iframe').eq(i).attr('title','unknown');
|
||||
};
|
||||
// 刪除空的檔案室
|
||||
var archievelen = $('dd a.i-archive-files-item').length;
|
||||
for(i=archievelen-1;i>=0;i--)
|
||||
if($('dd a.i-archive-files-item').eq(i).html().trim()=="")
|
||||
$('dd a.i-archive-files-item').eq(i).parent('dd').remove();
|
||||
for(var i=0;i<$('.w-ba-banner__slide a').length;i++){
|
||||
if($('.w-ba-banner__slide a').eq(i).attr('href')=="")
|
||||
$('.w-ba-banner__slide a').eq(i).removeAttr('href');
|
||||
if($('.w-ba-banner__slide a').eq(i).attr('target') == "")
|
||||
$('.w-ba-banner__slide a').eq(i).removeAttr('target');
|
||||
};
|
||||
// 幫無標題之iframe加上title
|
||||
for(var i=0;i<$('iframe').length;i++)
|
||||
if($('iframe').eq(i).attr('title')=="" || $('iframe').eq(i).attr('title')== undefined ){
|
||||
if($('iframe').eq(i).attr('src').search('facebook') != -1 )
|
||||
$('iframe').eq(i).attr('title','facebook');
|
||||
else if($('iframe').eq(i).attr('src').search('google') != -1 )
|
||||
$('iframe').eq(i).attr('title','google');
|
||||
else if($('iframe').eq(i).attr('src').search('youtube') != -1 )
|
||||
$('iframe').eq(i).attr('title','youtube');
|
||||
else if($('iframe').eq(i).attr('src').search('twitframe') != -1 )
|
||||
$('iframe').eq(i).attr('title','twitter');
|
||||
else
|
||||
$('iframe').eq(i).attr('title','unknown');
|
||||
};
|
||||
//button是空的就加上內容
|
||||
$('button').each(function() {
|
||||
var $this = $(this);
|
||||
var titleText = $this.attr('title') || '';
|
||||
|
||||
// 檢查 button 是否是空的（沒有可見文字或子元素）
|
||||
if ($this.text().trim() === '' && !$this.children().length && titleText) {
|
||||
// 新增隱藏的 span，內容為 title
|
||||
$this.append('<span class="sr-only">' + titleText + '</span>');
|
||||
}
|
||||
});
|
||||
// 刪除空的檔案室
|
||||
var archievelen = $('dd a.i-archive-files-item').length;
|
||||
for(i=archievelen-1;i>=0;i--)
|
||||
if($('dd a.i-archive-files-item').eq(i).html().trim()=="")
|
||||
$('dd a.i-archive-files-item').eq(i).parent('dd').remove();
|
||||
// 刪除具有空連結欄位的橫列
|
||||
for(var i = 0;i < $('*[data-list] tr td a').length ; i++)
|
||||
if($('*[data-list] tr td a').eq(i).html().trim()=="")
|
||||
$('*[data-list] tr td a').eq(i).parent('td').parent('tr').remove();
|
||||
// tab按鍵選到menu,會顯示下層的menu(為了符合無障礙)
|
||||
$('.nav-level-0>li>a').focus(function(e) {
|
||||
for(var i = 0;i < $('*[data-list] tr td a').length ; i++)
|
||||
if($('*[data-list] tr td a').eq(i).html().trim()=="")
|
||||
$('*[data-list] tr td a').eq(i).parent('td').parent('tr').remove();
|
||||
// tab按鍵選到menu,會顯示下層的menu(為了符合無障礙)
|
||||
$('.nav-level-0>li>a').focus(function(e) {
|
||||
e.stopPropagation();
|
||||
$(this).parent().focus();
|
||||
$(this).parent().focus();
|
||||
if ($(this).parent().find('.nav-level-1').hasClass('show')) {
|
||||
} else {
|
||||
$('.nav-level-1').removeClass('show');
|
||||
$(this).parent().find('.nav-level-1').addClass('show');
|
||||
}
|
||||
});
|
||||
$('.nav-level-1>li>a').focus(function(e) {
|
||||
e.stopPropagation();
|
||||
if ($(this).parent().find('.nav-level-2').hasClass('show')) {
|
||||
}else{
|
||||
$('.nav-level-2').removeClass('show');
|
||||
$(this).parent().find('.nav-level-2').addClass('show');
|
||||
}
|
||||
});
|
||||
$('show').parent('li').focus();
|
||||
$('.nav-level-1>li>a').focus(function(e) {
|
||||
e.stopPropagation();
|
||||
if ($(this).parent().find('.nav-level-2').hasClass('show')) {
|
||||
}else{
|
||||
$('.nav-level-2').removeClass('show');
|
||||
$(this).parent().find('.nav-level-2').addClass('show');
|
||||
}
|
||||
});
|
||||
$('show').parent('li').focus();
|
||||
}
|
||||
forFreeGo();
|
||||
|
||||
|
|
@ -550,9 +791,9 @@
|
|||
|
||||
//header banner setting
|
||||
if ( location.href.search('editmode=on') != -1 ) {
|
||||
$('.header-banner').css('z-index','2');
|
||||
} else {
|
||||
$('.header-banner').css({
|
||||
$('.header-banner').css('z-index','2');
|
||||
} else {
|
||||
$('.header-banner').css({
|
||||
'position': 'relative',
|
||||
'top': '0',
|
||||
'z-index': '-2',
|
||||
|
|
@ -632,19 +873,173 @@ extendPanelWidget();
|
|||
|
||||
|
||||
}
|
||||
$(document).ready(function () {
|
||||
if ($(".main-content .video_detail").length > 0) {
|
||||
$('.sitemenu').css("display","none");
|
||||
$('span img[alt="HD"]').parent().hide();
|
||||
$('span img[alt="觀看人數"]').remove();
|
||||
$(".view_info span").each(function () {
|
||||
var text = $(this).text().trim(); // 取得 <span> 裡的文字，去掉前後空格
|
||||
var number = text.replace(/\D/g, ""); // 只保留數字部分
|
||||
if (number) {
|
||||
$(this).text(`・觀看次數：${number}次`); // 更新內容格式
|
||||
}
|
||||
});
|
||||
$(".movie_desc").before('<div class="movietitle"><h4>影片敘述</h4></div>');
|
||||
$(".movie_desc").each(function () {
|
||||
var decodedHtml = $("<div/>").html($(this).text()).html(); // 轉換轉義的 HTML
|
||||
$(this).html(decodedHtml); // 設置為真正的 HTML
|
||||
});
|
||||
$(".video_group_time").each(function () {
|
||||
var $this = $(this); // 當前 .video_group_time
|
||||
// 找到對應的 <q>，並移動到 .video_group_time 內部
|
||||
var $q = $this.closest(".imglst_desc").find(".movie_desc q");
|
||||
if ($q.length) {
|
||||
$this.append($q.clone()); // 將 <q> 複製並添加到 .video_group_time
|
||||
$q.remove(); // 移除 .movie_desc 裡的 <q>
|
||||
}
|
||||
// 移動 .view_info 到 .video_group_time 的內部
|
||||
$this.append($this.siblings(".view_info"));
|
||||
// 取得內容並移除 "SystemAdmin | " 前綴
|
||||
var text = $this.text().trim();
|
||||
var newText = text.replace(/^.*\|\s*/, ""); // 移除 "SystemAdmin | "
|
||||
$this.text(newText); // 更新內容
|
||||
$(this).insertBefore($(this).closest(".imglst_desc").siblings("h3"));
|
||||
});
|
||||
|
||||
$(".main-content").css({
|
||||
"max-width": "920px",
|
||||
"margin": "auto"
|
||||
});
|
||||
$(".video_box_wrap").css("padding-bottom", "56%");
|
||||
|
||||
$(".video_yt_box").insertBefore(".video_group_time");
|
||||
|
||||
};
|
||||
function getYouTubeThumbnail() {
|
||||
var $ytThumb = $(".ytp-cued-thumbnail-overlay-image");
|
||||
if ($ytThumb.length) {
|
||||
var imageUrl = $ytThumb.css("background-image");
|
||||
// 檢查背景圖格式：url("https://...")
|
||||
var urlMatch = imageUrl.match(/url\(["']?(.*?)["']?\)/);
|
||||
var extractedUrl = urlMatch ? urlMatch[1] : null;
|
||||
if (extractedUrl) {
|
||||
// console.log("成功獲取縮圖:", extractedUrl);
|
||||
$(".background").css("background-image", `url("${extractedUrl}")`);
|
||||
} else {
|
||||
// console.log("背景圖格式不對，改用影片 ID 生成縮圖");
|
||||
setThumbnailFromVideoId();
|
||||
}
|
||||
} else {
|
||||
// console.log("找不到 .ytp-cued-thumbnail-overlay-image，改用影片 ID 生成縮圖");
|
||||
setThumbnailFromVideoId();
|
||||
}
|
||||
}
|
||||
function setThumbnailFromVideoId() {
|
||||
var $iframe = $("iframe[src*='youtube.com/embed']");
|
||||
if ($iframe.length) {
|
||||
var src = $iframe.attr("src");
|
||||
var videoIdMatch = src.match(/youtube\.com\/embed\/([^?]+)/);
|
||||
var videoId = videoIdMatch ? videoIdMatch[1] : null;
|
||||
|
||||
if (videoId) {
|
||||
var fallbackImageUrl = `https://img.youtube.com/vi/${videoId}/maxresdefault.jpg`;
|
||||
// console.log("透過影片 ID 取得縮圖:", fallbackImageUrl);
|
||||
$(".background").css("background-image", `url("${fallbackImageUrl}")`);
|
||||
}
|
||||
}
|
||||
}
|
||||
// 嘗試多次加載
|
||||
var interval = setInterval(function () {
|
||||
if ($(".ytp-cued-thumbnail-overlay-image").length || $("iframe[src*='youtube.com/embed']").length) {
|
||||
getYouTubeThumbnail();
|
||||
clearInterval(interval);
|
||||
}
|
||||
}, 1000);
|
||||
});
|
||||
// 當文件物件模型(DOM)載入後，執行init函數
|
||||
$(document).ready(function() {
|
||||
function adjustSlideWidth() {
|
||||
var $container = $(".container");
|
||||
var $list = $(".w-annc__list");
|
||||
var $items = $(".w-annc__item");
|
||||
|
||||
var containerWidth = $container.width(); // 獲取容器寬度
|
||||
var slidesVisible = parseInt($list.attr("data-cycle-carousel-visible")) || 4; // 讀取可見數量 (預設4)
|
||||
var itemMargin = parseFloat($items.css("margin-left")) + parseFloat($items.css("margin-right")); // 計算 margin
|
||||
|
||||
// 計算 w-annc__item 的寬度 (確保總寬度不超過 .container)
|
||||
var itemWidth = (containerWidth / slidesVisible) - itemMargin;
|
||||
|
||||
// 更新 w-annc__item 的寬度
|
||||
$items.css({
|
||||
"width": itemWidth + "px",
|
||||
"box-sizing": "border-box"
|
||||
});
|
||||
}
|
||||
|
||||
// 初次載入時調整
|
||||
adjustSlideWidth();
|
||||
|
||||
// 監聽視窗大小變化
|
||||
$(window).resize(adjustSlideWidth);
|
||||
$(window).on("load", function () {
|
||||
var $carouselWrap = $(".cycle-carousel-wrap");
|
||||
var $carouselList = $(".w-annc__list");
|
||||
|
||||
// 取得 data-cycle-carousel-visible 的數值
|
||||
var slidesVisible = parseInt($carouselList.attr("data-cycle-carousel-visible")) || 4;
|
||||
|
||||
// 取得 .w-annc__item 的寬度
|
||||
var itemWidth = $(".w-annc__item").outerWidth(true); // 包含 margin
|
||||
|
||||
// 計算正確的 left 位置，確保第一個 item 不會被切掉
|
||||
var newLeft = -(itemWidth * Math.floor(slidesVisible / 2));
|
||||
|
||||
// 如果 newLeft 是負的，則修正為 0（避免完全消失）
|
||||
if (newLeft < 0) newLeft = 0;
|
||||
|
||||
// 更新 cycle-carousel-wrap 的位置
|
||||
$carouselWrap.css("left", newLeft + "px");
|
||||
});
|
||||
|
||||
//背景widget設定
|
||||
if ( location.href.search('editmode=on') != -1 ) {
|
||||
$('.background').css('z-index','2');
|
||||
$('.background').css('position','relative');
|
||||
} else {
|
||||
$('.background').css('z-index','-1');
|
||||
$('.background').css('position','fixed');
|
||||
};
|
||||
|
||||
// 綁定滑動事件
|
||||
$(".cycle-slideshow").swipe({
|
||||
swipeLeft: function () {
|
||||
$(this).cycle("next"); // 向左滑動，切換到下一張
|
||||
},
|
||||
swipeRight: function () {
|
||||
$(this).cycle("prev"); // 向右滑動，切換到上一張
|
||||
},
|
||||
threshold: 50, // 滑動靈敏度（數值越小越敏感）
|
||||
});
|
||||
//改變日期格式
|
||||
$(".video_group_time").each(function () {
|
||||
var $this = $(this);
|
||||
var originalText = $this.text().trim(); // 取得原始內容
|
||||
// 正則表達式匹配 YYYY-MM-DD 格式的日期
|
||||
var formattedText = originalText.replace(/(\d{4})-(\d{2})-(\d{2})/g, function (match, year, month, day) {
|
||||
return parseInt(month, 10) + "月" + parseInt(day, 10) + "日";
|
||||
});
|
||||
$this.text(formattedText); // 更新內容
|
||||
});
|
||||
|
||||
$(".video_group_time").each(function () {
|
||||
var $this = $(this); // 當前 .video_group_time
|
||||
var $q = $this.closest(".video_data").find(".video_desc q").clone(); // 找到對應的 q
|
||||
if ($q.length) {
|
||||
$this.append($q); // 只加上對應的 q
|
||||
}
|
||||
});
|
||||
//常用到的js
|
||||
// $('.').after($('.'));
|
||||
// $('.').before($('.'));
|
||||
// $('.').append($('.'));
|
||||
// if($('.show-announcement').hasClass('show-announcement')) {
|
||||
// $('.').css('', '');
|
||||
// }
|
||||
$(".mybooking").append('<i class="fa-solid fa-circle-user"></i>');
|
||||
//內頁dattpp移位
|
||||
$('.i-annc__page-title').after($('.sitemenu-wrap2'));
|
||||
$('.i-archive-title').after($('.sitemenu-wrap2'));
|
||||
$('.page-module-title').after($('.sitemenu-wrap2'));
|
||||
|
|
@ -655,24 +1050,31 @@ extendPanelWidget();
|
|||
$(".member-data2-tr").before($(".show-member .table-striped > tbody > tr:nth-of-type(4)"));
|
||||
$(".nav-pills").before($(".show-member .table-striped > tbody > tr:last-child"));
|
||||
|
||||
//常用到的js
|
||||
// $('.').after($('.'));
|
||||
// $('.').before($('.'));
|
||||
// $('.').append($('.'));
|
||||
// if($('.show-announcement').hasClass('show-announcement')) {
|
||||
// $('.').css('', '');
|
||||
// }
|
||||
|
||||
|
||||
//檔案室手風琴
|
||||
$('.panel-title>.collapsed').click(function(){
|
||||
$(this).find('.fa').toggleClass("fa-chevron-down");
|
||||
$(this).find('.fa').toggleClass("fa-chevron-up");
|
||||
});
|
||||
|
||||
//背景widget設定
|
||||
if ( location.href.search('editmode=on') != -1 ) {
|
||||
$('.background').css('z-index','2');
|
||||
$('.background').css('position','relative');
|
||||
} else {
|
||||
$('.background').css('z-index','-1');
|
||||
$('.background').css('position','fixed');
|
||||
};
|
||||
//公告類別顏色
|
||||
$(".w-annc .w-annc__category-wrap").each(function() {
|
||||
var SaveCategory = $(this).find(".w-annc__category").text();
|
||||
$(this).addClass(SaveCategory);
|
||||
})
|
||||
$(".w-annc__item ").each(function() {
|
||||
var SaveCategory2 = $(this).find(".w-annc__category").text();
|
||||
$(this).addClass(SaveCategory2);
|
||||
})
|
||||
// $(".w-annc .w-annc__category-wrap").each(function() {
|
||||
// var SaveCategory = $(this).find(".w-annc__category").text();
|
||||
// $(this).addClass(SaveCategory);
|
||||
// })
|
||||
// $(".w-annc__item ").each(function() {
|
||||
// var SaveCategory2 = $(this).find(".w-annc__category").text();
|
||||
// $(this).addClass(SaveCategory2);
|
||||
// })
|
||||
$(".i-annc__item .i-annc__category-wrap").each(function() {
|
||||
var SaveCategory = $(this).find(".i-annc__category").text();
|
||||
$(this).addClass(SaveCategory);
|
||||
|
|
@ -723,7 +1125,7 @@ extendPanelWidget();
|
|||
$("nav ul").toggleClass('hidden');
|
||||
});
|
||||
$('.morebken').click(function(){
|
||||
$('.list-unstyled>li:nth-child(n+16)').slideToggle();
|
||||
$('.list-unstyled>li:nth-child(n+5)').slideToggle();
|
||||
$(".morebken .fa-chevron-down").toggleClass("rotate");
|
||||
$(".openmorebken").toggleClass("closemorebken");
|
||||
|
||||
|
|
@ -768,8 +1170,11 @@ extendPanelWidget();
|
|||
// $('.outdropdowns').removeClass('navFixed'); /* 移除選單固定效果 */
|
||||
// }
|
||||
// });
|
||||
$('.navbar-brand h2').replaceWith(function () {
|
||||
return "<h1>" +$(this).html() + "</h1>";
|
||||
$('.navbar-brand h2').replaceWith(function() {
|
||||
return $("<h1>", {
|
||||
class: this.className,
|
||||
html: $(this).html()
|
||||
});
|
||||
});
|
||||
$('#search'). attr('title', '另開新視窗');
|
||||
$(window).scroll(function() {
|
||||
|
|
@ -829,15 +1234,15 @@ extendPanelWidget();
|
|||
// // //選單
|
||||
// $(document).ready(function() {
|
||||
//
|
||||
// //drop down menu
|
||||
// $(".dropdown-toggle").hover(function() {
|
||||
// $('.modules-menu-level-1').addClass('display-on');
|
||||
// });
|
||||
// $(".dropdown-toggle").mouseleave(function() {
|
||||
// $('.modules-menu-level-1').removeClass('display-on');
|
||||
// });
|
||||
// //drop down menu
|
||||
// $(".dropdown-toggle").hover(function() {
|
||||
// $('.modules-menu-level-1').addClass('display-on');
|
||||
// });
|
||||
// $(".dropdown-toggle").mouseleave(function() {
|
||||
// $('.modules-menu-level-1').removeClass('display-on');
|
||||
// });
|
||||
//
|
||||
// });
|
||||
// });
|
||||
// $(document).ready(function() {
|
||||
//
|
||||
// "use strict";
|
||||
|
|
|
|||
|
|
@ -120,7 +120,11 @@ a.btn-primary {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
// Take care of exceeding content
|
||||
// body[data-module="page_content"],
|
||||
// body[data-module="announcement"] {
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ $theme-red: #d20001;
|
|||
$theme-blue: #003d7e;
|
||||
|
||||
$theme-color-main: #333333;
|
||||
$theme-color-second:#1a1b20;
|
||||
$theme-color-second:#1273eb;
|
||||
$theme-color-third: #1273eb;
|
||||
$theme-color-green: #32D9C3;
|
||||
$theme-color-hover:#1e71c1;
|
||||
|
|
@ -41,15 +41,27 @@ $font-h5: 1.2rem;
|
|||
$font-h6: 1rem;
|
||||
h1{
|
||||
font-size:2.5rem;
|
||||
@media(max-width:$screen-xs){
|
||||
font-size:2rem;
|
||||
}
|
||||
}
|
||||
h2{
|
||||
font-size: 2rem;
|
||||
@media(max-width:$screen-xs){
|
||||
font-size:1.8rem;
|
||||
}
|
||||
}
|
||||
h3{
|
||||
font-size:1.8rem;
|
||||
@media(max-width:$screen-xs){
|
||||
font-size:1.6rem;
|
||||
}
|
||||
}
|
||||
h4{
|
||||
font-size: 1.5rem;
|
||||
@media(max-width:$screen-xs){
|
||||
font-size:1.3rem;
|
||||
}
|
||||
}
|
||||
h5{
|
||||
font-size: 1.2rem;
|
||||
|
|
|
|||
|
|
@ -9,12 +9,11 @@
|
|||
.verticalhome{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background-color: #F8F9FA;
|
||||
overflow: hidden;
|
||||
}
|
||||
.internal-page{
|
||||
.layout-content{
|
||||
background: #F8F9FA;
|
||||
background: transparent;
|
||||
padding-bottom: 4em;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,6 +9,10 @@
|
|||
padding: 2em 0;
|
||||
color: $theme-color-main;
|
||||
font-size: 0.8125em;
|
||||
.footer-updated-date{
|
||||
clear: both;
|
||||
padding-left: 1em;
|
||||
}
|
||||
ul{
|
||||
padding: 0;
|
||||
}
|
||||
|
|
@ -54,6 +58,8 @@
|
|||
font-size: 0.8125em;
|
||||
border: #e0e0e0 1px solid;
|
||||
padding: 0.5em 1em;
|
||||
display: inline-block;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.fatfooter{
|
||||
display: none;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,13 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
.fc-cal-date-selected-fusion {
|
||||
font-size: 1em!important;
|
||||
}
|
||||
.outdropdowns{
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 0.5em 0;
|
||||
}
|
||||
.header-nav {
|
||||
ul{
|
||||
|
|
@ -25,7 +29,7 @@
|
|||
outline: 0.3125em auto -webkit-focus-ring-color !important;
|
||||
}
|
||||
.layout-header {
|
||||
z-index: 2;
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
border: none;
|
||||
|
|
@ -45,13 +49,19 @@
|
|||
}
|
||||
.header-banner { overflow: hidden; }
|
||||
.header-nav {
|
||||
padding:1em 0 0 0;
|
||||
color: $theme-color-main;
|
||||
font-family: $main-font;
|
||||
text-transform:uppercase;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
background: #f5f5f5;
|
||||
padding:0;
|
||||
|
||||
>.container{
|
||||
color: $theme-color-main;
|
||||
font-family: $main-font;
|
||||
text-transform:uppercase;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
padding-right: 0.9375em;
|
||||
padding-left: 0.9375em;
|
||||
}
|
||||
@media(max-width: 820px){
|
||||
justify-content: space-between;
|
||||
padding:0;
|
||||
|
|
@ -67,17 +77,16 @@
|
|||
padding: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
color: $theme-color-main;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $theme-color-main;
|
||||
text-decoration: none;
|
||||
padding: 15px;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
@media (min-width:1025px) {
|
||||
margin-bottom: -4em;
|
||||
// margin-bottom: -4em;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
|
@ -108,11 +117,10 @@
|
|||
margin:0;
|
||||
line-height: 3.75em;
|
||||
h1{
|
||||
margin-top: 1em;
|
||||
font-size: 1.2em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #155E75;
|
||||
color:#1a66b1;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,20 +14,28 @@
|
|||
iframe{
|
||||
border: none;
|
||||
}
|
||||
.jp-video{
|
||||
border:0;
|
||||
}
|
||||
.w-ba-banner {
|
||||
position: relative;
|
||||
height: fit-content !important;
|
||||
|
||||
.cursor {
|
||||
cursor: pointer;
|
||||
}
|
||||
.w-ad-banner__caption{
|
||||
@media(max-width:768px){
|
||||
h3{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.w-ba-banner__wrap {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.w-ba-banner__slide {
|
||||
|
|
@ -55,23 +63,34 @@ iframe{
|
|||
.banner-pager {
|
||||
@include list-reset;
|
||||
position: absolute;
|
||||
bottom: 0.5rem;
|
||||
bottom: 0.5rem!important;
|
||||
z-index: 200;
|
||||
text-align:center;
|
||||
width: 100%;
|
||||
li {
|
||||
display: inline-block;
|
||||
height: 3px;
|
||||
width: 4%;
|
||||
|
||||
// height: 3px;
|
||||
// width: 4%;
|
||||
// margin: 0 2px;
|
||||
cursor: pointer;
|
||||
margin: 0 2px;
|
||||
display: inline-block;
|
||||
width:auto!important;
|
||||
}
|
||||
|
||||
button {
|
||||
background: hsla(0,0%,100%,.4);
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
border: unset;
|
||||
// background: hsla(0,0%,100%,.4);
|
||||
// width: 100%;
|
||||
// height: 3px;
|
||||
// border: unset;
|
||||
background: white !important;
|
||||
display: inline-block;
|
||||
margin-right: 0.25em;
|
||||
width: 0.8em !important;
|
||||
height: 0.8em !important;
|
||||
border-radius: 50%;
|
||||
opacity: .5;
|
||||
cursor: pointer;
|
||||
border: 0;
|
||||
}
|
||||
.active-slide button {
|
||||
opacity: 1;
|
||||
|
|
@ -98,7 +117,7 @@ iframe{
|
|||
position: absolute;
|
||||
right: 1em;
|
||||
top: 3%;
|
||||
z-index: 99;
|
||||
z-index:101;
|
||||
a {
|
||||
display: inline-block;
|
||||
margin-right: 0.25em;
|
||||
|
|
@ -147,7 +166,7 @@ ul.button-mid{
|
|||
top: 50%;
|
||||
position: absolute;
|
||||
transform: translateY(-50%);
|
||||
z-index: 99;
|
||||
z-index: 100;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0,0,0,0.1);
|
||||
|
|
@ -169,7 +188,7 @@ ul.button-mid{
|
|||
top: 50%;
|
||||
position: absolute;
|
||||
transform: translateY(-50%);
|
||||
z-index: 99;
|
||||
z-index: 100;
|
||||
&:hover {
|
||||
background: rgba(0,0,0,0.1);
|
||||
}
|
||||
|
|
@ -215,18 +234,13 @@ ul.button-mid{
|
|||
}
|
||||
.ad-overlay{
|
||||
text-align: center;
|
||||
padding-top: 20%;
|
||||
position: relative;
|
||||
background: none;
|
||||
color: #fff;
|
||||
z-index: 100;
|
||||
z-index: 99;
|
||||
padding-left: 10%;
|
||||
padding-right: 10%;
|
||||
// text-shadow: 1px 1px 1px #0000008c;
|
||||
@media screen and (min-width:$screen-xs) and (max-width:1025px){
|
||||
padding-top: 30%;
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
padding-top: 60%;
|
||||
}
|
||||
}
|
||||
img{
|
||||
position: fixed;
|
||||
|
|
@ -271,7 +285,7 @@ ul.button-mid{
|
|||
}
|
||||
@media(max-width: $screen-xs){
|
||||
.ad-overlay{
|
||||
top: 17%;
|
||||
top: 35%;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
|
@ -368,22 +382,20 @@ ul.button-mid{
|
|||
|
||||
}
|
||||
|
||||
// specific style for youtube widget
|
||||
.ba-banner-widget-youtube {
|
||||
.cycle-slide-active {
|
||||
z-index: 101 !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//Widget 5
|
||||
.ba-banner-widget-5 {
|
||||
background: url(/assets/BANNER-BG-01.jpg) 0 0 no-repeat;
|
||||
.slide-img { padding: 1rem 1.5rem; }
|
||||
margin: 1em 0;
|
||||
.slide-img {
|
||||
@media(min-width:769px){
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.slide-content {
|
||||
z-index: 200;
|
||||
font-family: $main-font;
|
||||
padding-top: 0.5rem;
|
||||
padding-left: 0;
|
||||
padding: 1em 7em 1em 1em;
|
||||
|
||||
h3 {
|
||||
font-size: 1rem;
|
||||
|
|
@ -396,14 +408,9 @@ ul.button-mid{
|
|||
word-break: break-all;
|
||||
font-size: 1rem;
|
||||
color: #373634;
|
||||
padding: 0 2em 0.5em 0;
|
||||
}
|
||||
}
|
||||
.controlplay { display: none; }
|
||||
.banner-pager {
|
||||
right: 1rem;
|
||||
top: 0;
|
||||
width: unset;
|
||||
li { height: unset; width: unset; }
|
||||
a { background: #a0d2f3;}
|
||||
}
|
||||
|
|
@ -474,6 +481,7 @@ ul.button-mid{
|
|||
display: none;
|
||||
}
|
||||
.banner-overlay {
|
||||
border-bottom: 3px solid $theme-color-second;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
visibility: unset !important;
|
||||
|
|
@ -491,7 +499,12 @@ ul.button-mid{
|
|||
}
|
||||
p{
|
||||
padding: 0 0.2em;
|
||||
border-bottom: 3px solid $theme-color-second;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,6 +8,10 @@
|
|||
|
||||
// Announcement widget
|
||||
// ## Gerneral styles for widgets
|
||||
.VivaTimeline{
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
}
|
||||
.w-annc__table{
|
||||
// border: 0.0625em solid #ddd !important;
|
||||
.w-annc__th{
|
||||
|
|
@ -425,9 +429,6 @@
|
|||
|
||||
.w-annc__title{
|
||||
color: #fff;
|
||||
@media(min-width:1920px){
|
||||
font-size: 1.6rem!important;
|
||||
}
|
||||
}
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
|
|
@ -685,9 +686,6 @@
|
|||
|
||||
.w-annc__title{
|
||||
color: #fff;
|
||||
@media(min-width:1920px){
|
||||
font-size: 1.6rem!important;
|
||||
}
|
||||
}
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
|
|
@ -971,6 +969,347 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
// Widget-23
|
||||
.widget-announcement-23 {
|
||||
.w-annc__list{
|
||||
flex-wrap: wrap;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.w-annc__item{
|
||||
@media(min-width:769px){
|
||||
margin: 0.5em;
|
||||
width: calc(25% - 1em)!important;
|
||||
}
|
||||
}
|
||||
.w-annc__item:first-child{
|
||||
@media(min-width:769px){
|
||||
width: calc(50% - 1em)!important;
|
||||
}
|
||||
}
|
||||
.w-annc__item:nth-child(2){
|
||||
@media(min-width:769px){
|
||||
width: calc(50% - 1em)!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
}
|
||||
.w-annc__img-wrap {
|
||||
margin-bottom: 0.5em;
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
.w-annc__img{
|
||||
width: 100%;
|
||||
position: relative !important;
|
||||
}
|
||||
}
|
||||
.w-annc__item{
|
||||
margin-bottom: 1em;
|
||||
padding: 0;
|
||||
background-color: transparent!important;
|
||||
&:hover{
|
||||
.w-annc__img{
|
||||
-webkit-transition: .3s ease-out;
|
||||
-moz-transition: .3s ease-out;
|
||||
-ms-transition: .3s ease-out;
|
||||
-o-transition: .3s ease-out;
|
||||
transition: .3s ease-out;
|
||||
filter: brightness(40%);
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__entry-title{
|
||||
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.w-annc__meta{
|
||||
padding: 1em;
|
||||
display: none;
|
||||
}
|
||||
.w-annc__entry-title{
|
||||
padding: 0 1em;
|
||||
}
|
||||
}
|
||||
// Widget-24
|
||||
.widget-announcement-24 {
|
||||
.cycle-carousel-wrap{
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
}
|
||||
.w-annc__entry-title{
|
||||
margin: 0;
|
||||
}
|
||||
.w-annc__meta i{
|
||||
color: #fff!important;
|
||||
}
|
||||
.w-annc__list{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
}
|
||||
.w-annc__widget-title { text-align: center; }
|
||||
.w-annc__more { margin-top: 1.5em; }
|
||||
.w-annc__list > .w-annc__item:nth-child(3n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.w-annc__img-wrap {
|
||||
margin:0;
|
||||
height: auto;
|
||||
}
|
||||
.w-annc__content-wrap{
|
||||
padding: 1.5em;
|
||||
div{
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-box-decoration-break: clone;
|
||||
box-decoration-break: clone;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
.clearfix{
|
||||
// text-align: center;
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
}
|
||||
.w-annc__subtitle {
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.w-annc__content-wrap {
|
||||
display: inline-block;
|
||||
&:after {
|
||||
content: '';
|
||||
display: block;
|
||||
margin-top: 5px;
|
||||
height: 4px;
|
||||
width: 0;
|
||||
background: transparent;
|
||||
transition: width .5s ease, background-color .5s ease;
|
||||
}
|
||||
}
|
||||
.w-annc__item{
|
||||
-webkit-transition: .3s all ease;
|
||||
-o-transition: .3s all ease;
|
||||
transition: .3s all ease;
|
||||
padding-bottom: 1em;
|
||||
@media (max-width: $screen-xs) {
|
||||
margin: 0;
|
||||
}
|
||||
&:hover{
|
||||
-webkit-transition: all .3s ease;
|
||||
-moz-transition: all .3s ease;
|
||||
-ms-transition: all .3s ease;
|
||||
-o-transition: all .3s ease;
|
||||
transition: all .3s ease;
|
||||
.w-annc__content-wrap:after{
|
||||
width: 100%;
|
||||
background: #f2f2f2;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__item{
|
||||
@media(max-width: $screen-xs){
|
||||
|
||||
}
|
||||
&:hover{
|
||||
-webkit-transform: translateY(-6px);
|
||||
-ms-transform: translateY(-6px);
|
||||
transform: translateY(-6px);
|
||||
|
||||
.w-annc__img-wrap{
|
||||
box-shadow: 0 12px 24px #0000004d, 0 10px 10px #00000033;
|
||||
-webkit-box-shadow: 0 12px 24px #0000004d, 0 10px 10px #00000033;
|
||||
}
|
||||
img{
|
||||
// transform: scale(1.2)!important;
|
||||
// -webkit-transition: .3s ease-out;
|
||||
// -moz-transition: .3s ease-out;
|
||||
// -ms-transition: .3s ease-out;
|
||||
// -o-transition: .3s ease-out;
|
||||
// transition: .3s ease-out;
|
||||
}
|
||||
.transitionfade{
|
||||
height: inherit;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(0,0,0,.4);
|
||||
-webkit-transition: .3s ease-out;
|
||||
-moz-transition: .3s ease-out;
|
||||
-ms-transition: .3s ease-out;
|
||||
-o-transition: .3s ease-out;
|
||||
transition: .3s ease-out;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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 {
|
||||
img{
|
||||
// height: 100% !important;
|
||||
width:100%!important;
|
||||
// max-width: unset;
|
||||
// position: relative !important;
|
||||
// margin: 0 !important;
|
||||
// transform: translateX(-7%);
|
||||
@media(max-width:767px){
|
||||
height: 100% !important;
|
||||
width:auto!important;
|
||||
max-width: unset;
|
||||
position: relative !important;
|
||||
margin: 0 !important;
|
||||
transform: translateX(-7%);
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__item{
|
||||
padding: 0;
|
||||
margin-right: 0.5em;
|
||||
margin-left: 0.5em;
|
||||
margin-bottom: 1em;
|
||||
overflow: hidden;
|
||||
position: relative !important;
|
||||
@media(min-width:768px){
|
||||
&:nth-child(1){
|
||||
width: calc(200% / 3 - 1em)!important;
|
||||
}
|
||||
&:nth-child(2){
|
||||
width: calc(100% / 3 - 1em)!important;
|
||||
}
|
||||
&:nth-child(3){
|
||||
width: calc(100% / 3 - 1em)!important;
|
||||
}
|
||||
&:nth-child(4){
|
||||
width: calc(200% / 3 - 1em)!important;
|
||||
}
|
||||
}
|
||||
@media(max-width:767px){
|
||||
|
||||
&:nth-child(2){
|
||||
width: calc(100% / 2 - 1em) !important;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
&:nth-child(3){
|
||||
width: calc(100% / 2 - 1em) !important;
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $screen-xs){
|
||||
width: 100% !important;
|
||||
}
|
||||
@media(min-width: 1600px){
|
||||
height: 20em;
|
||||
.w-annc__img-wrap{
|
||||
height: 20em;
|
||||
}
|
||||
}
|
||||
@media(min-width: 821px)and(max-width: 1599px){
|
||||
height: 20em;
|
||||
.w-annc__img-wrap{
|
||||
height: 20em;
|
||||
}
|
||||
}
|
||||
@media(min-width: $screen-xs)and(max-width: 820px){
|
||||
height: 16em;
|
||||
.w-annc__img-wrap{
|
||||
height: 16em;
|
||||
}
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
height: 16em;
|
||||
.w-annc__img-wrap{
|
||||
height: 16em;
|
||||
}
|
||||
}
|
||||
}
|
||||
li{
|
||||
&:hover{
|
||||
.card:before{
|
||||
height:100%;
|
||||
}
|
||||
.w-annc__subtitle{
|
||||
max-height: 100px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
position: relative;
|
||||
}
|
||||
.card{
|
||||
position: absolute;
|
||||
z-index:0;
|
||||
padding: 20px 25px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: transparent;
|
||||
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%);
|
||||
width: 100%;
|
||||
}
|
||||
.card:before{
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
background-color: $theme-color-second;
|
||||
z-index: -1;
|
||||
-webkit-transition: height .6s;
|
||||
transition: height .6s;
|
||||
}
|
||||
}
|
||||
// Widget-5
|
||||
.widget-announcement-5 {
|
||||
.w-annc__title {
|
||||
|
|
@ -1374,6 +1713,9 @@
|
|||
}
|
||||
//Widget 16
|
||||
.widget-announcement-16 {
|
||||
.w-annc__img{
|
||||
width: 100%;
|
||||
}
|
||||
.w-annc__content-wrap{
|
||||
padding: 1em;
|
||||
}
|
||||
|
|
@ -1388,7 +1730,6 @@
|
|||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
}
|
||||
.w-annc__item { padding: 0; }
|
||||
.w-annc__img-wrap {
|
||||
margin: 0 0 0.5rem 0;
|
||||
}
|
||||
|
|
@ -1694,7 +2035,7 @@
|
|||
.i-annc__img-wrap {
|
||||
overflow: hidden;
|
||||
height: 14.5em;
|
||||
margin: 0 0 1em 0;
|
||||
margin: 1em 0.5em;
|
||||
@media (max-width:$screen-xs) {
|
||||
height: 7em;
|
||||
}
|
||||
|
|
@ -1730,7 +2071,7 @@
|
|||
// box-shadow: #0000004d 0 0 4px;
|
||||
// background: #fff;
|
||||
@media(min-width: $screen-xs){
|
||||
float: left;
|
||||
// float: left;
|
||||
}
|
||||
&:hover{
|
||||
// border: 1px solid $theme-color-second;
|
||||
|
|
@ -1946,6 +2287,9 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl
|
|||
}
|
||||
// Index-7
|
||||
.index-announcement-7 {
|
||||
.i-annc__item{
|
||||
border:0;
|
||||
}
|
||||
.i-annc__list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -1954,18 +2298,12 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl
|
|||
font-family: $main-font;
|
||||
}
|
||||
.i-annc__list > .i-annc__item {
|
||||
margin-right: 0.9375em;
|
||||
width: calc( 100%/3 - 1.5em );
|
||||
margin-bottom: 1em;
|
||||
border-bottom: 0;
|
||||
@media (max-width:767px) {
|
||||
width: calc( 100%/2 - 1.25em );
|
||||
min-height: unset;
|
||||
margin: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
width:calc( 100%/3);
|
||||
@media (max-width: $screen-xs) {
|
||||
width: 100%!important;
|
||||
min-height: unset;
|
||||
margin: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1973,11 +2311,13 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl
|
|||
clear: both;
|
||||
|
||||
}
|
||||
|
||||
.i-annc__content-wrap{
|
||||
margin: 0.5em;
|
||||
}
|
||||
.i-annc__img-wrap {
|
||||
overflow: hidden;
|
||||
height: 12.5em;
|
||||
margin: 0 0 1em 0;
|
||||
margin: 1em 0.5em;
|
||||
img {
|
||||
@media (max-width:767px) {
|
||||
transform: scale(1) !important;
|
||||
|
|
@ -1995,12 +2335,9 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl
|
|||
font-family: $main-font;
|
||||
}
|
||||
.i-annc__list > .i-annc__item {
|
||||
width: calc( 100%/4 - 1.5em );
|
||||
margin-bottom: 1em;
|
||||
margin-right: 0.5em;
|
||||
margin-left: 0.5em;
|
||||
width: calc( 100%/4);
|
||||
@media (max-width:767px) {
|
||||
width: calc( 100%/2 - 1.25em );
|
||||
width: calc( 100%/2);
|
||||
min-height: unset;
|
||||
margin: 0;
|
||||
margin-bottom: 1em;
|
||||
|
|
@ -2018,7 +2355,7 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl
|
|||
.i-annc__img-wrap {
|
||||
overflow: hidden;
|
||||
height: 12.5em;
|
||||
margin: 0 0 1em 0;
|
||||
margin: 1em 0.5em;
|
||||
img {
|
||||
@media (max-width:767px) {
|
||||
transform: scale(1) !important;
|
||||
|
|
@ -2754,7 +3091,7 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl
|
|||
.i-annc__img-wrap {
|
||||
overflow: hidden;
|
||||
height: 14.5em;
|
||||
margin: 0 0 1em 0;
|
||||
margin: 1em 0.5em;
|
||||
@media (max-width:$screen-xs) {
|
||||
height: 7em;
|
||||
}
|
||||
|
|
@ -2774,223 +3111,3 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl
|
|||
padding: 0;
|
||||
}
|
||||
}
|
||||
.video_data-widget-1{
|
||||
.video_info{
|
||||
margin:0.5em 0;
|
||||
}
|
||||
}
|
||||
.video_title {
|
||||
clear: both;
|
||||
}
|
||||
.video_data{
|
||||
list-style: none;
|
||||
}
|
||||
.video_tag{
|
||||
display: flex;
|
||||
float: left;
|
||||
}
|
||||
.view_info{
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.video_group_time{
|
||||
clear: both;
|
||||
}
|
||||
.video_group_time{
|
||||
color: $theme-color-main!important;
|
||||
}
|
||||
.video_tag{
|
||||
color: #fff!important;
|
||||
background: #626262;
|
||||
padding: 4px 8px;
|
||||
border-radius: 5px;
|
||||
margin: 0.5em 0.5em 0.5em 0;
|
||||
}
|
||||
.video_title {
|
||||
clear: both;
|
||||
height: 3em;
|
||||
}
|
||||
.video_data_wrap{
|
||||
padding-right: 0.4375em;
|
||||
padding-left: 0.4375em;
|
||||
}
|
||||
.imglst_desc{
|
||||
margin: 1em 0;
|
||||
}
|
||||
.category_box {
|
||||
padding: 0;
|
||||
border: 1px solid #6868688f;
|
||||
border-radius: 0.5em 0 0 0.5em;
|
||||
overflow: hidden;
|
||||
}
|
||||
.search_box{
|
||||
padding: 0;
|
||||
border-radius: 0 0.5em 0.5em 0;
|
||||
overflow: hidden;
|
||||
border: 1px solid #6868688f;
|
||||
}
|
||||
.video_linkwrapper{
|
||||
position:relative;
|
||||
height: 12em;
|
||||
overflow:hidden;
|
||||
width: 100%;
|
||||
border-radius: 1em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-6px);
|
||||
width: 100%;
|
||||
}
|
||||
@media(max-width: 1025px)and(min-width: 821px){
|
||||
height: 11.5em;
|
||||
img{
|
||||
transform:scale(1.6) translatey(-3px);
|
||||
}
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height:8em;
|
||||
img{
|
||||
transform:scale(1.6) translatey(-3px);
|
||||
}
|
||||
}
|
||||
@media(max-width:768px)and(min-width: 600px){
|
||||
height: 22.5em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-45px);
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.video_desc {
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
padding-bottom: 0;
|
||||
@media(min-width: 769px){
|
||||
height: 3em;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.video_linkwrapper2{
|
||||
position:relative;
|
||||
height: 17.5em;
|
||||
overflow:hidden;
|
||||
width: 100%;
|
||||
border-radius: 1em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-41px);
|
||||
width: 100%;
|
||||
}
|
||||
@media(max-width: 1025px)and(min-width: 821px){
|
||||
height:16.5em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-8px);
|
||||
}
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height:11.5em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-13px);
|
||||
}
|
||||
}
|
||||
@media(max-width:768px)and(min-width: 600px){
|
||||
height: 22.5em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-48px);
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
height: 12.5em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-22px);
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.video_linkwrapper3{
|
||||
position:relative;
|
||||
height: 12em;
|
||||
overflow:hidden;
|
||||
img{
|
||||
transform:scale(1.6) translatey(5px);
|
||||
}
|
||||
@media(max-width: 1025px)and(min-width: 821px){
|
||||
height:9.5em;
|
||||
img{
|
||||
transform:scale(1.6) translatey(6px);
|
||||
}
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height:7.5em;
|
||||
img{
|
||||
transform:scale(1.6) translatey(6px);
|
||||
}
|
||||
}
|
||||
@media(max-width:768px)and(min-width: 600px){
|
||||
height: 22.5em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-48px);
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
height: 12.5em;
|
||||
img{
|
||||
transform:scale(1.3) translatey(-3px);
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.video_data{
|
||||
@media(max-width: 768px){
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.video_data:hover, .video_data.hover-class{
|
||||
@media(min-width: 1025px){
|
||||
.video_snapshot{
|
||||
box-shadow: 4px 4px 5px 1px rgba(0, 0, 0, 0.3);
|
||||
-webkit-transform: scale(1.35) translateY(-6px);
|
||||
-ms-transform: scale(1.35) translateY(-6px);
|
||||
transform: scale(1.35) translateY(-6px);
|
||||
-webkit-transition: all .3s ease;
|
||||
-moz-transition: all .3s ease;
|
||||
-ms-transition: all .3s ease;
|
||||
-o-transition: all .3s ease;
|
||||
transition: all .3s ease;
|
||||
}
|
||||
.video_linkwrapper3{
|
||||
.video_snapshot{
|
||||
-webkit-transform: scale(1.95) translateY(-6px)!important;
|
||||
-ms-transform: scale(1.95) translateY(-6px)!important;
|
||||
transform: scale(1.95) translateY(-6px)!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.index-publications-3{
|
||||
@media(min-width:$screen-xs){
|
||||
.i-annc__img{
|
||||
width: auto;
|
||||
max-width: unset;
|
||||
height: 20em;
|
||||
}
|
||||
}
|
||||
}
|
||||
.index-publications-3 .i-annc__img-wrap{
|
||||
overflow: hidden;
|
||||
margin: 0 0 1em 0;
|
||||
text-align: center;
|
||||
}
|
||||
// .index-publications-3 .i-annc__content-wrap{
|
||||
// height: 6em;
|
||||
// }
|
||||
.wordcloud2{
|
||||
span{
|
||||
font-size: 1.5em !important;
|
||||
height: 2em !important;
|
||||
position: relative !important;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -550,6 +550,7 @@
|
|||
font-family: $main-font;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items:center;
|
||||
a {
|
||||
@media(min-width: 769px){
|
||||
max-width: 80%;
|
||||
|
|
|
|||
|
|
@ -199,9 +199,7 @@
|
|||
.fc-daygrid-event-harness .fc-daygrid-event{
|
||||
padding: 5px;
|
||||
}
|
||||
.fc .fc-daygrid-more-link{
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.fc-timegrid-axis{
|
||||
min-width: 10em;
|
||||
}
|
||||
|
|
@ -308,6 +306,15 @@
|
|||
}
|
||||
.fc-timeGridDay-view{
|
||||
position: relative!important;
|
||||
span.fc-timegrid-axis-cushion.fc-scrollgrid-shrink-cushion.fc-scrollgrid-sync-inner{
|
||||
display: none;
|
||||
}
|
||||
.fc-timegrid-axis-frame{
|
||||
display: none;
|
||||
}
|
||||
.fc-scrollgrid-section-liquid{
|
||||
display: none;
|
||||
}
|
||||
.fc-timegrid-slot{
|
||||
border:0!important;
|
||||
}
|
||||
|
|
@ -319,10 +326,48 @@
|
|||
@media(min-width:$screen-xs){
|
||||
overflow: unset !important;
|
||||
}
|
||||
|
||||
}
|
||||
.fc-daygrid-day-frame{
|
||||
@media(min-width: $screen-xs){
|
||||
min-height: 7em!important;
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
min-height:24em !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.fc-timeGridWeek-view{
|
||||
/* table th{
|
||||
display: table-cell;
|
||||
}*/
|
||||
/* .fc-col-header {
|
||||
display: none;
|
||||
}*/
|
||||
/* .fc-timegrid-axis{
|
||||
display: none;
|
||||
}*/
|
||||
.fc-daygrid-day-frame{
|
||||
@media(min-width: $screen-xs){
|
||||
min-height: 7em!important;
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
min-height:24em !important;
|
||||
}
|
||||
}
|
||||
.fc-event-title{
|
||||
@media(max-width: $screen-xs){
|
||||
-webkit-line-clamp: 4!important;
|
||||
}
|
||||
}
|
||||
span.fc-timegrid-axis-cushion.fc-scrollgrid-shrink-cushion.fc-scrollgrid-sync-inner{
|
||||
display: none;
|
||||
}
|
||||
.fc-timegrid-axis-frame{
|
||||
display: none;
|
||||
}
|
||||
.fc-scrollgrid-section-liquid{
|
||||
display: none;
|
||||
}
|
||||
position: relative!important;
|
||||
.fc-timegrid-slot{
|
||||
border:0!important;
|
||||
|
|
@ -406,7 +451,7 @@
|
|||
border-radius: 0.5em;
|
||||
|
||||
}
|
||||
.hidden_timepicker1{
|
||||
.hidden_timepicker{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
|
@ -433,7 +478,7 @@
|
|||
}*/
|
||||
.fc-timeGridWeek-view{
|
||||
.fc-scrollgrid-sync-table{
|
||||
display:none!important;
|
||||
|
||||
}
|
||||
}
|
||||
.fc .fc-timegrid-axis-frame{
|
||||
|
|
@ -469,3 +514,53 @@
|
|||
color:$theme-color-main;
|
||||
}
|
||||
}
|
||||
table.fc-col-header{
|
||||
width:100%!important;
|
||||
}
|
||||
a.fc-daygrid-more-link.fc-more-link{
|
||||
display: block;
|
||||
padding: 0.5em;
|
||||
border-radius: 1em;
|
||||
box-shadow: 0 2px 6px #00000026;
|
||||
border: 0.0625em solid #00000033;
|
||||
@media(max-width: 768px){
|
||||
padding: 0.3em;
|
||||
font-size: .85em;
|
||||
}
|
||||
}
|
||||
.fc .fc-daygrid-more-link{
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fc-h-event .fc-event-title{
|
||||
display:-webkit-box!important;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
min-height: 3em;
|
||||
}
|
||||
.mybooking{
|
||||
&:after{
|
||||
content:"\f2bd"!important;
|
||||
position: relative!important;
|
||||
background: none!important;
|
||||
display: block;
|
||||
font-family: FontAwesome;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
color: #fff;
|
||||
/* @media(min-width: $screen-xs){
|
||||
position: absolute;
|
||||
top: 2em;
|
||||
right: 1em;
|
||||
}*/
|
||||
}
|
||||
}
|
||||
.mybookinga{
|
||||
margin-bottom: 0.5em;
|
||||
a{
|
||||
font-size: 1em;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -163,21 +163,15 @@
|
|||
// epaper-index2
|
||||
|
||||
.epaper-index2-container{
|
||||
border-style: solid;
|
||||
border-color: #ccc;
|
||||
border-width: 0 1px 1px;
|
||||
// border-style: solid;
|
||||
// border-color: #ccc;
|
||||
// border-width: 0 1px 1px;
|
||||
h1,h2,h3,h4{
|
||||
border-bottom: 1px solid #ccc;//#e1e1e1;
|
||||
margin: 0;
|
||||
padding: 10px 0 10px 10px;
|
||||
span{
|
||||
float:right;
|
||||
margin-right:10px;
|
||||
color: #0e5c92;
|
||||
border: 1px solid #d1d1d1;
|
||||
background: #f0f0f0;
|
||||
padding: 4px 6px;
|
||||
margin-top:-3px;
|
||||
|
||||
}
|
||||
}
|
||||
margin-top: 15px;
|
||||
|
|
@ -228,9 +222,6 @@ background:#fff;
|
|||
|
||||
}
|
||||
}
|
||||
.epaper-description a:visited{
|
||||
color: #777575;
|
||||
}
|
||||
.epaper-description a:hover{
|
||||
text-decoration-color: #333;
|
||||
text-decoration-line: underline;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
.w-annc__list{
|
||||
clear: both;
|
||||
}
|
||||
.i-annc__table{
|
||||
// border: 0.0625em solid #ddd !important;
|
||||
.i-annc__th{
|
||||
|
|
@ -477,6 +480,9 @@
|
|||
|
||||
// Index-5
|
||||
.index-eventnews-5{
|
||||
.i-annc__item{
|
||||
width:100% ;
|
||||
}
|
||||
.i-annc__content-wrap{
|
||||
@media(max-width: 768px){
|
||||
padding-top: 0.5em;
|
||||
|
|
@ -854,3 +860,6 @@
|
|||
display: inline-block;
|
||||
}
|
||||
}
|
||||
.widget-event-news-calendar-2.w-calendar .w-calendar-title{
|
||||
background:$theme-color-second;
|
||||
}
|
||||
|
|
@ -241,6 +241,7 @@
|
|||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
margin-bottom: 0;
|
||||
height: 2.5em;
|
||||
}
|
||||
|
||||
.index-img-description {
|
||||
|
|
|
|||
|
|
@ -67,6 +67,7 @@
|
|||
|
||||
.i-member-pic {
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.i-member-profile-list {
|
||||
|
|
@ -280,6 +281,82 @@
|
|||
.i-member-profile-list {
|
||||
@include list-reset;
|
||||
word-break: break-all;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.i-member-profile-item {
|
||||
font-size: 1em;
|
||||
line-height: 1.3;
|
||||
padding-top: 0.5em;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.i-member-title { display: none; }
|
||||
.i-member-item:nth-child(4n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.i-member-pic-wrap {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
//index 7
|
||||
.index-member-7 {
|
||||
.i-member-section {
|
||||
margin: auto;
|
||||
}
|
||||
.i-member-list {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
margin: 0;
|
||||
}
|
||||
.i-member-item {
|
||||
float: none;
|
||||
padding: 15px;
|
||||
|
||||
@media (max-width:1280px) {
|
||||
width: calc( 100% / 3 );
|
||||
}
|
||||
@media (max-width:767px) {
|
||||
width: calc( 100% / 2 );
|
||||
}
|
||||
@media (max-width:580px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.i-member-item-inner {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.i-member-status-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.i-member-item-inner {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.i-member-pic-wrap {
|
||||
height: auto;
|
||||
margin-bottom: 16px;
|
||||
|
||||
@media(max-width:580px) {
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
behavior: url("/assets/ie_support/PIE2/PIE.htc");
|
||||
height: 14em;
|
||||
width: 14em;
|
||||
margin: 1.5em auto 1em auto;
|
||||
}
|
||||
}
|
||||
|
||||
.i-member-pic {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.i-member-profile-list {
|
||||
@include list-reset;
|
||||
word-break: break-all;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.i-member-profile-item {
|
||||
|
|
|
|||
|
|
@ -3,6 +3,12 @@
|
|||
@import "../initial";
|
||||
|
||||
// // 選單樣式2
|
||||
// .modules-menu .modules-menu-level-1 > li:hover, .modules-menu .modules-menu-level-1 > li.hover-class{
|
||||
// background-color: transparent!important;
|
||||
// >a{
|
||||
// text-decoration: underline;
|
||||
// }
|
||||
// }
|
||||
// .modules-menu{
|
||||
// @media (min-width: $screen-sm){
|
||||
// li{
|
||||
|
|
@ -197,7 +203,6 @@
|
|||
}
|
||||
@media (min-width:1025px) {
|
||||
margin: 0;
|
||||
padding:0.5em 0 0;
|
||||
list-style: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -315,6 +320,11 @@
|
|||
right: 0;
|
||||
}
|
||||
}
|
||||
&:nth-last-child(2){
|
||||
.modules-menu-level-1 {
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@media (min-width: $screen-sm) {
|
||||
|
|
@ -566,7 +576,7 @@
|
|||
transition-property:transform;
|
||||
}
|
||||
.mobile-menu .modules-menu.collapse.in {
|
||||
transform: translateX(100%);
|
||||
transform: translateX(0%);
|
||||
-webkit-transition-timing-function:ease;
|
||||
-o-transition-timing-function:ease;
|
||||
transition-timing-function:ease;
|
||||
|
|
@ -580,7 +590,6 @@
|
|||
|
||||
.mobile-menu .collapse.navbar-collapse.modules-menu {
|
||||
overflow-y: scroll;
|
||||
transform: translateX(0%);
|
||||
}
|
||||
.display-on{
|
||||
display:block!important;
|
||||
|
|
|
|||
|
|
@ -1,12 +1,29 @@
|
|||
@import "../initial";
|
||||
.marquee {
|
||||
background: rgba(255,255,255,0.1);
|
||||
border: 1px solid rgba(0,0,0,0.1);
|
||||
border-radius: 0.3125em;
|
||||
background:#ff0000;
|
||||
font-size: 0.938em;
|
||||
list-style: outside none none;
|
||||
margin: 0 0 1.875em;
|
||||
list-style:none;
|
||||
margin: 0;
|
||||
min-height: 1.875em;
|
||||
overflow: hidden;
|
||||
padding: 0.9375em;
|
||||
padding: 0.75em;
|
||||
color: #fff;
|
||||
li{
|
||||
list-style:none;
|
||||
}
|
||||
a{
|
||||
color: #fff;
|
||||
}
|
||||
&:before{
|
||||
content: "\f0a1";
|
||||
font-family: FontAwesome;
|
||||
color: #FFEB3B;
|
||||
font-size: 18px;
|
||||
padding-right: 0.5em;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.text_marqueewrapper{
|
||||
z-index:1 ;
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -1,6 +1,25 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
.universal-table-index tbody{
|
||||
width:100% ;
|
||||
}
|
||||
.universal-table-show{
|
||||
.view_count > i:before{
|
||||
content: "\f019"!important;
|
||||
margin: 0.5em;
|
||||
padding: 0.5em;
|
||||
border-radius: 1em;
|
||||
}
|
||||
}
|
||||
.universal-table-index{
|
||||
.view_count > i:before{
|
||||
content: "\f019"!important;
|
||||
margin: 0.5em;
|
||||
padding: 0.5em;
|
||||
border-radius: 1em;
|
||||
}
|
||||
}
|
||||
.universal-table-index{
|
||||
tr{
|
||||
background-color: #fff!important;
|
||||
|
|
@ -193,10 +212,10 @@
|
|||
}
|
||||
}
|
||||
.column_entry_files{
|
||||
padding-left: 1em;
|
||||
padding-left:0;
|
||||
}
|
||||
.column_entry_file{
|
||||
list-style: disc;
|
||||
list-style: none;
|
||||
}
|
||||
.ken-click2{
|
||||
margin-top:-3em;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,978 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
.Video__Player{
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.Video__PlayerButton{
|
||||
display: inline-block;
|
||||
padding-bottom: 0px;
|
||||
padding-top: 0px;
|
||||
border-radius: 50%;
|
||||
border: 0px;
|
||||
background-color: $theme-color-second;
|
||||
background: url(/assets/btn-play.svg) no-repeat;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
transition: 0.5s;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
&:hover{
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view_info{
|
||||
max-height: 100%;
|
||||
border-radius: 2px;
|
||||
font-size: 0.875rem;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
padding: 0px 8px;
|
||||
background-color: #000000cc;
|
||||
color: rgb(255, 255, 255);
|
||||
z-index: 10;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
border: 1px solid transparent;
|
||||
line-height: 1.45;
|
||||
span{
|
||||
color:#fff;
|
||||
}
|
||||
&:before{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
background: url(/assets/icon-view@2x.png) no-repeat;
|
||||
position: relative;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
.w-video_data{
|
||||
position: relative;
|
||||
.video_keyword{
|
||||
display: none;
|
||||
}
|
||||
.video_tag{
|
||||
top:10px;
|
||||
left:10px;
|
||||
max-height: 100%;
|
||||
border: 0;
|
||||
border-radius: 2px;
|
||||
background-color: transparent;
|
||||
font-size: 0.875rem;
|
||||
font-family: "Noto Sans TC", PingFangTC, 微軟正黑體, "Microsoft JhengHei", sans-serif;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
padding: 0px 8px;
|
||||
color: #fff;
|
||||
z-index: 5;
|
||||
.video_tags2 {
|
||||
float: left;
|
||||
min-width: 5em;
|
||||
border: 1px solid;
|
||||
border-radius: 2px;
|
||||
background-color: #1515154d;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view_info{
|
||||
img{
|
||||
width: 30px!important;
|
||||
}
|
||||
}
|
||||
.videohover{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
transition: 0.3s;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
.video_data{
|
||||
z-index: 1!important;
|
||||
position: relative!important;
|
||||
&:hover{
|
||||
.video_title{
|
||||
.video_link{
|
||||
color: $theme-color-second;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.videohover{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
transition: 0.3s;
|
||||
z-index: 2;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
@media(min-width: 1025px){
|
||||
.video_snapshot{
|
||||
box-shadow: 4px 4px 5px 1px rgba(0, 0, 0, 0.3);
|
||||
-webkit-transform: scale(1.1) ;
|
||||
-ms-transform: scale(1.1) ;
|
||||
transform: scale(1.1) ;
|
||||
-webkit-transition: all .3s ease;
|
||||
-moz-transition: all .3s ease;
|
||||
-ms-transition: all .3s ease;
|
||||
-o-transition: all .3s ease;
|
||||
transition: all .3s ease;
|
||||
}
|
||||
.video_linkwrapper2{
|
||||
.video_snapshot{
|
||||
-webkit-transform: scale(1.1) !important;
|
||||
-ms-transform: scale(1.1) !important;
|
||||
transform: scale(1.1) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.video_tag{
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
@media(max-width: 768px){
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.video_data-widget-1{
|
||||
.video_info{
|
||||
margin:0.5em 0;
|
||||
}
|
||||
}
|
||||
.video_data-widget-2{
|
||||
.col-sm-4{
|
||||
@media(min-width:768px){
|
||||
width: 33.33333333%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.video_data_wrap{
|
||||
@media(min-width:$screen-xs){
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
.video_desc{
|
||||
display: none;
|
||||
}
|
||||
.video_info{
|
||||
margin:0.5em 0;
|
||||
}
|
||||
.video_link{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
}
|
||||
.video_keyword{
|
||||
display: none;
|
||||
}
|
||||
.video_data{
|
||||
|
||||
&:first-child{
|
||||
.video_keyword{
|
||||
display: -webkit-box !important;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
white-space: normal;
|
||||
overflow: hidden;
|
||||
}
|
||||
.video_linkwrapper2{
|
||||
|
||||
@media(min-width:$screen-xs)and(max-width:768px){
|
||||
height: 24em;
|
||||
}
|
||||
}
|
||||
width: 100% ;
|
||||
@media(max-width:$screen-xs){
|
||||
width: 100.5vw !important;
|
||||
margin-left: -6vw;
|
||||
}
|
||||
.video_desc{
|
||||
.video_link{
|
||||
text-align: center;
|
||||
&:hover{
|
||||
&:before{
|
||||
background-color: #c21000!important;
|
||||
}
|
||||
}
|
||||
&:before{
|
||||
content: " ▶ 觀看節目"; /* Font Awesome 播放圖示 + 文字 */
|
||||
font-weight: 900;
|
||||
position: absolute;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
display: inline-flex;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
padding: 0px 15px;
|
||||
height: 44px;
|
||||
border-radius: 22px;
|
||||
line-height: 42px;
|
||||
border: 1px solid transparent;
|
||||
background-color: $theme-color-second;
|
||||
color: rgb(255, 255, 255);
|
||||
font-size: 1.25rem;
|
||||
letter-spacing: 0.3px;
|
||||
font-weight: normal;
|
||||
white-space: nowrap;
|
||||
transition: 0.3s;
|
||||
bottom: 3em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.video_title{
|
||||
&:before{
|
||||
content: '';
|
||||
position: relative;
|
||||
background: url(/assets/icon-now.svg) no-repeat;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
background-size: contain;
|
||||
display: block;
|
||||
margin-right: 0.5em;
|
||||
margin-top: 1.2em;
|
||||
float: left;
|
||||
@media(max-width:$screen-xs){
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
position: absolute;
|
||||
top: -2.5em;
|
||||
left: 44%;
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
h5{
|
||||
font-size: 1.8em;
|
||||
}
|
||||
}
|
||||
.videohover{
|
||||
display: none!important;
|
||||
}
|
||||
.video_tag{
|
||||
position: absolute;
|
||||
left: 6em;
|
||||
bottom: 8em;
|
||||
top: auto;
|
||||
display: block!important;
|
||||
background-color:transparent;
|
||||
border:0;
|
||||
}
|
||||
.video_desc{
|
||||
display: block;
|
||||
height: 4.1em;
|
||||
overflow: hidden;
|
||||
margin-bottom: 8em;
|
||||
|
||||
}
|
||||
margin-bottom: 2em;
|
||||
.video_group_time{
|
||||
color: #fff!important;
|
||||
position: absolute;
|
||||
bottom: 4.5em;
|
||||
margin-left: 9.5em;
|
||||
}
|
||||
.view_info{
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media(min-width:767px){
|
||||
|
||||
&:before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%);
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.video_info{
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
a{
|
||||
color: #fff;
|
||||
}
|
||||
@media(min-width:767px){
|
||||
padding: 2em 5em;
|
||||
width: 55%;
|
||||
}
|
||||
@media(max-width:767px){
|
||||
margin: 0;
|
||||
padding: 1em;
|
||||
background-color: #444;
|
||||
position: relative;
|
||||
padding-bottom: 4em;
|
||||
padding-top: 3em;
|
||||
.video_title h5{
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.video_tag{
|
||||
left: 12%;
|
||||
bottom: 9em;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
display: flex!important;
|
||||
width: 75%;
|
||||
.video_keyword{
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
}
|
||||
.video_link:before{
|
||||
bottom: 4em;
|
||||
left: 32vw;
|
||||
}
|
||||
.video_group_time{
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
left: 0;
|
||||
bottom:2.5em;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.video_linkwrapper2{
|
||||
@media(min-width:1025px){
|
||||
height: 40.6em;
|
||||
}
|
||||
@media(min-width:769px)and(max-width:1024px){
|
||||
height: 32.6em;
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height: 25.6em;
|
||||
}
|
||||
@media(max-width:$screen-xs){
|
||||
height: 14.5em;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.video_data-widget-3{
|
||||
@media(max-width:768px){
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
.btnwrapper{
|
||||
@media(max-width:768px)and(min-width:$screen-xs){
|
||||
top: 90%!important;
|
||||
width: 14%!important;
|
||||
left: 44%!important;
|
||||
}
|
||||
@media(max-width:$screen-xs){
|
||||
top: 90%!important;
|
||||
width: 24% !important;
|
||||
left: 38% !important;
|
||||
}
|
||||
}
|
||||
.video_data_wrap{
|
||||
@media(min-width:$screen-xs){
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
.video_data{
|
||||
@media(max-width:821px)and(min-width:$screen-xs){
|
||||
width: 48vw !important;
|
||||
float: none;
|
||||
}
|
||||
@media(max-width:$screen-xs){
|
||||
width: 92.5vw !important;
|
||||
margin-left: 0 !important;
|
||||
margin-right: 1em !important;
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
.video_desc{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-height: 4.5em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.video_info{
|
||||
margin:0.5em 0;
|
||||
}
|
||||
.video_link{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
.video_data-widget-4{
|
||||
.btnwrapper{
|
||||
@media(max-width:$screen-xs){
|
||||
top: 90%!important;
|
||||
width: 24% !important;
|
||||
left: 38% !important;
|
||||
}
|
||||
}
|
||||
.video_data_wrap{
|
||||
@media(min-width:$screen-xs){
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
.video_data{
|
||||
|
||||
@media(max-width:821px)and(min-width:$screen-xs){
|
||||
width: 48vw !important;
|
||||
float: none;
|
||||
}
|
||||
@media(max-width:$screen-xs){
|
||||
width: 92.5vw !important;
|
||||
margin-left: 0 !important;
|
||||
margin-right: 1em !important;
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
.video_desc{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-height: 4.5em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.video_info{
|
||||
margin:0.5em 0;
|
||||
min-height: 6em;
|
||||
}
|
||||
.video_link{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
.video_data-widget-5{
|
||||
.cycle-pager{
|
||||
font-size: 1.25rem;
|
||||
font-family: "Noto Serif TC", serif;
|
||||
font-weight: bold;
|
||||
h5{
|
||||
font-size: 1.25rem;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.video_title h5{
|
||||
@extend .i-title;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.view_info{
|
||||
float: right;
|
||||
}
|
||||
.view_info img{
|
||||
margin-right: 5px;
|
||||
}
|
||||
.Video__Player{
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.Video__PlayerButton{
|
||||
display: inline-block;
|
||||
padding-bottom: 0px;
|
||||
padding-top: 0px;
|
||||
border-radius: 50%;
|
||||
border: 0px;
|
||||
background-color: $theme-color-second;
|
||||
background: url(/assets/btn-play.svg) no-repeat;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
transition: 0.5s;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
&:hover{
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view_info{
|
||||
max-height: 100%;
|
||||
border-radius: 2px;
|
||||
font-size: 0.875rem;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
padding: 0px 8px;
|
||||
background-color: #000000cc;
|
||||
color: rgb(255, 255, 255);
|
||||
z-index: 10;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
border: 1px solid transparent;
|
||||
line-height: 1.45;
|
||||
span{
|
||||
color:#fff;
|
||||
}
|
||||
&:before{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
background: url(/assets/icon-view@2x.png) no-repeat;
|
||||
position: relative;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
.cycle-sentinel {
|
||||
display: none !important;
|
||||
}
|
||||
.pager-controls{
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
bottom: 1em;
|
||||
.prev-btn,.next-btn{
|
||||
color: #909090;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
height: 2.5em;
|
||||
width: 2.5em;
|
||||
transition: .3s;
|
||||
&:hover{
|
||||
filter: drop-shadow(rgb(214, 214, 214) 0px 0px 0.1rem);
|
||||
}
|
||||
}
|
||||
@media(max-width:768px){
|
||||
position: relative;
|
||||
float: right;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
.video_data_wrap{
|
||||
@media(min-width:$screen-xs){
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
.video_data{
|
||||
@media(max-width:$screen-xs){
|
||||
width: 93.5vw !important;
|
||||
margin-left: 0 !important;
|
||||
margin-right: 1em !important;
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
.video_desc{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-height: 4.5em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.video_info{
|
||||
margin:0.5em 0;
|
||||
}
|
||||
.video_link{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
.video_detail{
|
||||
h3{
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
}
|
||||
.movie_desc{
|
||||
clear: both;
|
||||
letter-spacing: 0.3px;
|
||||
color: #8f8f8f;
|
||||
line-height: 1.8;
|
||||
}
|
||||
.video_title {
|
||||
clear: both;
|
||||
}
|
||||
.video_data{
|
||||
list-style: none;
|
||||
}
|
||||
.video_tag{
|
||||
display: flex;
|
||||
float: left;
|
||||
}
|
||||
.view_info{
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.video_group_time{
|
||||
clear: both;
|
||||
}
|
||||
.video_group_time{
|
||||
color: #8f8f8f!important;
|
||||
}
|
||||
.movietitle{
|
||||
margin-bottom: 15px;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #ccc;
|
||||
clear: both;
|
||||
font-family: "Noto Serif TC", serif;
|
||||
font-weight: bold;
|
||||
h4{
|
||||
width: 100px;
|
||||
border-bottom: 2px solid #141414;
|
||||
padding-bottom: 0.5em;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.imglst_desc{
|
||||
.video_tag{
|
||||
background-color: transparent;
|
||||
color: $theme-color-second;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
padding: 0px 7px;
|
||||
max-height: 100%;
|
||||
border: 1px solid;
|
||||
border-radius: 2px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
.video_title {
|
||||
clear: both;
|
||||
@extend .i-title;
|
||||
}
|
||||
.video_data_wrap{
|
||||
padding-right: 0.4375em;
|
||||
padding-left: 0.4375em;
|
||||
}
|
||||
.imglst_desc{
|
||||
margin: 1em 0;
|
||||
}
|
||||
.category_box {
|
||||
padding: 0;
|
||||
border: 1px solid #6868688f;
|
||||
border-radius: 0.5em 0 0 0.5em;
|
||||
overflow: hidden;
|
||||
}
|
||||
.search_box{
|
||||
padding: 0;
|
||||
border-radius: 0 0.5em 0.5em 0;
|
||||
overflow: hidden;
|
||||
border: 1px solid #6868688f;
|
||||
}
|
||||
.video_linkwrapper{
|
||||
position:relative;
|
||||
height: 12em;
|
||||
overflow:hidden;
|
||||
width: 100%;
|
||||
border-radius: 1em;
|
||||
img{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
.video_desc {
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
padding-bottom: 0;
|
||||
|
||||
}
|
||||
|
||||
.video_linkwrapper{
|
||||
position:relative;
|
||||
height: 12.5em;
|
||||
overflow:hidden;
|
||||
width: 100%;
|
||||
border-radius: 1em;
|
||||
@media(max-width: 1025px)and(min-width: 821px){
|
||||
height:10.5em;
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height:8em;
|
||||
}
|
||||
@media(max-width:768px)and(min-width: 600px){
|
||||
height: 23.5em;
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
height: 11.5em;
|
||||
}
|
||||
}
|
||||
.video_linkwrapper2{
|
||||
position:relative;
|
||||
height: 13.5em;
|
||||
overflow:hidden;
|
||||
|
||||
@media(max-width: 1025px)and(min-width: 769px){
|
||||
height:10em;
|
||||
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 768px){
|
||||
height:7.5em;
|
||||
|
||||
}
|
||||
@media(max-width:767px)and(min-width:$screen-xs){
|
||||
height: 22.5em;
|
||||
}
|
||||
@media(max-width:$screen-xs){
|
||||
height: 13em;
|
||||
}
|
||||
}
|
||||
.video_linkwrapper3{
|
||||
position:relative;
|
||||
height: 13.5em;
|
||||
overflow:hidden;
|
||||
|
||||
@media(max-width: 1025px)and(min-width: 821px){
|
||||
height:10em;
|
||||
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height: 7.8em;
|
||||
|
||||
|
||||
}
|
||||
@media(max-width:768px)and(min-width:$screen-xs){
|
||||
height: 12em;
|
||||
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
height:13em;
|
||||
}
|
||||
}
|
||||
.video_linkwrapper4{
|
||||
position:relative;
|
||||
height: 9em;
|
||||
overflow:hidden;
|
||||
|
||||
@media(max-width: 1025px)and(min-width: 821px){
|
||||
height:7em;
|
||||
|
||||
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height: 7.8em;
|
||||
|
||||
|
||||
}
|
||||
@media(max-width:768px)and(min-width:$screen-xs){
|
||||
height: 11.5em;
|
||||
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
height:13em;
|
||||
|
||||
}
|
||||
}
|
||||
.video_linkwrapper5{
|
||||
|
||||
position:relative;
|
||||
height: 27em;
|
||||
overflow:hidden;
|
||||
|
||||
@media(max-width: 1025px)and(min-width: 821px){
|
||||
height:21.5em;
|
||||
|
||||
}
|
||||
@media(max-width: 821px)and(min-width: 769px){
|
||||
height: 7.8em;
|
||||
|
||||
|
||||
}
|
||||
@media(max-width:768px)and(min-width:$screen-xs){
|
||||
height: 25em;
|
||||
|
||||
}
|
||||
@media(max-width: $screen-xs){
|
||||
height:13em;
|
||||
|
||||
}
|
||||
}
|
||||
.video_group_time{
|
||||
q{
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
q::before {
|
||||
display: none!important;
|
||||
}
|
||||
q::after {
|
||||
display: none!important;
|
||||
}
|
||||
}
|
||||
|
||||
.video_data-modal-view .play_icon{
|
||||
height: 55px;
|
||||
}
|
||||
.video_box_wrap{
|
||||
box-shadow: #15151580 0px 2px 10px 0px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.video_data-index-1{
|
||||
.view_info{
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
.video_data-post-agency-1{
|
||||
.view_info{
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
.video_data-index-4{
|
||||
|
||||
.i-annc__page-title{
|
||||
display: none;
|
||||
}
|
||||
.category_box{
|
||||
border:0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
button.category-btn{
|
||||
margin: 0.5em;
|
||||
display: inline-flex;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
padding: 0px 15px;
|
||||
height: 36px;
|
||||
border-radius: 18px;
|
||||
line-height: 34px;
|
||||
border: 1px solid rgb(204, 204, 204);
|
||||
background-color: rgb(255, 255, 255);
|
||||
color: rgb(20, 20, 20);
|
||||
font-size: 1rem;
|
||||
font-family: "Noto Sans TC", PingFangTC, 微軟正黑體, "Microsoft JhengHei", sans-serif;
|
||||
letter-spacing: 0.3px;
|
||||
font-weight: normal;
|
||||
white-space: nowrap;
|
||||
transition: 0.3s;
|
||||
&:hover{
|
||||
background-color: $theme-color-second;
|
||||
color: #ffffff;
|
||||
}
|
||||
&:active{
|
||||
background-color: $theme-color-second;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.video_linkwrapper2{
|
||||
height: 9.5em;
|
||||
}
|
||||
.video_desc{
|
||||
letter-spacing: 0.3px;
|
||||
color: #8f8f8f;
|
||||
line-height: 1.6;
|
||||
max-height: 5em;
|
||||
}
|
||||
.video_info{
|
||||
margin:0.5em 0;
|
||||
}
|
||||
.video_link{
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
}
|
||||
.video_tag{
|
||||
top:10px;
|
||||
left: 10px;
|
||||
max-height: 100%;
|
||||
border: 0;
|
||||
border-radius: 2px;
|
||||
background-color: transparent;
|
||||
font-size: 0.875rem;
|
||||
font-family: "Noto Sans TC", PingFangTC, 微軟正黑體, "Microsoft JhengHei", sans-serif;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
padding: 0px 8px;
|
||||
color: #fff;
|
||||
z-index: 5;
|
||||
.video_tags2 {
|
||||
float: left;
|
||||
min-width: 5em;
|
||||
border: 1px solid;
|
||||
border-radius: 2px;
|
||||
background-color: #1515154d;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -3,6 +3,28 @@
|
|||
@import "../initial";
|
||||
|
||||
// Link MODULES
|
||||
.morebken{
|
||||
font-size: 1.2em;
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
padding: 0.5em 1em;
|
||||
width: fit-content;
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&:hover{
|
||||
color: $theme-color-second;
|
||||
}
|
||||
i{
|
||||
font-size: 0.8em;
|
||||
padding-left: 5px;
|
||||
}
|
||||
}
|
||||
.rotate {
|
||||
-webkit-transform: rotate(-180deg);
|
||||
transform: rotate(-180deg);
|
||||
}
|
||||
.widget-link_wrapper{
|
||||
z-index: 1;
|
||||
}
|
||||
|
|
@ -36,7 +58,7 @@
|
|||
align-items: normal;
|
||||
}
|
||||
.liWrapper{
|
||||
margin: 0.5em;
|
||||
margin:0 0.5em;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
|
@ -46,7 +68,7 @@
|
|||
|
||||
&.widget1 {
|
||||
img{
|
||||
width: 32%;
|
||||
// width: 32%;
|
||||
}
|
||||
.widget-content {
|
||||
text-align: center;
|
||||
|
|
@ -56,7 +78,6 @@
|
|||
}
|
||||
|
||||
.widget-content-title {
|
||||
display: inline-block;
|
||||
padding-top: 0.5em;
|
||||
@extend .i-subtitle;
|
||||
}
|
||||
|
|
@ -70,6 +91,17 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
&.widget2{
|
||||
.list-unstyled{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
overflow: hidden;
|
||||
li:nth-child(n+5){
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.widget-3 {
|
||||
ul{
|
||||
@media(max-width: $screen-xs){
|
||||
|
|
@ -108,10 +140,10 @@
|
|||
padding: 0.5em !important;
|
||||
}
|
||||
.link-img-wrap{
|
||||
border-radius: 50%;
|
||||
border-radius:10em;
|
||||
overflow: hidden;
|
||||
&:hover{
|
||||
border-radius: 20%;
|
||||
border-radius:2em;
|
||||
-webkit-transition: .3s all ease;
|
||||
-o-transition: .3s all ease;
|
||||
transition: .3s all ease;
|
||||
|
|
@ -169,6 +201,7 @@
|
|||
|
||||
// Link INDEX
|
||||
.index-link {
|
||||
clear: both;
|
||||
.index-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,7 +22,16 @@
|
|||
|
||||
//RWD
|
||||
@import "RWD";
|
||||
|
||||
.sr-only{
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.dropdown-toggle:focus {
|
||||
// outline: 2px solid #43B5FC;
|
||||
|
|
@ -475,13 +484,13 @@ ul.tab_nav {
|
|||
table td{
|
||||
border: 1px solid #ddd!important;
|
||||
@media (max-width: 480px) {
|
||||
width: 100%;
|
||||
width: auto!important;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
td,th{
|
||||
@media(max-width: $screen-xs){
|
||||
width: 100%;
|
||||
width: auto!important;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
|
@ -669,13 +678,18 @@ table.dataTable>tbody>tr.child{
|
|||
}
|
||||
}
|
||||
}
|
||||
//內頁搜尋樣式
|
||||
input.search_box{
|
||||
background: #fff!important;
|
||||
border: 1px solid #bbb!important;
|
||||
color: #333!important;
|
||||
background: #fff !important;
|
||||
border: 1px solid #bbb !important;
|
||||
color: #333 !important;
|
||||
padding: 0.5em !important;
|
||||
margin-right: 0.5em !important;
|
||||
border-radius: 0.5em!important;
|
||||
margin-right: 0.25em !important;
|
||||
border-radius: 0.5em !important;
|
||||
margin-left: 0.25em !important;
|
||||
@media(max-width:1024px){
|
||||
margin-top: 0.5em !important;
|
||||
}
|
||||
}
|
||||
::placeholder {
|
||||
color: #333!important;
|
||||
|
|
@ -685,6 +699,10 @@ input.search_box{
|
|||
background: #fff!important;
|
||||
color: #333!important;
|
||||
margin-right: 0.5em!important;
|
||||
@media(max-width:1024px){
|
||||
margin-left: 0.25em !important;
|
||||
margin-top: 0.5em !important;
|
||||
}
|
||||
}
|
||||
#category_select_box>option{
|
||||
background: #fff!important;
|
||||
|
|
@ -725,6 +743,7 @@ a.ui-state-default{
|
|||
border: 0!important;
|
||||
background: silver!important;
|
||||
}
|
||||
|
||||
.aligncenter{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
.sitemenu{
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
}
|
||||
.sitemenu-wrap{
|
||||
// padding-right: 0.9375em!important;
|
||||
// padding-left: 0.9375em!important;
|
||||
|
|
|
|||
|
|
@ -33,8 +33,10 @@
|
|||
<a title="{{site_title}}" class="navbar-brand" href="{{home_link}}"><img class="site-logo" src="{{logo_url}}" alt="site-logo"> {{site_name}}</a>
|
||||
</div>
|
||||
<div class="header-nav">
|
||||
<a id="accesskey_top" accesskey="U" title="accesskey top" href="#" title="Toolbar">:::</a>
|
||||
{{header-data}}
|
||||
<div class="container">
|
||||
<a id="accesskey_top" accesskey="U" title="accesskey top" href="#" title="Toolbar">:::</a>
|
||||
{{header-data}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse modules-menu" id="layout-navigation">
|
||||
<a id="accesskey_menu" title="accesskey menu" accesskey="M" href="#" title="Main menu">:::</a>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,11 @@
|
|||
<%= render_orbit_bar %>
|
||||
<div class="background" data-pp="100"></div>
|
||||
<%= render_header %>
|
||||
<div class="no-print single-child-datapp homebanner text_marqueewrapper" data-pp="999"></div>
|
||||
<div class="layout-slide no-print single-child-datapp homebanner" data-pp="300"></div>
|
||||
<div class="layout-content2 topcontent">
|
||||
<div class=" single-child-datapp onesection" id="onesection" data-pp="1999"></div>
|
||||
</div>
|
||||
<div class="video-banner" data-pp="301" ></div>
|
||||
<div class="verticalhome">
|
||||
<div class="layout-content topcontent">
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
<%= render_orbit_bar %>
|
||||
<div class="background" data-pp="100"></div>
|
||||
<%= render_header %>
|
||||
<div class="no-print single-child-datapp homebanner text_marqueewrapper" data-pp="998"></div>
|
||||
<section class="layout-slide no-print single-child-datapp homebanner" data-pp="300"></section>
|
||||
<!-- <div class="contentwrap">
|
||||
<div class="container ">
|
||||
|
|
|
|||
|
|
@ -29,7 +29,10 @@
|
|||
<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 role="button" 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="controlplay">
|
||||
<a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></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>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,10 @@
|
|||
<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 role="button" 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="controlplay">
|
||||
<a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></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,10 @@
|
|||
</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 role="button" 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="controlplay">
|
||||
<a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></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>
|
||||
|
|
|
|||
|
|
@ -27,7 +27,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<ul class="w-ba-banner__pager-3 banner-pager banner_caption_{{subpart-id}}"></ul>
|
||||
<ul class="controlplay"><a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a><a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></a></ul>
|
||||
<ul class="controlplay">
|
||||
<a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></a>
|
||||
</ul>
|
||||
<ul class="button-mid">
|
||||
<button class="prev-button" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>"></button>
|
||||
<button class="next-button" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>"></button>
|
||||
|
|
|
|||
|
|
@ -34,7 +34,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="w-ba-banner__caption banner-pager banner_caption_{{subpart-id}}"></div>
|
||||
<ul class="controlplay"><a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a><a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></a></ul>
|
||||
<ul class="controlplay">
|
||||
<a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></a>
|
||||
</ul>
|
||||
<ul class="button-mid">
|
||||
<i class="fa fa-angle-left prev-button" aria-hidden="true" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>"></i>
|
||||
<i class="fa fa-angle-right next-button" aria-hidden="true" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>"></i>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,10 @@
|
|||
<div class="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 role="button" class="resume-slide active" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a><a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></a></ul>
|
||||
<ul class="controlplay">
|
||||
<a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></a>
|
||||
</ul>
|
||||
<ul class="button-mid">
|
||||
<i class="fa fa-angle-left prev-button" aria-hidden="true" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>"></i>
|
||||
<i class="fa fa-angle-right next-button" aria-hidden="true" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>"></i>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,10 @@
|
|||
<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 role="button" 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 role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></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>
|
||||
|
|
@ -69,13 +72,6 @@
|
|||
.w-ba-banner .controlplay{
|
||||
width: auto;
|
||||
}
|
||||
.w-ba-banner .button-mid{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.next-button,.prev-button{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,10 @@
|
|||
</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 role="button" 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="controlplay">
|
||||
<a role="button" class="resume-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "繼續播放" : "resume" %>"><i></i></a>
|
||||
<a class="pause-slide" title = "<%= (I18n.locale.to_s =="zh_tw") ? "暫停播放" : "pause"%>"><i></i></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>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<li class="w-annc__item">
|
||||
|
||||
<div class="w-annc__img-wrap ">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
data-cycle-slides=".w-annc__item" >
|
||||
<li class="w-annc__item " >
|
||||
<div class="w-annc__img-wrap bullseye" style="position:relative">
|
||||
<a href="{{link_to_show}}" style="">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -5,8 +5,8 @@
|
|||
</h3>
|
||||
|
||||
<div class="slide-button">
|
||||
<button class="cycle-prev btn btn-warning"> <i class="fa fa-angle-left"></i></button>
|
||||
<button class="cycle-next btn btn-warning"> <i class="fa fa-angle-right"></i></button>
|
||||
<button class="cycle-prev btn btn-warning" title="上一張" aria-label="上一張"> <i class="fa fa-angle-left"></i></button>
|
||||
<button class="cycle-next btn btn-warning" title="下一張" aria-label="下一張"> <i class="fa fa-angle-right"></i></button>
|
||||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多+" : "More NEWS" %></a>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -8,9 +8,9 @@
|
|||
<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}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</a>
|
||||
</a>
|
||||
</div>
|
||||
<div class="w-annc__content-wrap">
|
||||
<h4 class="w-annc__entry-title">
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
data-cycle-slides=".w-annc__item" >
|
||||
<li class="w-annc__item ">
|
||||
<div class="w-annc__content-wrap" style="position:relative">
|
||||
<a href="{{link_to_show}}" style="">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<div class="w-annc__meta">
|
||||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||||
<span class="w-annc__status label {{status-class}}">{{status}}</span>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<ul class="w-annc__list" data-level="0" data-list="announcements">
|
||||
<li class="w-annc__item row">
|
||||
<div class="w-annc__img-wrap col-sm-4 bullseye">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<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 bullseye" >
|
||||
<a href="{{link_to_show}}" >
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
data-cycle-slides=".w-annc__item" >
|
||||
<li class="w-annc__item">
|
||||
<div class="w-annc__img-wrap bullseye" >
|
||||
<a href="{{link_to_show}}" >
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,33 @@
|
|||
<div class="w-annc widget-announcement-23">
|
||||
<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 ">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</a>
|
||||
</div>
|
||||
<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"><a href="{{link_to_show}}">{{subtitle}}</a></p>
|
||||
</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>
|
||||
|
|
@ -0,0 +1,111 @@
|
|||
<div class="w-annc widget-announcement-24">
|
||||
<div class="w-annc__more-wrap clearfix">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<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 bullseye" >
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="w-annc__content-wrap 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-class}}">{{status}}</span>
|
||||
</span>
|
||||
<span class="w-annc__postdate-wrap" date-format="%Y-%m-%d">
|
||||
<i class="fa fa-calendar-o"></i>
|
||||
<span class="w-annc__postdate">{{postdate}}</span>
|
||||
</span>
|
||||
<span class="w-annc__category-wrap">
|
||||
<i class="fa fa-tasks"></i>
|
||||
<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>
|
||||
<style type="text/css">
|
||||
[data-subpart-id="{{subpart-id}}"] .bullseye{
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
function combineul_{{subpart-id}}(){
|
||||
var parents = $('[data-subpart-id=\"{{subpart-id}}\"] ul.w-annc__list').parent();
|
||||
parents.each(function(i,v){
|
||||
for(var i=1;i<$(v).find('ul.w-annc__list').length;i++)
|
||||
$(v).find('ul.w-annc__list').eq(0).find('>li').eq(-1).after($(v).find('ul.w-annc__list').eq(i).html());
|
||||
var ullength = $(v).find('ul.w-annc__list').length;
|
||||
for(var i = 1;i < ullength;i++)
|
||||
$(v).find('ul.w-annc__list').eq(-1).remove();
|
||||
})
|
||||
};
|
||||
var num;
|
||||
var lilength = $('[data-subpart-id=\"{{subpart-id}}\"] li.w-annc__item').length;
|
||||
function reorganize_{{subpart-id}}(num){
|
||||
combineul_{{subpart-id}}();
|
||||
var parents = $('[data-subpart-id=\"{{subpart-id}}\"] ul.w-annc__list').parent();
|
||||
parents.each(function(i,v){
|
||||
var lilength = $(v).find('li.w-annc__item').length;
|
||||
var ul_length = Math.ceil(lilength/num);
|
||||
for(var ii=1;ii< ul_length;ii++){
|
||||
var clone_ul = $(v).find('ul.w-annc__list').eq(-1).clone();
|
||||
clone_ul.empty();
|
||||
clone_ul.removeClass("active");
|
||||
clone_ul.css("display","");
|
||||
$(v).find('ul.w-annc__list').eq(-1).after(clone_ul.prop("outerHTML"));
|
||||
var lihtml="";
|
||||
if(ii != (ul_length-1)){
|
||||
for(var j=0;j<num;j++){
|
||||
lihtml += $(v).find('li.w-annc__item').eq(ii*num+j).prop("outerHTML");
|
||||
};
|
||||
}else{
|
||||
for(var j=0;j< lilength - num *(ul_length-1) ;j++){
|
||||
lihtml += $(v).find('li.w-annc__item').eq(ii*num+j).prop("outerHTML");
|
||||
};
|
||||
};
|
||||
$(v).find('ul.w-annc__list').eq(-1).html(lihtml);
|
||||
}
|
||||
if(ul_length != 1 )
|
||||
for(var i=0;i< lilength -num ; i++)
|
||||
$(v).find('ul.w-annc__list').eq(0).find("li.w-annc__item").eq(num).remove();
|
||||
})
|
||||
$('[data-subpart-id=\"{{subpart-id}}\"] ul.w-annc__list >li').css('width','calc('+100/num+'% - '+20/20+'em)'); //20px=>li的margin
|
||||
$('[data-subpart-id=\"{{subpart-id}}\"] ul.w-annc__list >li').css("float","left");
|
||||
};
|
||||
$(window).resize(function(){
|
||||
if($(window).width()>1024){
|
||||
reorganize_{{subpart-id}}(4);
|
||||
num=3;
|
||||
}else if($(window).width()>576){
|
||||
reorganize_{{subpart-id}}(4);
|
||||
num=2;
|
||||
}else{
|
||||
reorganize_{{subpart-id}}(4);
|
||||
num=1;
|
||||
}
|
||||
})
|
||||
$(document).ready(function(){
|
||||
if($(window).width()>1024){
|
||||
reorganize_{{subpart-id}}(4);
|
||||
num=3;
|
||||
}else if($(window).width()>576){
|
||||
reorganize_{{subpart-id}}(4);
|
||||
num=2;
|
||||
}else{
|
||||
reorganize_{{subpart-id}}(4);
|
||||
num=1;
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
|
@ -8,7 +8,7 @@
|
|||
<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 bullseye" style="position:relative">
|
||||
<a href="{{link_to_show}}" style="">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -346,6 +346,22 @@
|
|||
"en": "18. 3-Column Standard Image + Text Lite (widget-title, title, subtitle(only display 15 words))"
|
||||
},
|
||||
"thumbnail": "annc_widget18_thumbs.png"
|
||||
},
|
||||
{
|
||||
"filename": "annc_widget23",
|
||||
"name": {
|
||||
"zh_tw": "23.二四欄圖文型態 ( 模組標題, 圖片, 狀態, 日期, 類別, 標題, 副標題 )",
|
||||
"en": "23. 2-4-Column Standard Image + Text (widget-title, image, status, postdate, category, title, subtitle)"
|
||||
},
|
||||
"thumbnail": "annc_widget23_thumbs.png"
|
||||
},
|
||||
{
|
||||
"filename": "annc_widget24",
|
||||
"name": {
|
||||
"zh_tw": "24. 長短兩欄圖文 ( 模組標題, 圖片, 狀態, 日期, 類別, 標題, 副標題 )",
|
||||
"en": "24. longshort2-Column Standard Image + Text (widget-title, image, status, postdate, category, title, subtitle)"
|
||||
},
|
||||
"thumbnail": "annc_widget24_thumbs.png"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
}
|
||||
</style>
|
||||
<article class="s-annc show-announcement">
|
||||
<h1 class="s-annc__show-title">{{title}}</h1>
|
||||
<h3 class="s-annc__show-title annc-title" aria-label="內頁公告標題">{{title}}</h3>
|
||||
|
||||
<ul class="s-annc__meta-wrap list-unstyled no-print">
|
||||
<li class="s-annc__date-wrap s-annc__meta--item">
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
|
|
@ -40,3 +40,6 @@
|
|||
}
|
||||
</style>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -3,13 +3,13 @@
|
|||
<div class="btn-toolbar" id="navigation">
|
||||
<div id="calendar-nav">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-default btn-sm" id="prev_month_btn">
|
||||
<button class="btn btn-default btn-sm" id="prev_month_btn" aria-label="上一個月">
|
||||
<i class="icon-chevron-left"></i>
|
||||
</button>
|
||||
<button class="btn btn-default btn-sm" id="next_month_btn">
|
||||
<button class="btn btn-default btn-sm" id="next_month_btn" aria-label="下一個月">
|
||||
<i class="icon-chevron-right"></i>
|
||||
</button>
|
||||
<button class="btn btn-default btn-sm" id="today_btn"><%=t('calendar.today')%></button>
|
||||
<button class="btn btn-default btn-sm" id="today_btn" aria-label="今天"><%=t('calendar.today')%></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -18,10 +18,10 @@
|
|||
<div id='sec3' class="btn-toolbar">
|
||||
<div class="btn-group calendar_mode">
|
||||
<div data-list="modes_info" data-level="0">
|
||||
<button class="btn btn-default mode_switch btn-sm {{active_class}}" data-mode="{{mode}}" >{{trans}}</button>
|
||||
<button class="btn btn-default mode_switch btn-sm {{active_class}}" data-mode="{{mode}}" aria-label="模式轉換">{{trans}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<button id="refresh_btn" class="btn btn-default btn-sm">
|
||||
<button id="refresh_btn" class="btn btn-default btn-sm" aria-label="重新整理">
|
||||
<i class="icons-cycle"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!-- <div class="latest_slider" data-list="categories" data-level="0">
|
||||
<div class="category_title" data-list="topics" data-level="1">
|
||||
<h3><a href="{{category_link}}">{{category_title}}</a></h3>
|
||||
<h3><a href="{{category_link}}" class="btn btn-primary pull-right">{{category_title}}</a></h3>
|
||||
<div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
@ -13,7 +13,7 @@
|
|||
<img src="{{img_url_thumb}}" alt="{{title}}">
|
||||
</div>
|
||||
<div class="epaper-rightContent col-lg-7 col-xs-12" >
|
||||
<h4><a href="{{link_to_show}}">{{title}}</a></h4>
|
||||
<h4><a href="{{link_to_show}}" aria-label="前往{{title}}" title="{{title}}" class="btn btn-primary pull-right">{{title}}</a></h4>
|
||||
<div class="epaper-description">{{description}}</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!-- <div class="latest_slider" data-list="categories" data-level="0">
|
||||
<div class="category_title" data-list="topics" data-level="1">
|
||||
<h3><a href="{{category_link}}">{{category_title}}</a></h3>
|
||||
<h3><a href="{{category_link}}" class="btn btn-primary pull-right">{{category_title}}</a></h3>
|
||||
<div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
@ -9,14 +9,14 @@
|
|||
<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}}" aria-label="前往{{title}}" title="{{title}}">{{title}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{title}}" title="{{title}}"><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 class="epaper-description"><a href="{{link_to_show}} aria-label="前往{{title}}" title="{{title}}"" class="btn btn-primary pull-right">{{description}}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<ul class="w-annc__list" data-level="0" data-list="event_news">
|
||||
<li class="w-annc__item">
|
||||
<div class="w-annc__img-wrap bullseye">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,7 @@
|
|||
<div class="w-annc widget-announcement-4 widget-announcement-15 event-news-15" style="position:relative;">
|
||||
<div class="w-annc__more-wrap clearfix">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= t("event_news.more") %></a>
|
||||
</div>
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<div style="position: absolute;top: 58%;width:100%;z-index:101;">
|
||||
<div style="">
|
||||
<button id="prev-{{subpart-id}}" class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;background: border: 0;background-size: contain;position: absolute;transition:.3s; left: 0.6%;color: #ffffff;
|
||||
|
|
@ -26,7 +23,7 @@
|
|||
data-cycle-slides=".w-annc__item" >
|
||||
<li class="w-annc__item">
|
||||
<div class="w-annc__img-wrap bullseye" style="position:relative">
|
||||
<a href="{{link_to_show}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
@ -52,6 +49,10 @@
|
|||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="w-annc__more-wrap clearfix">
|
||||
|
||||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= t("event_news.more") %></a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,9 @@
|
|||
<ul class="w-annc__list" data-level="0" data-list="event_news">
|
||||
<li class="w-annc__item row">
|
||||
<div class="w-annc__img-wrap col-sm-4 bullseye">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</a>
|
||||
</div>
|
||||
<div class="w-annc__content-wrap col-sm-8">
|
||||
<div class="w-annc__meta">
|
||||
|
|
|
|||
|
|
@ -1,14 +1,11 @@
|
|||
<div class="w-annc widget-announcement-20">
|
||||
<div class="w-annc__more-wrap clearfix">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
|
||||
</div>
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<ul class="w-annc__list row" data-level="0" data-list="event_news">
|
||||
<li class="w-annc__item col-md-4">
|
||||
<div class="w-annc__img-wrap bullseye" >
|
||||
<a href="{{link_to_show}}" >
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
@ -34,6 +31,10 @@
|
|||
</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>
|
||||
<script>
|
||||
function combineul_{{subpart-id}}(){
|
||||
|
|
|
|||
|
|
@ -1,10 +1,7 @@
|
|||
<div class="w-annc widget-announcement-4 w-annc event-news-21">
|
||||
<div class="w-annc__more-wrap clearfix">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
|
||||
</div>
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<div style="position: absolute;top: 62%;width:100%; z-index: 101;">
|
||||
<div style="">
|
||||
<button id="prev-{{subpart-id}}" class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;background: border: 0;background-size: contain;position: absolute;transition:.3s; left: 0.6%;color: #ffffff;
|
||||
|
|
@ -26,7 +23,7 @@
|
|||
data-cycle-slides=".w-annc__item" >
|
||||
<li class="w-annc__item">
|
||||
<div class="w-annc__img-wrap bullseye" >
|
||||
<a href="{{link_to_show}}" >
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
@ -52,4 +49,7 @@
|
|||
</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>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
<ul class="w-annc__list row" data-level="0" data-list="event_news">
|
||||
<li class="w-annc__item col-md-4">
|
||||
<div class="w-annc__img-wrap bullseye">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<ul class="w-annc__list row" data-level="0" data-list="event_news">
|
||||
<li class="w-annc__item col-md-4">
|
||||
<div class="w-annc__img-wrap bullseye" style="position:relative">
|
||||
<a href="{{link_to_show}}" style="">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{widget-title}}" title="{{widget-title}}">
|
||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||
<div class="transitionfade"></div>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<article class="s-annc show-annc">
|
||||
<h3 class="s-annc__show-title s-annc-title">{{title}}</h3>
|
||||
<h3 class="s-annc__show-title event-annc-title" aria-label="內頁活動公告標題">{{title}}</h3>
|
||||
|
||||
<ul class="s-annc__meta-wrap list-unstyled no-print">
|
||||
<li class="s-annc__date-wrap s-annc__meta--item">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<article class="s-annc show-annc2">
|
||||
<h3 class="s-annc__show-title">{{title}}</h3>
|
||||
<h3 class="s-annc__show-title event-annc-title" aria-label="內頁活動公告標題">{{title}}</h3>
|
||||
|
||||
<ul class="s-annc__meta-wrap list-unstyled no-print">
|
||||
<li class="s-annc__tag-wrap s-annc__meta--item ">
|
||||
|
|
|
|||
|
|
@ -4,19 +4,20 @@
|
|||
</h3>
|
||||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content col-sm-3">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<div class="index-content-inner">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
</div>
|
||||
<section class="index-part">
|
||||
</a>
|
||||
<div class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
</h4>
|
||||
<div class="index-img-description">{{album-description}}</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,17 +5,18 @@
|
|||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content">
|
||||
<div class="index-content-inner clearfix row">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<div class="index-pic col-xs-5 col-sm-2">
|
||||
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
</div>
|
||||
<section class="index-part col-xs-7 col-sm-10">
|
||||
</a>
|
||||
<div class="index-part col-xs-7 col-sm-10">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
</h4>
|
||||
<div class="index-img-description">{{album-description}}</div>
|
||||
</section>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,18 +4,19 @@
|
|||
</h3>
|
||||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content col-sm-3">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<div class="index-content-inner">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
</div>
|
||||
<section class="index-part">
|
||||
</a>
|
||||
<div class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
</h4>
|
||||
</section>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,16 +5,17 @@
|
|||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content">
|
||||
<div class="index-content-inner clearfix row">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<div class="index-pic col-xs-5 col-sm-2">
|
||||
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
</div>
|
||||
<section class="index-part col-xs-7 col-sm-10">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}">{{album-name}}</a>
|
||||
</h4>
|
||||
</section>
|
||||
</a>
|
||||
<div class="index-part col-xs-7 col-sm-10">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,29 +5,31 @@
|
|||
<link rel="stylesheet" type="text/css" href="/assets/gallery_card.css">
|
||||
<div class="row" data-level="0" data-list="albums">
|
||||
<div class="card card-flip h-100">
|
||||
<a href="{{link_to_show}}">
|
||||
<div class="card-front">
|
||||
<div class="card-body" style="padding:0;">
|
||||
<img
|
||||
src="{{thumb-src}}"
|
||||
alt="{{alt_title}}"
|
||||
>
|
||||
<div class="card-footer">
|
||||
<h3 class="card-title">{{album-name}}</h3>
|
||||
|
||||
<div class="card-front">
|
||||
<div class="card-body" style="padding:0;">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<img src="{{thumb-src}}"alt="{{alt_title}}">
|
||||
</a>
|
||||
<div class="card-footer">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<h3 class="card-title">{{album-name}}</h3>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-back">
|
||||
<div class="card-body" style="background-color: {{album_color}};color: {{album_card_text_color}};">
|
||||
<h3 class="card-title">{{album-name}}</h3>
|
||||
<div class="card-button-group">
|
||||
<a href="{{link_to_show}}" class="btn btn-secondary view ">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}" class="btn btn-secondary view ">
|
||||
<i class="fa fa-link" aria-hidden="true"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,18 +4,20 @@
|
|||
</h3>
|
||||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content col-sm-3">
|
||||
<a href="{{link_to_show}}">
|
||||
|
||||
<div class="index-content-inner">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
</div>
|
||||
</a>
|
||||
<section class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
</h4>
|
||||
</section>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -47,6 +47,14 @@
|
|||
"en" : "6. Search Table List (category title and customized profile data)"
|
||||
},
|
||||
"thumbnail" : "member_index1_thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "member_index7",
|
||||
"name" : {
|
||||
"zh_tw" : "7. 三欄名片式 ( 類別標題, 個人照片, 個人資料等自訂欄位 )",
|
||||
"en" : "7. three Columns (category title, photo and customized profile data)"
|
||||
},
|
||||
"thumbnail" : "member_index5_thumb.png"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<div class="i-member index-member-5">
|
||||
<div data-list="roles" data-level="0">
|
||||
<div class="i-member-section">
|
||||
<div data-level="1" data-list="status-list">
|
||||
<h3 class="i-member-status-title">{{status-title}}</h3>
|
||||
<div class="i-member-list row" data-level="2" data-list="members">
|
||||
<div class="i-member-item col-sm-4" href="{{link_to_show}}">
|
||||
<div class="i-member-item-inner clearfix">
|
||||
<div class="i-member-pic-wrap">
|
||||
<a href="{{link_to_show}}" title="{{name}}">
|
||||
<img class="i-member-pic" src="{{image}}" alt="{{name}}" title="{{name}}">
|
||||
</a>
|
||||
</div>
|
||||
<div class="i-member-profile-data-wrap">
|
||||
<ul class="i-member-profile-list" data-list="profile_data" data-level="3">
|
||||
<li class="i-member-profile-item">
|
||||
<span class="i-member-title {{title_class}}">{{title}}</span>
|
||||
<span class="i-member-value {{value_class}}">{{value}}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{pagination_goes_here}}
|
||||
<script>
|
||||
for(var i = 0;i < $('.i-member img').length ; i++){
|
||||
if($('.i-member img').eq(i).attr('alt')=="" ){
|
||||
$('.i-member img').eq(i).attr('alt','noname');
|
||||
$('.i-member img').eq(i).attr('title','noname');
|
||||
$('.i-member img').eq(i).parent().attr('title','noname');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 6.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
|
|
@ -6,7 +6,7 @@
|
|||
<div class="btn-toolbar" id="navigation">
|
||||
<div id="calendar-nav">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-default btn-sm" id="today_btn">{{today}}</button>
|
||||
<button class="btn btn-default btn-sm" id="today_btn" aria-label="今天" title="今天">{{today}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -14,19 +14,19 @@
|
|||
</div>
|
||||
<div id='sec3' class="btn-toolbar">
|
||||
<div class="btn-group calendar_mode">
|
||||
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridDay" >{{day}}</button>
|
||||
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridWeek" >{{week}}</button>
|
||||
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" >{{month}}</button>
|
||||
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridDay" aria-label="日模式" title="日模式">{{day}}</button>
|
||||
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridWeek" aria-label="周模式" title="周模式">{{week}}</button>
|
||||
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" aria-label="月模式" title="月模式">{{month}}</button>
|
||||
</div>
|
||||
<button id="refresh_btn" class="btn btn-default btn-sm">
|
||||
<i class="icons-cycle"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<button class="btn btn-default btn-sm" id="prev_month_btn">
|
||||
<button class="btn btn-default btn-sm" id="prev_month_btn" aria-label="上一個月" title="上一個月">
|
||||
<i class="icon-chevron-left"></i>
|
||||
</button>
|
||||
<button class="btn btn-default btn-sm" id="next_month_btn">
|
||||
<button class="btn btn-default btn-sm" id="next_month_btn" aria-label="下一個月" title="下一個月">
|
||||
<i class="icon-chevron-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<ul class="i-annc__list" data-level="0" data-list="publications">
|
||||
<li class="i-annc__item row">
|
||||
<div class="i-annc__img-wrap col-sm-4">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{title}}" title="{{title}}">
|
||||
<img class="i-annc__img" src="{{cover}}" alt="{{cover_description}}" title="{{cover_description}}">
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<h3 class="i-annc__page-title">{{page-title}}</h3>
|
||||
<ul class="i-annc__list row" data-level="0" data-list="publications">
|
||||
<li class="i-annc__item col-md-4">
|
||||
<a href="{{link_to_show}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{title}}" title="{{title}}">
|
||||
<div class="i-annc__img-wrap">
|
||||
<img class="i-annc__img" src="{{cover}}" alt="{{cover_description}}" title="{{cover_description}}">
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -94,9 +94,9 @@
|
|||
<thead>
|
||||
<tr data-list="head-columns" data-level="0">
|
||||
<th class="col-ken">
|
||||
<a href="{{sort-url}}" class="{{sort}}"><i class="universal-th-icon fa fa-{{sort-class}}"></i></a>
|
||||
<a href="{{sort-url}}" class="{{sort}}" title="前往分類連結"><i class="universal-th-icon fa fa-{{sort-class}}"></i><span class="sr-only">前往分類連結</span></a>
|
||||
<div class="dropdown universal-dropdown {{search}}">
|
||||
<button class="btn btn-sm" id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<button class="btn btn-sm" id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="搜尋" title="搜尋" role="button">
|
||||
<i class="fa fa-search"></i>
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
|
|
|
|||
|
|
@ -72,9 +72,9 @@
|
|||
<thead>
|
||||
<tr data-list="head-columns" data-level="0">
|
||||
<th class="col-ken">
|
||||
<a href="{{sort-url}}" class="{{sort}}"><i class="universal-th-icon fa fa-{{sort-class}}"></i></a>
|
||||
<a href="{{sort-url}}" class="{{sort}}" title="前往分類連結"><i class="universal-th-icon fa fa-{{sort-class}}"></i><span class="sr-only">前往分類連結</span></a>
|
||||
<div class="dropdown universal-dropdown {{search}}">
|
||||
<button class="btn btn-sm" id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<button class="btn btn-sm" id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="搜尋" title="搜尋" role="button">
|
||||
<i class="fa fa-search"></i>
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
|
|
|
|||
|
|
@ -2,18 +2,23 @@
|
|||
<ul class="video_data_wrap col-sm-12" data-list="videos" data-level="0">
|
||||
<li class="video_data col-xs-12 col-sm-4" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}">
|
||||
<a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}">
|
||||
<div class="video_linkwrapper3">
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
<div class="video_info">
|
||||
<div class="video_group_time">{{video_post_agency}} | {{video_postdate}}</div>
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div>{{video_tag}}</div></div>
|
||||
<div class="video_title"><h5>{{video_title}}</h5></div>
|
||||
<div class="video_desc">{{video_desc}}</div>
|
||||
<div class="video_linkwrapper">
|
||||
<div class="videohover">
|
||||
<div class="view_info">
|
||||
<!-- <span><img src="{{hd_icon_url}}" alt="HD"></span> -->
|
||||
<span><img src="{{view_icon_url}}" alt="{{view_count_trans}}>">x {{view_count}}</span>
|
||||
<span>{{view_count}}</span>
|
||||
</div>
|
||||
<div class="Video__Player"><button class="Video__PlayerButton"></button></div>
|
||||
<div class="videoduration"></div>
|
||||
</div>
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
<div class="video_info">
|
||||
<div class="video_length">{{video_duration}}</div>
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div class="video_tags2">{{video_tag}}</div></div>
|
||||
<div class="video_keyword">{{video_keyword}}</div>
|
||||
<div class="video_group_time">{{video_postdate}}</div>
|
||||
<div class="video_title"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}"><h5>{{video_title}}</h5></a></div>
|
||||
<div class="video_desc"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}">{{video_desc}}</a></div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
|
|
@ -40,3 +45,6 @@
|
|||
}
|
||||
</style>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,65 @@
|
|||
<div class="w-video_data video_data-widget-2">
|
||||
<ul class="video_data_wrap col-sm-12" data-list="videos" data-level="0">
|
||||
<li class="video_data col-xs-12 col-sm-4" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}" >
|
||||
<a href="{{video_show_url}}" title="{{video_title_escape}}">
|
||||
<div class="video_linkwrapper2">
|
||||
<div class="videohover">
|
||||
<div class="view_info">
|
||||
<span>{{view_count}}</span>
|
||||
</div>
|
||||
<div class="Video__Player"><button class="Video__PlayerButton"></button></div>
|
||||
<div class="videoduration"></div>
|
||||
</div>
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="video_info">
|
||||
<div class="video_length">{{video_duration}}</div>
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div class="video_tags2">{{video_tag}}</div></div>
|
||||
<div class="video_keyword">{{video_keyword}}</div>
|
||||
<div class="video_group_time">{{video_postdate}}</div>
|
||||
<div class="video_title"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}"><h5>{{video_title}}</h5></a></div>
|
||||
<div class="video_desc"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}">{{video_desc}}</a></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<style>
|
||||
|
||||
.video_tags2{
|
||||
float: left;
|
||||
min-width: 5em;
|
||||
border: 1px solid;
|
||||
border-radius: 2px;
|
||||
background-color: #1515154d;
|
||||
}
|
||||
.video_title h5{
|
||||
@extend .i-title;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.view_info{
|
||||
float: right;
|
||||
}
|
||||
.view_info img{
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$(".video_keyword").each(function () {
|
||||
$(this).insertAfter($(this).siblings(".video_tag").find(".video_tags2"));
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
<div class="w-video_data video_data-widget-3">
|
||||
<div class="btnwrapper" style="position: absolute;top: 50%;width:100%; z-index: 101;">
|
||||
<div style="">
|
||||
<button id="prev-{{subpart-id}}" class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;background: border: 0;background-size: contain;position: absolute;transition:.3s; left: 0.6%;
|
||||
color: #909090;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
border: none; z-index: 2;"><i class="fa fa-angle-left prev-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %></span></button>
|
||||
<button id="next-{{subpart-id}}" class="btn-right" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>" style="float: right;;height: 2.5em; width: 2.5em;background-size: contain;border: 0;position: absolute;transition:.3s;right: 0.6%;
|
||||
color: #909090;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
border: none; z-index: 2;"><i class="fa fa-angle-right next-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %></span></button>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="video_data_wrap col-sm-12 cycle-slideshow" data-list="videos" data-level="0" data-cycle-fx="carousel"
|
||||
data-cycle-timeout="0"
|
||||
data-cycle-carousel-visible="3"
|
||||
data-cycle-carousel-fluid="true"
|
||||
data-cycle-next="#next-{{subpart-id}}"
|
||||
data-cycle-prev="#prev-{{subpart-id}}"
|
||||
data-cycle-slides=".video_data"
|
||||
>
|
||||
<li class="video_data col-xs-12 col-sm-4" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}" >
|
||||
<a href="{{video_show_url}}" title="{{video_title_escape}}">
|
||||
<div class="video_linkwrapper3">
|
||||
<div class="videohover">
|
||||
<div class="view_info">
|
||||
<span>{{view_count}}</span>
|
||||
</div>
|
||||
<div class="Video__Player"><button class="Video__PlayerButton"></button></div>
|
||||
<div class="videoduration"></div>
|
||||
</div>
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="video_info">
|
||||
<div class="video_length">{{video_duration}}</div>
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div class="video_tags2">{{video_tag}}</div></div>
|
||||
<div class="video_keyword">{{video_keyword}}</div>
|
||||
<div class="video_group_time">{{video_postdate}}</div>
|
||||
<div class="video_title"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}"><h5>{{video_title}}</h5></a></div>
|
||||
<div class="video_desc"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}">{{video_desc}}</a></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<style>
|
||||
|
||||
.video_title h5{
|
||||
@extend .i-title;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.view_info{
|
||||
float: right;
|
||||
}
|
||||
.view_info img{
|
||||
margin-right: 5px;
|
||||
}
|
||||
.Video__Player{
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.Video__PlayerButton{
|
||||
display: inline-block;
|
||||
padding-bottom: 0px;
|
||||
padding-top: 0px;
|
||||
border-radius: 50%;
|
||||
border: 0px;
|
||||
background-color: rgb(255, 81, 0);
|
||||
background: url(/assets/btn-play.svg) no-repeat;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
transition: 0.5s;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
&:hover{
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view_info{
|
||||
max-height: 100%;
|
||||
border-radius: 2px;
|
||||
font-size: 0.875rem;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
padding: 0px 8px;
|
||||
background-color: #000000cc;
|
||||
color: rgb(255, 255, 255);
|
||||
z-index: 10;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
border: 1px solid transparent;
|
||||
line-height: 1.45;
|
||||
span{
|
||||
color:#fff;
|
||||
}
|
||||
&:before{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
background: url(/assets/icon-view@2x.png) no-repeat;
|
||||
position: relative;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,135 @@
|
|||
<div class="w-video_data video_data-widget-4">
|
||||
<div class="btnwrapper" style="position: absolute;
|
||||
top: 19%;
|
||||
width: 97%;
|
||||
z-index: 101;
|
||||
margin-left: -0.5em;">
|
||||
<div style="">
|
||||
<button id="prev-{{subpart-id}}" class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;background: border: 0;background-size: contain;position: absolute;transition:.3s; left: 0.6%;
|
||||
color: #909090;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
border: none; z-index: 2;"><i class="fa fa-angle-left prev-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %></span></button>
|
||||
<button id="next-{{subpart-id}}" class="btn-right" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>" style="float: right;;height: 2.5em; width: 2.5em;background-size: contain;border: 0;position: absolute;transition:.3s;right: 0.6%;
|
||||
color: #909090;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
border: none; z-index: 2;"><i class="fa fa-angle-right next-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %></span></button>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="video_data_wrap col-sm-12 cycle-slideshow" data-list="videos" data-level="0" data-cycle-fx="carousel"
|
||||
data-cycle-timeout="0"
|
||||
data-cycle-carousel-visible="3"
|
||||
data-cycle-carousel-fluid="true"
|
||||
data-cycle-next="#next-{{subpart-id}}"
|
||||
data-cycle-prev="#prev-{{subpart-id}}"
|
||||
data-cycle-slides=".video_data"
|
||||
>
|
||||
<li class="video_data col-xs-12 col-sm-4" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}" >
|
||||
<a href="{{video_show_url}}" title="{{video_title_escape}}">
|
||||
<div class="video_linkwrapper4">
|
||||
<div class="videohover">
|
||||
<div class="view_info">
|
||||
<span>{{view_count}}</span>
|
||||
</div>
|
||||
<div class="Video__Player"><button class="Video__PlayerButton"></button></div>
|
||||
<div class="videoduration"></div>
|
||||
</div>
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="video_info">
|
||||
<div class="video_length">{{video_duration}}</div>
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div class="video_tags2">{{video_tag}}</div></div>
|
||||
<div class="video_keyword">{{video_keyword}}</div>
|
||||
<div class="video_group_time">{{video_postdate}}</div>
|
||||
<div class="video_title"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}"><h5>{{video_title}}</h5></a></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<style>
|
||||
|
||||
.video_title h5{
|
||||
@extend .i-title;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.view_info{
|
||||
float: right;
|
||||
}
|
||||
.view_info img{
|
||||
margin-right: 5px;
|
||||
}
|
||||
.Video__Player{
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.Video__PlayerButton{
|
||||
display: inline-block;
|
||||
padding-bottom: 0px;
|
||||
padding-top: 0px;
|
||||
border-radius: 50%;
|
||||
border: 0px;
|
||||
background-color: rgb(255, 81, 0);
|
||||
background: url(/assets/btn-play.svg) no-repeat;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
transition: 0.5s;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
&:hover{
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view_info{
|
||||
max-height: 100%;
|
||||
border-radius: 2px;
|
||||
font-size: 0.875rem;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
padding: 0px 8px;
|
||||
background-color: #000000cc;
|
||||
color: rgb(255, 255, 255);
|
||||
z-index: 10;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
border: 1px solid transparent;
|
||||
line-height: 1.45;
|
||||
span{
|
||||
color:#fff;
|
||||
}
|
||||
&:before{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
background: url(/assets/icon-view@2x.png) no-repeat;
|
||||
position: relative;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,156 @@
|
|||
<div class="w-video_data video_data-widget-5 row">
|
||||
<ul class="video_data_wrap col-sm-8 cycle-slideshow"
|
||||
data-list="videos"
|
||||
data-level="0"
|
||||
data-cycle-fx="scrollHorz"
|
||||
data-cycle-timeout="0"
|
||||
data-cycle-slides=".video_data"
|
||||
data-cycle-pager="#pager-{{subpart-id}}"
|
||||
data-cycle-next="#next-{{subpart-id}}"
|
||||
data-cycle-prev="#prev-{{subpart-id}}"
|
||||
data-cycle-pager-template="<a href='#' class='pager-item' data-slide-num=''><h5></h5></a>">
|
||||
<li class="video_data col-xs-12 col-sm-12" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}" data-title="{{video_title}}">
|
||||
<a href="{{video_show_url}}" title="{{video_title_escape}}">
|
||||
<div class="video_linkwrapper5">
|
||||
<div class="videohover">
|
||||
<div class="view_info">
|
||||
<span>{{view_count}}</span>
|
||||
</div>
|
||||
<div class="Video__Player"><button class="Video__PlayerButton"></button></div>
|
||||
<div class="videoduration"></div>
|
||||
</div>
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
</a>
|
||||
<div class="video_group_time">{{video_postdate}}</div>
|
||||
<div class="video_info">
|
||||
<div class="video_length">{{video_duration}}</div>
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div class="video_tags2">{{video_tag}}</div></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div id="pager-{{subpart-id}}" class="cycle-pager col-sm-4"></div>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
setTimeout(function () {
|
||||
$(".w-video_data").each(function () {
|
||||
var $container = $(this);
|
||||
var videoTitles = $container.find(".video_data")
|
||||
.not(".cycle-sentinel") // 過濾掉 Cycle2 產生的複製元素
|
||||
.map(function () {
|
||||
return $(this).attr("data-title");
|
||||
})
|
||||
.get();
|
||||
|
||||
// 只影響「當前」輪播的 Pager Items
|
||||
$container.find(".cycle-pager .pager-item").slice(0, videoTitles.length).each(function (index) {
|
||||
var title = videoTitles[index]; //確保順序正確
|
||||
$(this).attr("data-slide-num", index);
|
||||
$(this).find("h5").text(title);
|
||||
});
|
||||
|
||||
// 只讓「當前」的 Pager 綁定點擊事件
|
||||
$container.find(".cycle-pager").on("click", ".pager-item", function (e) {
|
||||
e.preventDefault();
|
||||
var index = $(this).attr("data-slide-num");
|
||||
|
||||
// 只影響「當前」輪播的 .cycle-slideshow
|
||||
$container.find(".cycle-slideshow").cycle("goto", index);
|
||||
});
|
||||
});
|
||||
}, 300); // 延長時間確保 DOM 生成
|
||||
setTimeout(function () {
|
||||
$(".w-video_data.video_data-widget-5").each(function () { //限制只影響 .video_data-widget-5
|
||||
var $container = $(this);
|
||||
var $items = $container.find(".video_data").not(".cycle-sentinel"); // 過濾 Cycle2 產生的元素
|
||||
var $pager = $container.find(".cycle-pager"); // 取得 Pager 容器
|
||||
var totalItems = $items.length;
|
||||
var itemsPerPage = 5;
|
||||
var currentIndex = 0;
|
||||
|
||||
// 取得所有 video_data 的標題
|
||||
var videoTitles = $items.map(function () {
|
||||
return $(this).attr("data-title");
|
||||
}).get();
|
||||
|
||||
// 生成對應的 .pager-item
|
||||
var pagerHTML = "";
|
||||
videoTitles.forEach(function (title, index) {
|
||||
pagerHTML += `<a href="#" class="pager-item" data-slide-num="${index}"><h5>${title}</h5></a>`;
|
||||
});
|
||||
|
||||
$pager.html(pagerHTML); // 插入新的 Pager
|
||||
var $pagerItems = $pager.find(".pager-item"); // 重新抓取 .pager-item
|
||||
$pagerItems.hide(); // 先全部隱藏
|
||||
|
||||
// 插入按鈕（確保不會重複）
|
||||
if ($pager.next(".pager-controls").length === 0) {
|
||||
$pager.after(`
|
||||
<div class="pager-controls">
|
||||
<button class="prev-btn"><i class="fa fa-angle-left prev-button" aria-hidden="true" style="font-size: 1.5rem;"></i></button>
|
||||
<button class="next-btn"><i class="fa fa-angle-right next-button" aria-hidden="true" style="font-size: 1.5rem;"></i></button>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
|
||||
var $prevBtn = $pager.next(".pager-controls").find(".prev-btn");
|
||||
var $nextBtn = $pager.next(".pager-controls").find(".next-btn");
|
||||
|
||||
// 更新顯示的 pager-item 和 video_data
|
||||
function updateVisibleItems() {
|
||||
var firstVisibleIndex = currentIndex; // 取得當前顯示的第一個 Index
|
||||
var lastVisibleIndex = Math.min(currentIndex + itemsPerPage, totalItems);
|
||||
|
||||
// 隱藏所有
|
||||
$items.hide().removeClass("cycle-slide-active");
|
||||
$pagerItems.hide().removeClass("cycle-pager-active");
|
||||
|
||||
// 顯示當前的 3 個 pager-item
|
||||
var visiblePagerItems = $pagerItems.slice(firstVisibleIndex, lastVisibleIndex).show();
|
||||
|
||||
// 加上 `cycle-pager-active` 到第一個
|
||||
var firstPagerItem = visiblePagerItems.first().addClass("cycle-pager-active");
|
||||
|
||||
// 取得對應的 video_data
|
||||
var firstPagerIndex = firstPagerItem.data("slide-num");
|
||||
var $firstVideoItem = $items.eq(firstPagerIndex).show().addClass("cycle-slide-active");
|
||||
|
||||
console.log(`顯示的第一個 pager-item 索引: ${firstPagerIndex}`);
|
||||
}
|
||||
|
||||
// 綁定 Pager 點擊事件
|
||||
$pager.on("click", ".pager-item", function (e) {
|
||||
e.preventDefault();
|
||||
var index = $(this).data("slide-num"); // 獲取對應 index
|
||||
|
||||
$pagerItems.removeClass("cycle-pager-active");
|
||||
$(this).addClass("cycle-pager-active");
|
||||
|
||||
$items.hide().removeClass("cycle-slide-active").eq(index).show().addClass("cycle-slide-active");
|
||||
});
|
||||
|
||||
// 綁定上一頁按鈕
|
||||
$prevBtn.off("click").on("click", function () {
|
||||
if (currentIndex > 0) {
|
||||
currentIndex -= itemsPerPage;
|
||||
updateVisibleItems();
|
||||
}
|
||||
});
|
||||
|
||||
// 綁定下一頁按鈕
|
||||
$nextBtn.off("click").on("click", function () {
|
||||
if (currentIndex + itemsPerPage < totalItems) {
|
||||
currentIndex += itemsPerPage;
|
||||
updateVisibleItems();
|
||||
}
|
||||
});
|
||||
|
||||
// 初始化顯示
|
||||
updateVisibleItems();
|
||||
});
|
||||
}, 300); // 延長時間確保 DOM 生成
|
||||
});
|
||||
|
||||
</script>
|
||||
|
|
@ -9,6 +9,42 @@
|
|||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "video_pro_widget2",
|
||||
"force_cover": "true",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 影片列表2 ( 縮圖, 影片資訊, 頁面連結)",
|
||||
"en" : "2. Video List 2 ( snapshot, video info, page link)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "video_pro_widget3",
|
||||
"force_cover": "true",
|
||||
"name" : {
|
||||
"zh_tw" : "3. 影片列表倫波 ( 縮圖, 影片資訊, 頁面連結)",
|
||||
"en" : "3.carousel-Video List ( snapshot, video info, page link)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "video_pro_widget4",
|
||||
"force_cover": "true",
|
||||
"name" : {
|
||||
"zh_tw" : "4. 影片列表倫波 ( 縮圖, 頁面連結)",
|
||||
"en" : "4.carousel-Video List ( snapshot, page link)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "video_pro_widget5",
|
||||
"force_cover": "true",
|
||||
"name" : {
|
||||
"zh_tw" : "5. 大圖影片列表倫波 ( 縮圖, 影片資訊, 頁面連結)",
|
||||
"en" : "5.bigcarousel-Video List ( snapshot, video info, page link)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "video_pro_widget_jqcloud1",
|
||||
"force_cover": "true",
|
||||
|
|
@ -51,8 +87,8 @@
|
|||
"filename" : "video_pro_index3",
|
||||
"force_cover": "true",
|
||||
"name" : {
|
||||
"zh_tw" : "3. 影片列表2 + 懸浮框 ( 縮圖, 影片資訊)",
|
||||
"en" : "3. Video List 2 + Modal window ( snapshot, video info)"
|
||||
"zh_tw" : "3. 三欄 影片列表2 + 懸浮框 ( 縮圖, 影片資訊)",
|
||||
"en" : "3. 3col-Video List 2 + Modal window ( snapshot, video info)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
|
|
@ -60,8 +96,17 @@
|
|||
"filename" : "video_pro_index_post_agency1",
|
||||
"force_cover": "true",
|
||||
"name" : {
|
||||
"zh_tw" : "4. 影片列表3 + 發佈單位篩選 ( 縮圖, 影片資訊, 關鍵字, 頁面連結)",
|
||||
"en" : "4. Video List 3 + Post Agency filter ( snapshot, video info, keyword, page link)"
|
||||
"zh_tw" : "4. 三欄 影片列表3 + 發佈單位篩選 ( 縮圖, 影片資訊, 關鍵字, 頁面連結)",
|
||||
"en" : "4. 3col-Video List 3 + Post Agency filter ( snapshot, video info, keyword, page link)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "video_pro_index4",
|
||||
"force_cover": "true",
|
||||
"name" : {
|
||||
"zh_tw" : "4. 四欄影片列表1 + 類別 + 搜尋 ( 縮圖, 影片資訊, 頁面連結)",
|
||||
"en" : "4. 4col-Video List 1 + Category filter + Search ( snapshot, video info, page link)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,17 +3,17 @@
|
|||
<ul class="video_data_wrap col-sm-12" data-list="videos" data-level="0">
|
||||
<li class="video_data col-sm-12 row" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}">
|
||||
<a class=" video_link" href="{{video_show_url}}" title="{{video_title_escape}}">
|
||||
<div class="video_linkwrapper3 col-sm-3">
|
||||
<div class="video_linkwrapper3 col-sm-4">
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
<div class="col-sm-9 video_info">
|
||||
<div class="col-sm-8 video_info">
|
||||
<div class="video_group_time">{{video_post_agency}} | {{video_postdate}}</div>
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div>{{video_tag}}</div></div>
|
||||
<div class="video_title"><h5>{{video_title}}</h5></div>
|
||||
<div class="video_desc">{{video_desc}}</div>
|
||||
<div class="view_info">
|
||||
<!-- <span><img src="{{hd_icon_url}}" alt="HD"></span> -->
|
||||
<span><img src="{{view_icon_url}}" alt="{{view_count_trans}}>">x {{view_count}}</span>
|
||||
<span>x {{view_count}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -46,13 +46,7 @@
|
|||
}
|
||||
.video_data{
|
||||
margin-bottom: 1em;
|
||||
padding: 0 0.5em;
|
||||
.video_link{
|
||||
background: #f3f3f3;
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 1em;
|
||||
}
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
.video_info {
|
||||
margin: 1em 0;
|
||||
|
|
|
|||
|
|
@ -47,12 +47,6 @@
|
|||
.video_data{
|
||||
padding: 0 0.5em;
|
||||
margin-bottom: 1em;
|
||||
.video_link{
|
||||
background: #f3f3f3;
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 1em;
|
||||
}
|
||||
}
|
||||
.video_info {
|
||||
margin: 1em 0;
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
</div>
|
||||
<h3 class="i-annc__page-title">{{page-title}}</h3>
|
||||
<ul class="video_data_wrap col-sm-12" data-list="videos" data-level="0">
|
||||
<li class="video_data col-sm-6" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}">
|
||||
<li class="video_data col-sm-4" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}">
|
||||
<a class="video_link" href="javascript:void(0)" title="{{video_title_escape}}" data-api-url="{{api_url}}">
|
||||
<div class="video_snapshot_wrap video_linkwrapper2">
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
|
|
@ -32,13 +32,7 @@
|
|||
<style>
|
||||
.video_data{
|
||||
margin-bottom: 1em;
|
||||
padding: 0 0.5em;
|
||||
.video_link{
|
||||
background: #f3f3f3;
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 1em;
|
||||
}
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
.video_info{
|
||||
margin: 1em 0;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,173 @@
|
|||
<div class="i-video_data video_data-index-4">
|
||||
<h3 class="i-annc__page-title">{{page-title}}</h3>
|
||||
<div class="video_filter_area col-sm-12">
|
||||
<form>
|
||||
<div class="category_box col-sm-12">
|
||||
<select name="category" id="filter_category_box" data-list="categories" data-level="0">
|
||||
{{option}}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<ul class="video_data_wrap col-sm-12" data-list="videos" data-level="0">
|
||||
<li class="video_data col-sm-3" data-video-url="{{video_url}}" data-video-webm-url="{{video_webm_url}}" data-type="{{video_type}}">
|
||||
<a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}">
|
||||
<div class="video_linkwrapper2">
|
||||
<div class="videohover">
|
||||
<div class="view_info">
|
||||
<span>{{view_count}}</span>
|
||||
</div>
|
||||
<div class="Video__Player"><button class="Video__PlayerButton"></button></div>
|
||||
<div class="videoduration"></div>
|
||||
</div>
|
||||
<img class="video_snapshot" src="{{snapshot_url}}"/>
|
||||
</div>
|
||||
<div class="video_info">
|
||||
<div data-list="video_tags" data-level="1" class="video_tag"><div class="video_tags2">{{video_tag}}</div></div>
|
||||
<div class="video_group_time">{{video_postdate}}</div>
|
||||
<div class="video_title"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}"><h5>{{video_title}}</h5></a></div>
|
||||
<div class="video_desc"><a class="video_link" href="{{video_show_url}}" title="{{video_title_escape}}">{{video_desc}}</a></div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<style>
|
||||
.video_group_time{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.video_tag{
|
||||
margin: 0.5em 0.5em 0.5em 0;
|
||||
}
|
||||
.video_data{
|
||||
margin-bottom: 1em;
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
.video_info {
|
||||
margin: 1em 0;
|
||||
}
|
||||
.video_data_wrap{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.video_filter_area {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#filter_category_box {
|
||||
width: 100%;
|
||||
line-height: 50px;
|
||||
height: 50px;
|
||||
max-width: none;
|
||||
border: none;
|
||||
padding: 0 1em;
|
||||
}
|
||||
.category_box {
|
||||
padding: 0;
|
||||
}
|
||||
.search_box {
|
||||
padding-right: 0;
|
||||
}
|
||||
@media (max-width: 767px){
|
||||
.search_box {
|
||||
padding: 0;
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
}
|
||||
.search_keyword {
|
||||
margin-right: 50px;
|
||||
}
|
||||
.search_input input[type=text] {
|
||||
padding: 0 1em;
|
||||
line-height: 50px;
|
||||
}
|
||||
.search_input input {
|
||||
max-width: none;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
border: none;
|
||||
}
|
||||
.search_submit {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 50px;
|
||||
height: 100%;
|
||||
}
|
||||
.search_input input[type=submit] {
|
||||
background: url(/assets/video_pro/search_btn.png) center center no-repeat #c9c9c9;
|
||||
font-size: 0;
|
||||
}
|
||||
.video_tablist {
|
||||
overflow: hidden;
|
||||
letter-spacing: 0.1em;
|
||||
margin-bottom: 15px;
|
||||
padding: 0;
|
||||
}
|
||||
.video_tablist>li, .album_tablist>li {
|
||||
width: 50%;
|
||||
float: left;
|
||||
}
|
||||
.video_tablist li.now_view a {
|
||||
background-color: #c47f27;
|
||||
}
|
||||
.video_tablist a {
|
||||
display: block;
|
||||
padding: 10px 0;
|
||||
text-align: center;
|
||||
background-color: #8d681e;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font-size: 120%;
|
||||
}
|
||||
.video_title h5 {
|
||||
@extend .i-title;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.view_info {
|
||||
float: right;
|
||||
}
|
||||
.view_info img {
|
||||
margin-right: 5px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
|
||||
$(document).ready(function () {
|
||||
var $select = $("#filter_category_box"); // 取得 select
|
||||
var $categoryBox = $(".category_box"); // 取得分類框
|
||||
|
||||
// 創建按鈕並插入
|
||||
$select.find("option").each(function () {
|
||||
var value = $(this).val();
|
||||
var text = $(this).text();
|
||||
|
||||
// 只處理有值的選項
|
||||
if (value) {
|
||||
var $btn = $('<button class="category-btn" data-value="' + value + '">' + text + '</button>');
|
||||
$categoryBox.append($btn);
|
||||
}
|
||||
});
|
||||
|
||||
// 點擊按鈕時，更新 select 並觸發變更事件
|
||||
$(".category-btn").on("click", function () {
|
||||
var selectedValue = $(this).data("value");
|
||||
$select.val(selectedValue).trigger("change"); // 設定 select 值並觸發變更事件
|
||||
});
|
||||
|
||||
// 隱藏原本的 select
|
||||
$select.hide();
|
||||
$('#filter_category_box').on('change', function(){
|
||||
$(this).prop('form').submit();
|
||||
})
|
||||
});
|
||||
|
||||
</script>
|
||||
</div>
|
||||
{{pagination_goes_here}}
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
<div class="video_desc">{{video_desc}}</div>
|
||||
<div class="view_info">
|
||||
<span><img src="{{hd_icon_url}}" alt="HD"></span>
|
||||
<span><img src="{{view_icon_url}}" alt="{{view_count_trans}}>">x {{view_count}}</span>
|
||||
<span>x {{view_count}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
|
@ -32,12 +32,6 @@
|
|||
<style>
|
||||
.video_data{
|
||||
margin-bottom: 1em;
|
||||
.video_link{
|
||||
background: #f3f3f3;
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 1em;
|
||||
}
|
||||
}
|
||||
.video_info {
|
||||
margin: 1em 0;
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@
|
|||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="morebken">more<i class="fa-solid fa-chevron-down"></i></div>
|
||||
</div>
|
||||
<style type="text/css">
|
||||
.widget-content-horizontal{
|
||||
|
|
|
|||
|
|
@ -13,10 +13,6 @@
|
|||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div style="position: absolute;top: 55%;bottom: 50%;width:100%;">
|
||||
<button class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;background: url(/assets/link-left.png) no-repeat;border: 0;background-size: contain;position: absolute;transition:.3s; left: -1%;"></button>
|
||||
<button class="btn-right" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>" style="float: right;;height: 2.5em; width: 2.5em;background: url(/assets/link-right.png) no-repeat;background-size: contain;border: 0;position: absolute;transition:.3s;right: -2%;"></button>
|
||||
</div>
|
||||
<a class="btn-primary widget-link__more btn" href="{{more_url}}"><%= t("web_link.more") %></a>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<div class="sitemenu-wrap sitemenu-horizontal no-print">
|
||||
{{expand-script}}
|
||||
<a id="accesskey_sitemenu" accesskey="S" href="/<%= "#{locale.to_s}" %>/accesskey" title="Sitemenu">:::</a>
|
||||
<h3 class="sitemenu-title">{{widget_title}}</h3>
|
||||
<h3 class="sitemenu-title" aria-label="次選單標題">{{widget_title}}</h3>
|
||||
<ul data-list="pages" class="sitemenu-list level-1 list-unstyled" data-level="0">
|
||||
<li class="sitemenu-item level-1 {{active_class}}">
|
||||
<a class="sitemenu-link level-1" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<div class="sitemenu-wrap sitemenu-vertical no-print">
|
||||
{{expand-script}}
|
||||
<a id="accesskey_sitemenu" accesskey="S" href="/<%= "#{locale.to_s}" %>/accesskey" title="Sitemenu">:::</a>
|
||||
<h3 class="sitemenu-title">{{widget_title}}</h3>
|
||||
<h3 class="sitemenu-title" aria-label="次選單標題">{{widget_title}}</h3>
|
||||
<ul data-list="pages" class="sitemenu-list level-1 list-unstyled" data-level="0">
|
||||
<li class="sitemenu-item level-1 {{active_class}}">
|
||||
<a class="sitemenu-link level-1" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<div class="sitemenu-wrap sitemenu-vertical2 no-print">
|
||||
{{expand-script}}
|
||||
<a id="accesskey_sitemenu" accesskey="S" href="/<%= "#{locale.to_s}" %>/accesskey" title="Sitemenu">:::</a>
|
||||
<h3 class="sitemenu-title">{{widget_title}}</h3>
|
||||
<h3 class="sitemenu-title" aria-label="次選單標題">{{widget_title}}</h3>
|
||||
<ul data-list="pages" class="sitemenu-list level-1 list-unstyled" data-level="0">
|
||||
<li class="sitemenu-item level-1 {{active_class}}">
|
||||
<a class="sitemenu-link level-1" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<div class="sitemenu-wrap sitemenu4 no-print">
|
||||
{{expand-script}}
|
||||
<a id="accesskey_sitemenu" accesskey="S" href="/<%= "#{locale.to_s}" %>/accesskey" title="Sitemenu">:::</a>
|
||||
<h3 class="sitemenu-title">{{widget_title}}</h3>
|
||||
<h3 class="sitemenu-title" aria-label="次選單標題">{{widget_title}}</h3>
|
||||
<ul data-list="pages" class="sitemenu-list level-1 list-unstyled" data-level="0">
|
||||
<li class="sitemenu-item level-1 {{active_class}}">
|
||||
<a class="sitemenu-link level-1" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<div class="marquee-1" module="text_marquee" data-ps="">
|
||||
<ul class="marquee" data-level="0" data-list="texts">
|
||||
<li><a href="{{url}}" target="_blank" speed='{{speed}}'>{{text}}</a></li>
|
||||
<li><a href="{{url}}" target="_blank" speed='{{speed}}'><i class="fa-solid fa-bullhorn"></i>{{text}}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue