First push.
This commit is contained in:
commit
721e1e1961
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 121 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 130 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 201 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 207 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 201 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 295 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 87 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 165 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 306 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 674 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.2 KiB |
|
|
@ -0,0 +1,566 @@
|
|||
;(function($, win, undefined) {
|
||||
// ECMAScript 5 嚴格模式
|
||||
'use strict';
|
||||
|
||||
// 初始函數: 把所有的程式碼都包在init裡面，方便在之後的jQuery ready 函數裡一次呼叫
|
||||
function init() {
|
||||
// 快取一些常用的變數
|
||||
var doc = document;
|
||||
var lang = doc.documentElement.lang;
|
||||
var pageModule = doc.body.getAttribute('data-module');
|
||||
var resizeTimer = -1;
|
||||
// 把所有的函數都包在orbit這個物件裡並按模組做簡單的分類
|
||||
var orbit = {
|
||||
|
||||
// 工具函數，裡面包含可以重覆使用的函數
|
||||
utils: {
|
||||
// 字數限制函數, 因為系統預設沒有，所以使用JS來做
|
||||
// els = 元素, maxLen = 限制長度
|
||||
truncateText: function(els, maxLen) {
|
||||
var els = doc.querySelectorAll(els);
|
||||
var newTitle = '';
|
||||
var i = -1;
|
||||
var elsLen = els.length;
|
||||
|
||||
for (i = 0; i < elsLen; i++) {
|
||||
if (els[i].firstChild !== null) {
|
||||
if (els[i].firstChild.length > maxLen) {
|
||||
newTitle = els[i].firstChild.textContent;
|
||||
els[i].textContent = newTitle.substring(0, maxLen) + '...';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 外掛，所有的外掛都可以放到這個物件裡
|
||||
plugins: {
|
||||
// 自適應圖片裁切，Ray的外掛
|
||||
bullEye: function() {
|
||||
$('.bullseye').bullseye({
|
||||
fadeEffect: false
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
nav: {
|
||||
// 自適應使用的下拉選單
|
||||
setDropdown: function() {
|
||||
var $caret1 = $('<i class="dropdown-toggle-icon level-1 fa fa-chevron-down"></i>');
|
||||
var $caret2 = $('<i class="dropdown-toggle-icon level-2 fa fa-chevron-down"></i>');
|
||||
var $li = null;
|
||||
var $this = null;
|
||||
var cls = 'active';
|
||||
var iconDown = 'fa-chevron-down';
|
||||
var iconUp = 'fa-chevron-up';
|
||||
|
||||
// 如果有第二層選單，新增對應的類別到parent元素上
|
||||
$('.nav-level-1')
|
||||
.parent('li')
|
||||
.addClass('has-dropdown level-1');
|
||||
|
||||
// 檢查是否已經有dropdown-toggle-icon這個元素，才不會在resize事件中重覆新增
|
||||
if ($('.has-dropdown.level-1 > .dropdown-toggle-icon').length < 1) {
|
||||
$caret1.appendTo('.has-dropdown.level-1');
|
||||
|
||||
// 如果有第三層選單，新增對應的類別到parent元素上
|
||||
$('.nav-level-2')
|
||||
.parent('li')
|
||||
.addClass('has-dropdown level-2');
|
||||
$caret2.appendTo('.has-dropdown.level-2');
|
||||
}
|
||||
|
||||
// 綁定事件到第二、三層下拉選單的按鈕上
|
||||
$('.dropdown-toggle-icon.level-1, .dropdown-toggle-icon.level-2').on('vclick', function(e) {
|
||||
e.preventDefault();
|
||||
$this = $(this);
|
||||
$li = $this.parent('li');
|
||||
|
||||
// 拿掉所有選項除了目前點選的選項的 active class 並把icon換成預設的
|
||||
$li
|
||||
.siblings('li')
|
||||
.removeClass(cls)
|
||||
.find('.' + iconUp)
|
||||
.removeClass(iconUp)
|
||||
.addClass(iconDown);
|
||||
|
||||
|
||||
// 換掉目前選項的icon
|
||||
$li
|
||||
.find('> i')
|
||||
.removeClass(iconDown)
|
||||
.addClass(iconUp);
|
||||
|
||||
// 折疊已打開的選項
|
||||
if ( $li.hasClass(cls) ){
|
||||
$li.removeClass(cls);
|
||||
$this.removeClass(iconUp).addClass(iconDown);
|
||||
}
|
||||
else{
|
||||
$li.addClass(cls)
|
||||
$this.removeClass(iconDown).addClass(iconUp);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 移除行動版下拉選單
|
||||
removeDropdown: function() {
|
||||
var $nav = $('#main-nav');
|
||||
|
||||
$nav
|
||||
.find('.dropdown-toggle-icon')
|
||||
.remove();
|
||||
$nav
|
||||
.find('.active')
|
||||
.removeClass('active');
|
||||
}
|
||||
},
|
||||
|
||||
member: {
|
||||
// 欄位相同高度，小心這個函數沒有計算到圖片高度，所以可能要搭配 jQuery load函數使用，或是之後使用更好的方式例如 CSS3 flexbox
|
||||
equalHeight: function(el) {
|
||||
var bigbrother = -1;
|
||||
var $el = $(el);
|
||||
$el.each(function(i) {
|
||||
bigbrother = bigbrother > $el.eq(i).height() ? bigbrother : $el.eq(i).height();
|
||||
});
|
||||
|
||||
$el.height(bigbrother);
|
||||
},
|
||||
|
||||
// 把沒有完成資料的表格列藏起來, 因為後台不管有沒有資料都會輸出項目，所以需要在前台藏起來…
|
||||
removeEmptyRow: function() {
|
||||
// index 頁面項目
|
||||
$('.i-member-profile-item .i-member-value').each(function() {
|
||||
if ($(this).text().trim() === '' || $(this).text().trim() === ':') {
|
||||
$(this).parent().addClass('hide');
|
||||
}
|
||||
});
|
||||
|
||||
// show 頁面項目
|
||||
$('.show-member .member-data th, .show-member .member-data td').each(function() {
|
||||
if ($(this).text().trim() === '') {
|
||||
$(this).parent('tr').addClass('hide');
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
archives: {
|
||||
// 把沒有文字內容的標題藏起來，因為就算是標題裡沒有文字系統仍然會輸出，這樣會造成一些多餘的CSS margins, paddings，或許之後也可以使用 CSS3 :empty selector 處理
|
||||
// el = 要移除的元素
|
||||
removeEmptyTitle: function(el) {
|
||||
var $el = $(el);
|
||||
var $els = $el.children();
|
||||
|
||||
$.each($els, function(i, val) {
|
||||
if ($els.eq(i).text().trim() === '') {
|
||||
$els.eq(i).addClass('hide');
|
||||
}
|
||||
});
|
||||
|
||||
$.each($el, function(i, val) {
|
||||
if ($el.eq(i).children('.hide').length >= 2) {
|
||||
$el.eq(i).addClass('hide');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// bootstarp panel 功能擴充，因為原本的功能不支援多個panel
|
||||
extendPanel: function() {
|
||||
var len = $('.i-archive .panel-title').length;
|
||||
var i = -1;
|
||||
if (len > 0) {
|
||||
// 新增數字到要對應的panel按鈕id及href上面
|
||||
for (i = 0; i < len; i++) {
|
||||
$('.panel-title:eq(' + i + ') .collapsed').attr('href', '#collapse' + i);
|
||||
$('.panel-collapse:eq(' + i + ')').attr('id', 'collapse' + i);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
adBanner: {
|
||||
// 讓AD banner 的圖片可以點選，因為系統預設輸出的圖片是沒有連結的
|
||||
// els = 要可以點選的元素(需要配合有data-link這個參數及data-targe才能使用)
|
||||
addLinkOnADBanner: function(els) {
|
||||
$.each(els, function() {
|
||||
if ($(this).data('link') !== '' && !$(this).hasClass('youtube')) {
|
||||
$(this).on('click', function() {
|
||||
var target = $(this).data('target');
|
||||
var link = $(this).data('link');
|
||||
|
||||
// 設定頁面打開的方式，記得要加上data-target在HTML裡面
|
||||
if (target === '_blank') {
|
||||
window.open(link, target);
|
||||
} else {
|
||||
window.location.href = link;
|
||||
}
|
||||
}).addClass('cursor'); // cursor類別樣式定義在CSS裡面
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
},
|
||||
|
||||
|
||||
// 網站次選單設定，如果次選單有第三層就新增下拉選單的圖示及加上bootstrap class
|
||||
// els = 選單元素
|
||||
sitemenuDropdown: function(els) {
|
||||
var els = doc.querySelectorAll('.sitemenu-list.level-2');
|
||||
var len = els.length;
|
||||
var i = -1;
|
||||
var caret = null;
|
||||
|
||||
for (i = 0; i < len; i++) {
|
||||
if (els[i].children.length) {
|
||||
caret = doc.createElement('span');
|
||||
caret.className = 'sitemenu-dropdown-toggle fa fa-caret-down';
|
||||
caret.setAttribute('data-toggle', 'dropdown');
|
||||
|
||||
els[i].parentNode.insertBefore(caret, els[i]);
|
||||
els[i].className += ' dropdown-menu';
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 回到頁面最頂端，動態產生DOM
|
||||
// txt = 按鈕的文字, speed = 捲動時的速度
|
||||
goBackTop: function(txt, speed) {
|
||||
var top = document.createElement('div');
|
||||
top.className = 'go-back-top no-print';
|
||||
top.textContent = txt || 'top';
|
||||
doc.body.appendChild(top);
|
||||
|
||||
// 判斷是否顯示按鈕
|
||||
$(window).scroll(function() {
|
||||
if ($(this).scrollTop() !== 0) {
|
||||
$('.go-back-top').fadeIn();
|
||||
} else {
|
||||
$('.go-back-top').fadeOut();
|
||||
}
|
||||
});
|
||||
|
||||
// 捲動效果
|
||||
$('.go-back-top').on('click', function() {
|
||||
$('body, html').animate({
|
||||
scrollTop: 0
|
||||
}, speed || 300);
|
||||
return false;
|
||||
});
|
||||
},
|
||||
|
||||
// Multi-column layout, passing ID or class string as parameters and a
|
||||
// Bootstrap col class for full width, eg: col-md-12
|
||||
setColumn: function(leftCol, rightCol, columnCls) {
|
||||
var $leftCol = $(leftCol);
|
||||
var $rightCol = $(rightCol);
|
||||
var columnCls = columnCls || 'col-sm-12';
|
||||
|
||||
if ($leftCol.length && $rightCol.length) {
|
||||
$.each([$leftCol, $rightCol], function() {
|
||||
if ($(this).is(':empty')) {
|
||||
$(this)
|
||||
.addClass('empty-column')
|
||||
.siblings()
|
||||
.removeClass(function(index, css) {
|
||||
return (css.match(/(^|\s)col-\S+/g) || []).join(' ');
|
||||
})
|
||||
.addClass(columnCls);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
anncSlider:function(){
|
||||
if(!document.querySelector('.pages img')){
|
||||
return;
|
||||
}
|
||||
var pages = document.querySelectorAll('.pages'),
|
||||
imgW = document.querySelector('.pages img').clientWidth,
|
||||
imgH = document.querySelector('.pages img').clientHeight,
|
||||
img = document.querySelectorAll('.pages img'),
|
||||
adb = document.querySelector('.annc-box'),
|
||||
width = window.innerWidth,
|
||||
timeout = adb.getAttribute('timeout'),
|
||||
speed = adb.getAttribute('speed') * 0.001,
|
||||
allHeight,
|
||||
minHeight,
|
||||
ads,
|
||||
index = 0,
|
||||
i,
|
||||
TT,
|
||||
max,
|
||||
totalh = [],
|
||||
style = document.createElement("style");
|
||||
if(!img){
|
||||
return;
|
||||
}
|
||||
style.appendChild(document.createTextNode(".ltr_in {left: 0;animation: left-in "+ speed +"s ;animation-fill-mode:forwards;}.ltr_out{animation: left-out "+ speed +"s;animation-fill-mode:forwards;}.rtl_in{left:0;animation: right-in "+ speed +"s;animation-fill-mode:forwards;}.rtl_out{animation: right-out "+ speed +"s;animation-fill-mode:forwards;}"));
|
||||
document.head.appendChild(style);
|
||||
setTimeout(function(){
|
||||
for(i=0,max=img.length;i<max;i++){
|
||||
allHeight = img[i].clientHeight;
|
||||
|
||||
totalh.push(allHeight);
|
||||
minHeight = Math.min.apply(null, totalh);
|
||||
|
||||
adb.style.height = minHeight + 'px';
|
||||
img[i].parentElement.style.height = minHeight + 'px';
|
||||
}
|
||||
},1000);
|
||||
|
||||
|
||||
if(!pages[0]){
|
||||
return;
|
||||
}
|
||||
pages[0].classList.add('active');
|
||||
function getChildren(n, skipMe1,skipMe2,hide){
|
||||
var r = [],i,max;
|
||||
if(typeof hide !=='function'){
|
||||
hide = false;
|
||||
}
|
||||
for (i =0,max=n.length; i<max; i++) {
|
||||
|
||||
if ( n[i].className.indexOf('pages') > -1 && n[i] != skipMe1 && n[i] != skipMe2)
|
||||
{
|
||||
|
||||
if(hide){
|
||||
hide(n[i]);
|
||||
}
|
||||
r.push( n[i] );
|
||||
}
|
||||
}
|
||||
return r;
|
||||
};
|
||||
|
||||
function getSiblings(n1,n2) {
|
||||
var hide = function(sib){
|
||||
sib.classList.remove('rtl_in');
|
||||
sib.classList.remove('rtl_out');
|
||||
sib.classList.remove('ltr_in');
|
||||
sib.classList.remove('ltr_out');
|
||||
}
|
||||
var sib = getChildren(n1.parentNode.children, n1,n2,hide);
|
||||
}
|
||||
|
||||
function adPrev(event){
|
||||
|
||||
pages[0].classList.remove('active');
|
||||
for(i=0,max=pages.length;i<max;i++){
|
||||
pages[i].classList.remove('rtl_in');
|
||||
pages[i].classList.remove('rtl_out');
|
||||
}
|
||||
if(index <= 0){
|
||||
index=pages.length-1;
|
||||
pages[pages.length-1].classList.add('ltr_in');
|
||||
pages[pages.length-1].classList.remove('ltr_out');
|
||||
pages[0].classList.add('ltr_out');
|
||||
pages[0].classList.remove('ltr_in');
|
||||
|
||||
ads = getSiblings(pages[0],pages[pages.length-1]);
|
||||
|
||||
}else{
|
||||
index--;
|
||||
pages[index].classList.add('ltr_in');
|
||||
pages[index].classList.remove('ltr_out');
|
||||
pages[index+1].classList.add('ltr_out');
|
||||
pages[index+1].classList.remove('ltr_in');
|
||||
|
||||
|
||||
ads = getSiblings(pages[index],pages[index+1]);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function adNext(event){
|
||||
|
||||
pages[0].classList.remove('active');
|
||||
for(i=0,max=pages.length;i<max;i++){
|
||||
pages[i].classList.remove('ltr_in');
|
||||
pages[i].classList.remove('ltr_out');
|
||||
}
|
||||
if(index >= (pages.length-1)){
|
||||
index=0;
|
||||
|
||||
pages[index].classList.add('rtl_in');
|
||||
pages[index].classList.remove('rtl_out');
|
||||
pages[pages.length-1].classList.add('rtl_out');
|
||||
pages[pages.length-1].classList.remove('rtl_in');
|
||||
|
||||
ads = getSiblings(pages[index],pages[pages.length-1]);
|
||||
|
||||
}else{
|
||||
index++;
|
||||
pages[index].classList.add('rtl_in');
|
||||
pages[index].classList.remove('rtl_out');
|
||||
pages[index-1].classList.add('rtl_out');
|
||||
pages[index-1].classList.remove('rtl_in');
|
||||
|
||||
ads = getSiblings(pages[index],pages[index-1]);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if(pages.length<=1){
|
||||
return;
|
||||
}
|
||||
else{
|
||||
|
||||
TT = setInterval(adNext,timeout);
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
// 把orbit物件加到window物件裡面並改名為ORBITFRONT來減少名稱衝突的機會
|
||||
win.ORBITFRONT = orbit;
|
||||
|
||||
// 在switch裡測試頁面模組後執行對應的函數
|
||||
switch (pageModule) {
|
||||
case 'home':
|
||||
break;
|
||||
case 'member':
|
||||
orbit.member.removeEmptyRow();
|
||||
break;
|
||||
case 'archive':
|
||||
orbit.archives.removeEmptyTitle('.i-archive__category-item');
|
||||
orbit.archives.extendPanel();
|
||||
break;
|
||||
case 'gallery':
|
||||
orbit.utils.truncateText('.show-description', 15);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
// 在所有的頁面(包含首頁)執行下面這幾個函數
|
||||
orbit.sitemenuDropdown();
|
||||
orbit.goBackTop('top', 800);
|
||||
orbit.plugins.bullEye();
|
||||
orbit.setColumn('.left-column', '.right-column');
|
||||
orbit.anncSlider();
|
||||
// orbit.MobileMenu();
|
||||
// testing
|
||||
// 自適應網頁使用，當網頁載入時，如果視窗寬度小於768，就執行orbit.nav.setDropdown函數
|
||||
if ($(window).width() < 768) {
|
||||
orbit.nav.setDropdown();
|
||||
}
|
||||
|
||||
// 自適應網頁使用，當使用者改變瀏覽器寬度時呼叫orbit.nav.setDropdown函數
|
||||
$(window).resize(function() {
|
||||
if ($(window).width() < 768) {
|
||||
clearTimeout(resizeTimer);
|
||||
resizeTimer = setTimeout(orbit.nav.setDropdown, 500);
|
||||
} else {
|
||||
resizeTimer = setTimeout(orbit.nav.removeDropdown, 500);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
// 當文件物件模型(DOM)載入後，執行init函數
|
||||
$(document).ready(function() {
|
||||
$(".page-home .content-boxL2 img[src='/assets/announcement-default.jpg']").attr("src","/assets/announcement-default2.jpg");
|
||||
$(".page-home .content-boxL3 img[src='/assets/announcement-default.jpg']").attr("src","/assets/announcement-default3.jpg");
|
||||
|
||||
$(".page-home .content-boxL1 .L11 img[src='/assets/announcement-default.jpg']").attr("src","/assets/announcement-default4.jpg");
|
||||
$(".page-home .content-boxL2 .L22 img[src='/assets/announcement-default2.jpg']").attr("src","/assets/announcement-default5.jpg");
|
||||
$(".page-home .content-boxL3 .L33 img[src='/assets/announcement-default3.jpg']").attr("src","/assets/announcement-default6.jpg");
|
||||
init();
|
||||
|
||||
});
|
||||
window.onload = function(){
|
||||
var mask = document.querySelector('.mask'),
|
||||
menuLi = document.querySelectorAll('#main-nav > li > ul'),i,max;
|
||||
mask.classList.add('active');
|
||||
setTimeout(function(){
|
||||
var borderWidth = document.querySelector('.layout-content').clientWidth,
|
||||
borderHeight = document.querySelector('.layout-content').clientHeight;
|
||||
mask.style.cssText = 'border-left:'+ borderWidth/2 +'px solid rgba(0,0,0,.5);border-right:'+ borderWidth/2 +'px solid rgba(0,0,0,.5);border-top:'+ borderHeight/2 +'px solid rgba(0,0,0,.5);border-bottom:'+ borderHeight/2 +'px solid rgba(0,0,0,.5);';
|
||||
},1000);
|
||||
|
||||
for(i=0,max=menuLi.length;i<max;i++){
|
||||
menuLi[i].parentElement.onmouseover = function(){
|
||||
mask.classList.remove('active');
|
||||
}
|
||||
menuLi[i].parentElement.onmouseout = function(){
|
||||
mask.classList.add('active');
|
||||
}
|
||||
}
|
||||
}
|
||||
$(document).ready(function() {
|
||||
var url = window.location.search;
|
||||
if (url == "?editmode=on") {
|
||||
$(".boxB-info1 .boxB-info2 .boxB-info3 .boxB-info4").show();
|
||||
return false;
|
||||
}
|
||||
|
||||
//$(".B_news").hide();
|
||||
$(".boxB-info1").fadeIn().show();
|
||||
$(".h2-title1").addClass("focusClass");
|
||||
|
||||
$(".h2-title1").click(function() {
|
||||
$(".h2-title1").addClass("focusClass");
|
||||
$(".boxB-info1").fadeIn().show();
|
||||
$(".boxB-info2").fadeOut().hide();
|
||||
$(".boxB-info3").fadeOut().hide();
|
||||
$(".h2-title2").removeClass("focusClass");
|
||||
$(".h2-title3").removeClass("focusClass");
|
||||
});
|
||||
|
||||
$(".h2-title2").click(function() {
|
||||
$(".h2-title2").addClass("focusClass");
|
||||
$(".boxB-info2").fadeIn().show();
|
||||
$(".boxB-info1").fadeOut().hide();
|
||||
$(".boxB-info3").fadeOut().hide();
|
||||
$(".h2-title1").removeClass("focusClass");
|
||||
$(".h2-title3").removeClass("focusClass");
|
||||
});
|
||||
|
||||
$(".h2-title3").click(function() {
|
||||
$(".h2-title3").addClass("focusClass");
|
||||
$(".boxB-info3").fadeIn().show();
|
||||
$(".boxB-info2").fadeOut().hide();
|
||||
$(".boxB-info1").fadeOut().hide();
|
||||
$(".h2-title2").removeClass("focusClass");
|
||||
$(".h2-title1").removeClass("focusClass");
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
// 執行 member等高計算，目前改用flexbox故mark掉 by ika 20160105
|
||||
// $(window).load(function() {
|
||||
// if ($('.index-member-3').length && $(window).width() > 992) {
|
||||
// ORBITFRONT.member.equalHeight('.i-member-item-inner');
|
||||
// }
|
||||
// });
|
||||
|
||||
}(jQuery, window));
|
||||
$(document).ready(function(){
|
||||
if(window.location.search.indexOf('editmode=on') == -1){
|
||||
$(".nav-tabs").each(function(i,v){
|
||||
$(v).nextAll("*").not("script").addClass("tab-pane fade");
|
||||
$(v).nextAll("*").not("script").eq(0).addClass("active in");
|
||||
var tab_content = $("<div class=\"tab-content\"></div>")
|
||||
$(v).nextAll("*").not("script").appendTo(tab_content);
|
||||
$(v).after(tab_content);
|
||||
$(v).find("li").off('click').click(function(){
|
||||
$(this).parent().nextAll(".tab-content").eq(0).find(".tab-pane").removeClass("active in");
|
||||
$(this).parent().nextAll(".tab-content").eq(0).find(".tab-pane").eq($(this).index()).addClass("active in");
|
||||
$(this).addClass('active');
|
||||
$(this).siblings('li').removeClass('active');
|
||||
})
|
||||
})
|
||||
}
|
||||
$("[data-subpart-id]").each(function(i,el){
|
||||
var h3 = $(el).find("h3");
|
||||
if(h3.length != 0 && h3.text().trim() == "")
|
||||
h3.css("display","none");
|
||||
})
|
||||
})
|
||||
|
|
@ -0,0 +1 @@
|
|||
!function($){"use strict";var t={fadeEffect:!0,effectTime:.5},i=$(window),e=function(t,i){var e=document.createElement("img"),s;t.data("bullseyeImage")?(t.html('<img src="'+t.data("bullseyeImage")+'">'),s=t.data("bullseyeImage")):(s=t.find("img").first().attr("src"),t.data("bullseyeImage",s)),i.fadeEffect&&t.find("img").first().css({opacity:0}),e.src=s,e.onload=function(){n(t,i)}},n=function(t,i){var e=t.find("img").first(),n={position:"relative",overflow:"hidden"},o={position:"absolute",top:0,right:0,bottom:0,left:0,margin:"auto",width:"100%",height:"auto"},a={start:{opacity:1,"-webkit-transition":"opacity "+i.effectTime+"s ease-in-out","-moz-transition":"opacity "+i.effectTime+"s ease-in-out","-o-transition":"opacity "+i.effectTime+"s ease-in-out",transition:"opacity "+i.effectTime+"s ease-in-out"},end:{opacity:"","-webkit-transition":"","-moz-transition":"","-o-transition":"",transition:""}};t.css(n),e.css(o),s(t),i.fadeEffect&&e.css(a.start).on("transitionend",function(){$(this).css(a.end)})},s=function(t){var i=t.find("img").first(),e=t.innerHeight(),n,s;n=i.height(),e>n?(s=e/n,i.css({"-webkit-transform":"scale("+s+")","-moz-transform":"scale("+s+")","-o-transform":"scale("+s+")",transform:"scale("+s+")"})):i.css({"-webkit-transform":"","-moz-transform":"","-o-transform":"",transform:""})},o=function(t,n){e(t,n),i.on("resize",function(){s(t)})};$.fn.bullseye=function(i){var e=$.extend({},t,i);return this.each(function(){var t=$(this);o(t,e)})}}(window.jQuery);
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,947 @@
|
|||
//
|
||||
// Mixins
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Utilities
|
||||
// -------------------------
|
||||
|
||||
// Clearfix
|
||||
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
|
||||
//
|
||||
// For modern browsers
|
||||
// 1. The space content is one way to avoid an Opera bug when the
|
||||
// contenteditable attribute is included anywhere else in the document.
|
||||
// Otherwise it causes space to appear at the top and bottom of elements
|
||||
// that are clearfixed.
|
||||
// 2. The use of `table` rather than `block` is only necessary if using
|
||||
// `:before` to contain the top-margins of child elements.
|
||||
@mixin clearfix() {
|
||||
&:before,
|
||||
&:after {
|
||||
content: " "; // 1
|
||||
display: table; // 2
|
||||
}
|
||||
&:after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
// WebKit-style focus
|
||||
@mixin tab-focus() {
|
||||
// Default
|
||||
outline: thin dotted;
|
||||
// WebKit
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
// Center-align a block level element
|
||||
@mixin center-block() {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
// Sizing shortcuts
|
||||
@mixin size($width, $height) {
|
||||
width: $width;
|
||||
height: $height;
|
||||
}
|
||||
@mixin square($size) {
|
||||
@include size($size, $size);
|
||||
}
|
||||
|
||||
// Placeholder text
|
||||
@mixin placeholder($color: $input-color-placeholder) {
|
||||
&::-moz-placeholder { color: $color; // Firefox
|
||||
opacity: 1; } // See https://github.com/twbs/bootstrap/pull/11526
|
||||
&:-ms-input-placeholder { color: $color; } // Internet Explorer 10+
|
||||
&::-webkit-input-placeholder { color: $color; } // Safari and Chrome
|
||||
}
|
||||
|
||||
// Text overflow
|
||||
// Requires inline-block or block for proper styling
|
||||
@mixin text-overflow() {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// CSS image replacement
|
||||
//
|
||||
// Heads up! v3 launched with with only `.hide-text()`, but per our pattern for
|
||||
// mixins being reused as classes with the same name, this doesn't hold up. As
|
||||
// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`. Note
|
||||
// that we cannot chain the mixins together in Less, so they are repeated.
|
||||
//
|
||||
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
|
||||
|
||||
// Deprecated as of v3.0.1 (will be removed in v4)
|
||||
@mixin hide-text() {
|
||||
font: #{0/0} a;
|
||||
color: transparent;
|
||||
text-shadow: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
// New mixin to use as of v3.0.1
|
||||
@mixin text-hide() {
|
||||
@include hide-text();
|
||||
}
|
||||
|
||||
|
||||
|
||||
// CSS3 PROPERTIES
|
||||
// --------------------------------------------------
|
||||
|
||||
// Single side border-radius
|
||||
@mixin border-top-radius($radius) {
|
||||
border-top-right-radius: $radius;
|
||||
border-top-left-radius: $radius;
|
||||
}
|
||||
@mixin border-right-radius($radius) {
|
||||
border-bottom-right-radius: $radius;
|
||||
border-top-right-radius: $radius;
|
||||
}
|
||||
@mixin border-bottom-radius($radius) {
|
||||
border-bottom-right-radius: $radius;
|
||||
border-bottom-left-radius: $radius;
|
||||
}
|
||||
@mixin border-left-radius($radius) {
|
||||
border-bottom-left-radius: $radius;
|
||||
border-top-left-radius: $radius;
|
||||
}
|
||||
|
||||
// Drop shadows
|
||||
//
|
||||
// Note: Deprecated `.box-shadow()` as of v3.1.0 since all of Bootstrap's
|
||||
// supported browsers that have box shadow capabilities now support the
|
||||
// standard `box-shadow` property.
|
||||
@mixin box-shadow($shadow...) {
|
||||
-webkit-box-shadow: $shadow; // iOS <4.3 & Android <4.1
|
||||
box-shadow: $shadow;
|
||||
}
|
||||
|
||||
// Transitions
|
||||
@mixin transition($transition...) {
|
||||
-webkit-transition: $transition;
|
||||
transition: $transition;
|
||||
}
|
||||
@mixin transition-property($transition-property...) {
|
||||
-webkit-transition-property: $transition-property;
|
||||
transition-property: $transition-property;
|
||||
}
|
||||
@mixin transition-delay($transition-delay) {
|
||||
-webkit-transition-delay: $transition-delay;
|
||||
transition-delay: $transition-delay;
|
||||
}
|
||||
@mixin transition-duration($transition-duration...) {
|
||||
-webkit-transition-duration: $transition-duration;
|
||||
transition-duration: $transition-duration;
|
||||
}
|
||||
@mixin transition-transform($transition...) {
|
||||
-webkit-transition: -webkit-transform $transition;
|
||||
-moz-transition: -moz-transform $transition;
|
||||
-o-transition: -o-transform $transition;
|
||||
transition: transform $transition;
|
||||
}
|
||||
|
||||
// Transformations
|
||||
@mixin rotate($degrees) {
|
||||
-webkit-transform: rotate($degrees);
|
||||
-ms-transform: rotate($degrees); // IE9 only
|
||||
transform: rotate($degrees);
|
||||
}
|
||||
@mixin scale($scale-args...) {
|
||||
-webkit-transform: scale($scale-args);
|
||||
-ms-transform: scale($scale-args); // IE9 only
|
||||
transform: scale($scale-args);
|
||||
}
|
||||
@mixin translate($x, $y) {
|
||||
-webkit-transform: translate($x, $y);
|
||||
-ms-transform: translate($x, $y); // IE9 only
|
||||
transform: translate($x, $y);
|
||||
}
|
||||
@mixin skew($x, $y) {
|
||||
-webkit-transform: skew($x, $y);
|
||||
-ms-transform: skewX($x) skewY($y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
|
||||
transform: skew($x, $y);
|
||||
}
|
||||
@mixin translate3d($x, $y, $z) {
|
||||
-webkit-transform: translate3d($x, $y, $z);
|
||||
transform: translate3d($x, $y, $z);
|
||||
}
|
||||
|
||||
@mixin rotateX($degrees) {
|
||||
-webkit-transform: rotateX($degrees);
|
||||
-ms-transform: rotateX($degrees); // IE9 only
|
||||
transform: rotateX($degrees);
|
||||
}
|
||||
@mixin rotateY($degrees) {
|
||||
-webkit-transform: rotateY($degrees);
|
||||
-ms-transform: rotateY($degrees); // IE9 only
|
||||
transform: rotateY($degrees);
|
||||
}
|
||||
@mixin perspective($perspective) {
|
||||
-webkit-perspective: $perspective;
|
||||
-moz-perspective: $perspective;
|
||||
perspective: $perspective;
|
||||
}
|
||||
@mixin perspective-origin($perspective) {
|
||||
-webkit-perspective-origin: $perspective;
|
||||
-moz-perspective-origin: $perspective;
|
||||
perspective-origin: $perspective;
|
||||
}
|
||||
@mixin transform-origin($origin) {
|
||||
-webkit-transform-origin: $origin;
|
||||
-moz-transform-origin: $origin;
|
||||
-ms-transform-origin: $origin; // IE9 only
|
||||
transform-origin: $origin;
|
||||
}
|
||||
|
||||
// Animations
|
||||
@mixin animation($animation) {
|
||||
-webkit-animation: $animation;
|
||||
animation: $animation;
|
||||
}
|
||||
@mixin animation-name($name) {
|
||||
-webkit-animation-name: $name;
|
||||
animation-name: $name;
|
||||
}
|
||||
@mixin animation-duration($duration) {
|
||||
-webkit-animation-duration: $duration;
|
||||
animation-duration: $duration;
|
||||
}
|
||||
@mixin animation-timing-function($timing-function) {
|
||||
-webkit-animation-timing-function: $timing-function;
|
||||
animation-timing-function: $timing-function;
|
||||
}
|
||||
@mixin animation-delay($delay) {
|
||||
-webkit-animation-delay: $delay;
|
||||
animation-delay: $delay;
|
||||
}
|
||||
@mixin animation-iteration-count($iteration-count) {
|
||||
-webkit-animation-iteration-count: $iteration-count;
|
||||
animation-iteration-count: $iteration-count;
|
||||
}
|
||||
@mixin animation-direction($direction) {
|
||||
-webkit-animation-direction: $direction;
|
||||
animation-direction: $direction;
|
||||
}
|
||||
|
||||
// Backface visibility
|
||||
// Prevent browsers from flickering when using CSS 3D transforms.
|
||||
// Default value is `visible`, but can be changed to `hidden`
|
||||
@mixin backface-visibility($visibility){
|
||||
-webkit-backface-visibility: $visibility;
|
||||
-moz-backface-visibility: $visibility;
|
||||
backface-visibility: $visibility;
|
||||
}
|
||||
|
||||
// Box sizing
|
||||
@mixin box-sizing($boxmodel) {
|
||||
-webkit-box-sizing: $boxmodel;
|
||||
-moz-box-sizing: $boxmodel;
|
||||
box-sizing: $boxmodel;
|
||||
}
|
||||
|
||||
// User select
|
||||
// For selecting text on the page
|
||||
@mixin user-select($select) {
|
||||
-webkit-user-select: $select;
|
||||
-moz-user-select: $select;
|
||||
-ms-user-select: $select; // IE10+
|
||||
user-select: $select;
|
||||
}
|
||||
|
||||
// Resize anything
|
||||
@mixin resizable($direction) {
|
||||
resize: $direction; // Options: horizontal, vertical, both
|
||||
overflow: auto; // Safari fix
|
||||
}
|
||||
|
||||
// CSS3 Content Columns
|
||||
@mixin content-columns($column-count, $column-gap: $grid-gutter-width) {
|
||||
-webkit-column-count: $column-count;
|
||||
-moz-column-count: $column-count;
|
||||
column-count: $column-count;
|
||||
-webkit-column-gap: $column-gap;
|
||||
-moz-column-gap: $column-gap;
|
||||
column-gap: $column-gap;
|
||||
}
|
||||
|
||||
// Optional hyphenation
|
||||
@mixin hyphens($mode: auto) {
|
||||
word-wrap: break-word;
|
||||
-webkit-hyphens: $mode;
|
||||
-moz-hyphens: $mode;
|
||||
-ms-hyphens: $mode; // IE10+
|
||||
-o-hyphens: $mode;
|
||||
hyphens: $mode;
|
||||
}
|
||||
|
||||
// Opacity
|
||||
@mixin opacity($opacity) {
|
||||
opacity: $opacity;
|
||||
// IE8 filter
|
||||
$opacity-ie: ($opacity * 100);
|
||||
filter: #{alpha(opacity=$opacity-ie)};
|
||||
}
|
||||
|
||||
|
||||
|
||||
// GRADIENTS
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Horizontal gradient, from left to right
|
||||
//
|
||||
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
||||
// Color stops are not available in IE9 and below.
|
||||
@mixin gradient-horizontal($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
|
||||
background-image: -webkit-linear-gradient(left, color-stop($start-color $start-percent), color-stop($end-color $end-percent)); // Safari 5.1-6, Chrome 10+
|
||||
background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 and down
|
||||
}
|
||||
|
||||
// Vertical gradient, from top to bottom
|
||||
//
|
||||
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
||||
// Color stops are not available in IE9 and below.
|
||||
@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
|
||||
background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+
|
||||
background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down
|
||||
}
|
||||
|
||||
@mixin gradient-directional($start-color: #555, $end-color: #333, $deg: 45deg) {
|
||||
background-repeat: repeat-x;
|
||||
background-image: -webkit-linear-gradient($deg, $start-color, $end-color); // Safari 5.1-6, Chrome 10+
|
||||
background-image: linear-gradient($deg, $start-color, $end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
||||
}
|
||||
@mixin gradient-horizontal-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
|
||||
background-image: -webkit-linear-gradient(left, $start-color, $mid-color $color-stop, $end-color);
|
||||
background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
|
||||
background-repeat: no-repeat;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 and down, gets no color-stop at all for proper fallback
|
||||
}
|
||||
@mixin gradient-vertical-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
|
||||
background-image: -webkit-linear-gradient($start-color, $mid-color $color-stop, $end-color);
|
||||
background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
|
||||
background-repeat: no-repeat;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down, gets no color-stop at all for proper fallback
|
||||
}
|
||||
@mixin gradient-radial($inner-color: #555, $outer-color: #333) {
|
||||
background-image: -webkit-radial-gradient(circle, $inner-color, $outer-color);
|
||||
background-image: radial-gradient(circle, $inner-color, $outer-color);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
@mixin gradient-striped($color: rgba(255,255,255,.15), $angle: 45deg) {
|
||||
background-image: -webkit-linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
|
||||
background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
|
||||
}
|
||||
|
||||
// Reset filters for IE
|
||||
//
|
||||
// When you need to remove a gradient background, do not forget to use this to reset
|
||||
// the IE filter for IE9 and below.
|
||||
@mixin reset-filter() {
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Retina images
|
||||
//
|
||||
// Short retina mixin for setting background-image and -size
|
||||
|
||||
@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
|
||||
background-image: url(if($bootstrap-sass-asset-helper, twbs-image-path("#{$file-1x}"), "#{$file-1x}"));
|
||||
|
||||
@media
|
||||
only screen and (-webkit-min-device-pixel-ratio: 2),
|
||||
only screen and ( min--moz-device-pixel-ratio: 2),
|
||||
only screen and ( -o-min-device-pixel-ratio: 2/1),
|
||||
only screen and ( min-device-pixel-ratio: 2),
|
||||
only screen and ( min-resolution: 192dpi),
|
||||
only screen and ( min-resolution: 2dppx) {
|
||||
background-image: url(if($bootstrap-sass-asset-helper, twbs-image-path("#{$file-2x}"), "#{$file-2x}"));
|
||||
background-size: $width-1x $height-1x;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Responsive image
|
||||
//
|
||||
// Keep images from scaling beyond the width of their parents.
|
||||
|
||||
@mixin img-responsive($display: block) {
|
||||
display: $display;
|
||||
max-width: 100%; // Part 1: Set a maximum relative to the parent
|
||||
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
|
||||
}
|
||||
|
||||
|
||||
// COMPONENT MIXINS
|
||||
// --------------------------------------------------
|
||||
|
||||
// Horizontal dividers
|
||||
// -------------------------
|
||||
// Dividers (basically an hr) within dropdowns and nav lists
|
||||
@mixin nav-divider($color: #e5e5e5) {
|
||||
height: 1px;
|
||||
margin: (($line-height-computed / 2) - 1) 0;
|
||||
overflow: hidden;
|
||||
background-color: $color;
|
||||
}
|
||||
|
||||
// Panels
|
||||
// -------------------------
|
||||
@mixin panel-variant($border, $heading-text-color, $heading-bg-color, $heading-border) {
|
||||
border-color: $border;
|
||||
|
||||
& > .panel-heading {
|
||||
color: $heading-text-color;
|
||||
background-color: $heading-bg-color;
|
||||
border-color: $heading-border;
|
||||
|
||||
+ .panel-collapse .panel-body {
|
||||
border-top-color: $border;
|
||||
}
|
||||
}
|
||||
& > .panel-footer {
|
||||
+ .panel-collapse .panel-body {
|
||||
border-bottom-color: $border;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Alerts
|
||||
// -------------------------
|
||||
@mixin alert-variant($background, $border, $text-color) {
|
||||
background-color: $background;
|
||||
border-color: $border;
|
||||
color: $text-color;
|
||||
|
||||
hr {
|
||||
border-top-color: darken($border, 5%);
|
||||
}
|
||||
.alert-link {
|
||||
color: darken($text-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
// Tables
|
||||
// -------------------------
|
||||
@mixin table-row-variant($state, $background) {
|
||||
// Exact selectors below required to override `.table-striped` and prevent
|
||||
// inheritance to nested tables.
|
||||
.table > thead > tr,
|
||||
.table > tbody > tr,
|
||||
.table > tfoot > tr {
|
||||
> td.#{$state},
|
||||
> th.#{$state},
|
||||
&.#{$state} > td,
|
||||
&.#{$state} > th {
|
||||
background-color: $background;
|
||||
}
|
||||
}
|
||||
|
||||
// Hover states for `.table-hover`
|
||||
// Note: this is not available for cells or rows within `thead` or `tfoot`.
|
||||
.table-hover > tbody > tr {
|
||||
> td.#{$state}:hover,
|
||||
> th.#{$state}:hover,
|
||||
&.#{$state}:hover > td,
|
||||
&.#{$state}:hover > th {
|
||||
background-color: darken($background, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// List Groups
|
||||
// -------------------------
|
||||
@mixin list-group-item-variant($state, $background, $color) {
|
||||
.list-group-item-#{$state} {
|
||||
color: $color;
|
||||
background-color: $background;
|
||||
|
||||
// [converter] extracted a& to a.list-group-item-#{$state}
|
||||
}
|
||||
|
||||
a.list-group-item-#{$state} {
|
||||
color: $color;
|
||||
|
||||
.list-group-item-heading { color: inherit; }
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $color;
|
||||
background-color: darken($background, 5%);
|
||||
}
|
||||
&.active,
|
||||
&.active:hover,
|
||||
&.active:focus {
|
||||
color: #fff;
|
||||
background-color: $color;
|
||||
border-color: $color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Button variants
|
||||
// -------------------------
|
||||
// Easily pump out default styles, as well as :hover, :focus, :active,
|
||||
// and disabled options for all buttons
|
||||
@mixin button-variant($color, $background, $border) {
|
||||
color: $color;
|
||||
background-color: $background;
|
||||
border-color: $border;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
color: $color;
|
||||
background-color: darken($background, 8%);
|
||||
border-color: darken($border, 12%);
|
||||
}
|
||||
.open & { &.dropdown-toggle {
|
||||
color: $color;
|
||||
background-color: darken($background, 8%);
|
||||
border-color: darken($border, 12%);
|
||||
} }
|
||||
&:active,
|
||||
&.active {
|
||||
background-image: none;
|
||||
}
|
||||
.open & { &.dropdown-toggle {
|
||||
background-image: none;
|
||||
} }
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
background-color: $background;
|
||||
border-color: $border;
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
color: $background;
|
||||
background-color: $color;
|
||||
}
|
||||
}
|
||||
|
||||
// Button sizes
|
||||
// -------------------------
|
||||
@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
|
||||
padding: $padding-vertical $padding-horizontal;
|
||||
font-size: $font-size;
|
||||
line-height: $line-height;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
// Pagination
|
||||
// -------------------------
|
||||
@mixin pagination-size($padding-vertical, $padding-horizontal, $font-size, $border-radius) {
|
||||
> li {
|
||||
> a,
|
||||
> span {
|
||||
padding: $padding-vertical $padding-horizontal;
|
||||
font-size: $font-size;
|
||||
}
|
||||
&:first-child {
|
||||
> a,
|
||||
> span {
|
||||
@include border-left-radius($border-radius);
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
> a,
|
||||
> span {
|
||||
@include border-right-radius($border-radius);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Labels
|
||||
// -------------------------
|
||||
@mixin label-variant($color) {
|
||||
background-color: $color;
|
||||
&[href] {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: darken($color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Contextual backgrounds
|
||||
// -------------------------
|
||||
// [converter] $parent hack
|
||||
@mixin bg-variant($parent, $color) {
|
||||
#{$parent} {
|
||||
background-color: $color;
|
||||
}
|
||||
a#{$parent}:hover {
|
||||
background-color: darken($color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
// Typography
|
||||
// -------------------------
|
||||
// [converter] $parent hack
|
||||
@mixin text-emphasis-variant($parent, $color) {
|
||||
#{$parent} {
|
||||
color: $color;
|
||||
}
|
||||
a#{$parent}:hover {
|
||||
color: darken($color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
// Navbar vertical align
|
||||
// -------------------------
|
||||
// Vertically center elements in the navbar.
|
||||
// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
|
||||
@mixin navbar-vertical-align($element-height) {
|
||||
margin-top: (($navbar-height - $element-height) / 2);
|
||||
margin-bottom: (($navbar-height - $element-height) / 2);
|
||||
}
|
||||
|
||||
// Progress bars
|
||||
// -------------------------
|
||||
@mixin progress-bar-variant($color) {
|
||||
background-color: $color;
|
||||
.progress-striped & {
|
||||
@include gradient-striped();
|
||||
}
|
||||
}
|
||||
|
||||
// Responsive utilities
|
||||
// -------------------------
|
||||
// More easily include all the states for responsive-utilities.less.
|
||||
// [converter] $parent hack
|
||||
@mixin responsive-visibility($parent) {
|
||||
#{$parent} {
|
||||
display: block !important;
|
||||
}
|
||||
table#{$parent} { display: table; }
|
||||
tr#{$parent} { display: table-row !important; }
|
||||
th#{$parent},
|
||||
td#{$parent} { display: table-cell !important; }
|
||||
}
|
||||
|
||||
// [converter] $parent hack
|
||||
@mixin responsive-invisibility($parent) {
|
||||
#{$parent} {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Grid System
|
||||
// -----------
|
||||
|
||||
// Centered container element
|
||||
@mixin container-fixed() {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-left: ($grid-gutter-width / 2);
|
||||
padding-right: ($grid-gutter-width / 2);
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
// Creates a wrapper for a series of columns
|
||||
@mixin make-row($gutter: $grid-gutter-width) {
|
||||
margin-left: ($gutter / -2);
|
||||
margin-right: ($gutter / -2);
|
||||
@include clearfix();
|
||||
}
|
||||
|
||||
// Generate the extra small columns
|
||||
@mixin make-xs-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
min-height: 1px;
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
}
|
||||
@mixin make-xs-column-offset($columns) {
|
||||
@media (min-width: $screen-xs-min) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-xs-column-push($columns) {
|
||||
@media (min-width: $screen-xs-min) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-xs-column-pull($columns) {
|
||||
@media (min-width: $screen-xs-min) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Generate the small columns
|
||||
@mixin make-sm-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
|
||||
@media (min-width: $screen-sm-min) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-sm-column-offset($columns) {
|
||||
@media (min-width: $screen-sm-min) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-sm-column-push($columns) {
|
||||
@media (min-width: $screen-sm-min) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-sm-column-pull($columns) {
|
||||
@media (min-width: $screen-sm-min) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Generate the medium columns
|
||||
@mixin make-md-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
|
||||
@media (min-width: $screen-md-min) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-md-column-offset($columns) {
|
||||
@media (min-width: $screen-md-min) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-md-column-push($columns) {
|
||||
@media (min-width: $screen-md-min) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-md-column-pull($columns) {
|
||||
@media (min-width: $screen-md-min) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Generate the large columns
|
||||
@mixin make-lg-column($columns, $gutter: $grid-gutter-width) {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
|
||||
@media (min-width: $screen-lg-min) {
|
||||
float: left;
|
||||
width: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-lg-column-offset($columns) {
|
||||
@media (min-width: $screen-lg-min) {
|
||||
margin-left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-lg-column-push($columns) {
|
||||
@media (min-width: $screen-lg-min) {
|
||||
left: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
@mixin make-lg-column-pull($columns) {
|
||||
@media (min-width: $screen-lg-min) {
|
||||
right: percentage(($columns / $grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Framework grid generation
|
||||
//
|
||||
// Used only by Bootstrap to generate the correct number of grid classes given
|
||||
// any value of `$grid-columns`.
|
||||
|
||||
// [converter] This is defined recursively in LESS, but Sass supports real loops
|
||||
@mixin make-grid-columns() {
|
||||
$list: '';
|
||||
$i: 1;
|
||||
$list: ".col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}";
|
||||
@for $i from (1 + 1) through $grid-columns {
|
||||
$list: "#{$list}, .col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}";
|
||||
}
|
||||
#{$list} {
|
||||
position: relative;
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: ($grid-gutter-width / 2);
|
||||
padding-right: ($grid-gutter-width / 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// [converter] This is defined recursively in LESS, but Sass supports real loops
|
||||
@mixin float-grid-columns($class) {
|
||||
$list: '';
|
||||
$i: 1;
|
||||
$list: ".col-#{$class}-#{$i}";
|
||||
@for $i from (1 + 1) through $grid-columns {
|
||||
$list: "#{$list}, .col-#{$class}-#{$i}";
|
||||
}
|
||||
#{$list} {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@mixin calc-grid-column($index, $class, $type) {
|
||||
@if ($type == width) and ($index > 0) {
|
||||
.col-#{$class}-#{$index} {
|
||||
width: percentage(($index / $grid-columns));
|
||||
}
|
||||
}
|
||||
@if ($type == push) {
|
||||
.col-#{$class}-push-#{$index} {
|
||||
left: percentage(($index / $grid-columns));
|
||||
}
|
||||
}
|
||||
@if ($type == pull) {
|
||||
.col-#{$class}-pull-#{$index} {
|
||||
right: percentage(($index / $grid-columns));
|
||||
}
|
||||
}
|
||||
@if ($type == offset) {
|
||||
.col-#{$class}-offset-#{$index} {
|
||||
margin-left: percentage(($index / $grid-columns));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// [converter] This is defined recursively in LESS, but Sass supports real loops
|
||||
@mixin loop-grid-columns($columns, $class, $type) {
|
||||
@for $i from 0 through $columns {
|
||||
@include calc-grid-column($i, $class, $type);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Create grid for specific class
|
||||
@mixin make-grid($class) {
|
||||
@include float-grid-columns($class);
|
||||
@include loop-grid-columns($grid-columns, $class, width);
|
||||
@include loop-grid-columns($grid-columns, $class, pull);
|
||||
@include loop-grid-columns($grid-columns, $class, push);
|
||||
@include loop-grid-columns($grid-columns, $class, offset);
|
||||
}
|
||||
|
||||
// Form validation states
|
||||
//
|
||||
// Used in forms.less to generate the form validation CSS for warnings, errors,
|
||||
// and successes.
|
||||
|
||||
@mixin form-control-validation($text-color: #555, $border-color: #ccc, $background-color: #f5f5f5) {
|
||||
// Color the label and help text
|
||||
.help-block,
|
||||
.control-label,
|
||||
.radio,
|
||||
.checkbox,
|
||||
.radio-inline,
|
||||
.checkbox-inline {
|
||||
color: $text-color;
|
||||
}
|
||||
// Set the border and box shadow on specific inputs to match
|
||||
.form-control {
|
||||
border-color: $border-color;
|
||||
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
|
||||
&:focus {
|
||||
border-color: darken($border-color, 10%);
|
||||
$shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%);
|
||||
@include box-shadow($shadow);
|
||||
}
|
||||
}
|
||||
// Set validation states also for addons
|
||||
.input-group-addon {
|
||||
color: $text-color;
|
||||
border-color: $border-color;
|
||||
background-color: $background-color;
|
||||
}
|
||||
// Optional feedback icon
|
||||
.form-control-feedback {
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
|
||||
// Form control focus state
|
||||
//
|
||||
// Generate a customized focus state and for any input with the specified color,
|
||||
// which defaults to the `$input-focus-border` variable.
|
||||
//
|
||||
// We highly encourage you to not customize the default value, but instead use
|
||||
// this to tweak colors on an as-needed basis. This aesthetic change is based on
|
||||
// WebKit's default styles, but applicable to a wider range of browsers. Its
|
||||
// usability and accessibility should be taken into account with any change.
|
||||
//
|
||||
// Example usage: change the default blue border and shadow to white for better
|
||||
// contrast against a dark gray background.
|
||||
|
||||
@mixin form-control-focus($color: $input-border-focus) {
|
||||
$color-rgba: rgba(red($color), green($color), blue($color), .6);
|
||||
&:focus {
|
||||
border-color: $color;
|
||||
outline: 0;
|
||||
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $color-rgba);
|
||||
}
|
||||
}
|
||||
|
||||
// Form control sizing
|
||||
//
|
||||
// Relative text size, padding, and border-radii changes for form controls. For
|
||||
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
|
||||
// element gets special love because it's special, and that's a fact!
|
||||
|
||||
// [converter] $parent hack
|
||||
@mixin input-size($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
|
||||
#{$parent} {
|
||||
height: $input-height;
|
||||
padding: $padding-vertical $padding-horizontal;
|
||||
font-size: $font-size;
|
||||
line-height: $line-height;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
select#{$parent} {
|
||||
height: $input-height;
|
||||
line-height: $input-height;
|
||||
}
|
||||
|
||||
textarea#{$parent},
|
||||
select[multiple]#{$parent} {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,833 @@
|
|||
// a flag to toggle asset pipeline / compass integration
|
||||
// defaults to true if twbs-font-path function is present (no function => twbs-font-path('') parsed as string == right side)
|
||||
// in Sass 3.3 this can be improved with: function-exists(twbs-font-path)
|
||||
$bootstrap-sass-asset-helper: (twbs-font-path("") != unquote('twbs-font-path("")')) !default;
|
||||
//
|
||||
// Variables
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
//== Colors
|
||||
//
|
||||
//## Gray and brand colors for use across Bootstrap.
|
||||
|
||||
$gray-darker: lighten(#000, 13.5%) !default; // #222
|
||||
$gray-dark: lighten(#000, 20%) !default; // #333
|
||||
$gray: lighten(#000, 33.5%) !default; // #555
|
||||
$gray-light: lighten(#000, 60%) !default; // #999
|
||||
$gray-lighter: lighten(#000, 93.5%) !default; // #eee
|
||||
|
||||
$brand-primary: #47bab5 !default;
|
||||
$brand-success: #5cb85c !default;
|
||||
$brand-info: #5bc0de !default;
|
||||
$brand-warning: #f0ad4e !default;
|
||||
$brand-danger: #ed4c43 !default;
|
||||
|
||||
|
||||
//== Scaffolding
|
||||
//
|
||||
// ## Settings for some of the most global styles.
|
||||
|
||||
//** Background color for `<body>`.
|
||||
$body-bg: #fff !default;
|
||||
//** Global text color on `<body>`.
|
||||
$text-color: $gray-dark !default;
|
||||
|
||||
//** Global textual link color.
|
||||
$link-color: $brand-primary !default;
|
||||
//** Link hover color set via `darken()` function.
|
||||
$link-hover-color: darken($link-color, 15%) !default;
|
||||
|
||||
|
||||
//== Typography
|
||||
//
|
||||
//## Font, line-height, and color for body text, headings, and more.
|
||||
|
||||
$font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
|
||||
$font-family-serif: Georgia, "Times New Roman", Times, serif !default;
|
||||
//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
|
||||
$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
|
||||
$font-family-base: $font-family-sans-serif !default;
|
||||
|
||||
$font-size-base: 14px !default;
|
||||
$font-size-large: ceil(($font-size-base * 1.25)) !default; // ~18px
|
||||
$font-size-small: ceil(($font-size-base * 0.85)) !default; // ~12px
|
||||
|
||||
$font-size-h1: floor(($font-size-base * 2.6)) !default; // ~36px
|
||||
$font-size-h2: floor(($font-size-base * 2.15)) !default; // ~30px
|
||||
$font-size-h3: ceil(($font-size-base * 1.7)) !default; // ~24px
|
||||
$font-size-h4: ceil(($font-size-base * 1.25)) !default; // ~18px
|
||||
$font-size-h5: $font-size-base !default;
|
||||
$font-size-h6: ceil(($font-size-base * 0.85)) !default; // ~12px
|
||||
|
||||
//** Unit-less `line-height` for use in components like buttons.
|
||||
$line-height-base: 1.428571429 !default; // 20/14
|
||||
//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
|
||||
$line-height-computed: floor(($font-size-base * $line-height-base)) !default; // ~20px
|
||||
|
||||
//** By default, this inherits from the `<body>`.
|
||||
$headings-font-family: inherit !default;
|
||||
$headings-font-weight: 500 !default;
|
||||
$headings-line-height: 1.1 !default;
|
||||
$headings-color: inherit !default;
|
||||
|
||||
|
||||
//-- Iconography
|
||||
//
|
||||
//## Specify custom locations of the include Glyphicons icon font. Useful for those including Bootstrap via Bower.
|
||||
|
||||
$icon-font-path: "bootstrap/" !default;
|
||||
$icon-font-name: "glyphicons-halflings-regular" !default;
|
||||
$icon-font-svg-id: "glyphicons_halflingsregular" !default;
|
||||
|
||||
//== Components
|
||||
//
|
||||
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
|
||||
|
||||
$padding-base-vertical: 6px !default;
|
||||
$padding-base-horizontal: 12px !default;
|
||||
|
||||
$padding-large-vertical: 10px !default;
|
||||
$padding-large-horizontal: 16px !default;
|
||||
|
||||
$padding-small-vertical: 5px !default;
|
||||
$padding-small-horizontal: 10px !default;
|
||||
|
||||
$padding-xs-vertical: 1px !default;
|
||||
$padding-xs-horizontal: 5px !default;
|
||||
|
||||
$line-height-large: 1.33 !default;
|
||||
$line-height-small: 1.5 !default;
|
||||
|
||||
$border-radius-base: 4px !default;
|
||||
$border-radius-large: 6px !default;
|
||||
$border-radius-small: 3px !default;
|
||||
|
||||
//** Global color for active items (e.g., navs or dropdowns).
|
||||
$component-active-color: #fff !default;
|
||||
//** Global background color for active items (e.g., navs or dropdowns).
|
||||
$component-active-bg: $brand-primary !default;
|
||||
|
||||
//** Width of the `border` for generating carets that indicator dropdowns.
|
||||
$caret-width-base: 4px !default;
|
||||
//** Carets increase slightly in size for larger components.
|
||||
$caret-width-large: 5px !default;
|
||||
|
||||
|
||||
//== Tables
|
||||
//
|
||||
//## Customizes the `.table` component with basic values, each used across all table variations.
|
||||
|
||||
//** Padding for `<th>`s and `<td>`s.
|
||||
$table-cell-padding: 8px !default;
|
||||
//** Padding for cells in `.table-condensed`.
|
||||
$table-condensed-cell-padding: 5px !default;
|
||||
|
||||
//** Default background color used for all tables.
|
||||
$table-bg: transparent !default;
|
||||
//** Background color used for `.table-striped`.
|
||||
$table-bg-accent: #f9f9f9 !default;
|
||||
//** Background color used for `.table-hover`.
|
||||
$table-bg-hover: #f5f5f5 !default;
|
||||
$table-bg-active: $table-bg-hover !default;
|
||||
|
||||
//** Border color for table and cell borders.
|
||||
$table-border-color: #ddd !default;
|
||||
|
||||
|
||||
//== Buttons
|
||||
//
|
||||
//## For each of Bootstrap's buttons, define text, background and border color.
|
||||
|
||||
$btn-font-weight: normal !default;
|
||||
|
||||
$btn-default-color: #333 !default;
|
||||
$btn-default-bg: #fff !default;
|
||||
$btn-default-border: #ccc !default;
|
||||
|
||||
$btn-primary-color: #fff !default;
|
||||
$btn-primary-bg: $brand-primary !default;
|
||||
$btn-primary-border: darken($btn-primary-bg, 5%) !default;
|
||||
|
||||
$btn-success-color: #fff !default;
|
||||
$btn-success-bg: $brand-success !default;
|
||||
$btn-success-border: darken($btn-success-bg, 5%) !default;
|
||||
|
||||
$btn-info-color: #fff !default;
|
||||
$btn-info-bg: $brand-info !default;
|
||||
$btn-info-border: darken($btn-info-bg, 5%) !default;
|
||||
|
||||
$btn-warning-color: #fff !default;
|
||||
$btn-warning-bg: $brand-warning !default;
|
||||
$btn-warning-border: darken($btn-warning-bg, 5%) !default;
|
||||
|
||||
$btn-danger-color: #fff !default;
|
||||
$btn-danger-bg: $brand-danger !default;
|
||||
$btn-danger-border: darken($btn-danger-bg, 5%) !default;
|
||||
|
||||
$btn-link-disabled-color: $gray-light !default;
|
||||
|
||||
|
||||
//== Forms
|
||||
//
|
||||
//##
|
||||
|
||||
//** `<input>` background color
|
||||
$input-bg: #fff !default;
|
||||
//** `<input disabled>` background color
|
||||
$input-bg-disabled: $gray-lighter !default;
|
||||
|
||||
//** Text color for `<input>`s
|
||||
$input-color: $gray !default;
|
||||
//** `<input>` border color
|
||||
$input-border: #ccc !default;
|
||||
//** `<input>` border radius
|
||||
$input-border-radius: $border-radius-base !default;
|
||||
//** Border color for inputs on focus
|
||||
$input-border-focus: #66afe9 !default;
|
||||
|
||||
//** Placeholder text color
|
||||
$input-color-placeholder: $gray-light !default;
|
||||
|
||||
//** Default `.form-control` height
|
||||
$input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2) !default;
|
||||
//** Large `.form-control` height
|
||||
$input-height-large: (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default;
|
||||
//** Small `.form-control` height
|
||||
$input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default;
|
||||
|
||||
$legend-color: $gray-dark !default;
|
||||
$legend-border-color: #e5e5e5 !default;
|
||||
|
||||
//** Background color for textual input addons
|
||||
$input-group-addon-bg: $gray-lighter !default;
|
||||
//** Border color for textual input addons
|
||||
$input-group-addon-border-color: $input-border !default;
|
||||
|
||||
|
||||
//== Dropdowns
|
||||
//
|
||||
//## Dropdown menu container and contents.
|
||||
|
||||
//** Background for the dropdown menu.
|
||||
$dropdown-bg: #fff !default;
|
||||
//** Dropdown menu `border-color`.
|
||||
$dropdown-border: rgba(0,0,0,.15) !default;
|
||||
//** Dropdown menu `border-color` **for IE8**.
|
||||
$dropdown-fallback-border: #ccc !default;
|
||||
//** Divider color for between dropdown items.
|
||||
$dropdown-divider-bg: #e5e5e5 !default;
|
||||
|
||||
//** Dropdown link text color.
|
||||
$dropdown-link-color: $gray-dark !default;
|
||||
//** Hover color for dropdown links.
|
||||
$dropdown-link-hover-color: darken($gray-dark, 5%) !default;
|
||||
//** Hover background for dropdown links.
|
||||
$dropdown-link-hover-bg: #f5f5f5 !default;
|
||||
|
||||
//** Active dropdown menu item text color.
|
||||
$dropdown-link-active-color: $component-active-color !default;
|
||||
//** Active dropdown menu item background color.
|
||||
$dropdown-link-active-bg: $component-active-bg !default;
|
||||
|
||||
//** Disabled dropdown menu item background color.
|
||||
$dropdown-link-disabled-color: $gray-light !default;
|
||||
|
||||
//** Text color for headers within dropdown menus.
|
||||
$dropdown-header-color: $gray-light !default;
|
||||
|
||||
// Note: Deprecated $dropdown-caret-color as of v3.1.0
|
||||
$dropdown-caret-color: #000 !default;
|
||||
|
||||
|
||||
//-- Z-index master list
|
||||
//
|
||||
// Warning: Avoid customizing these values. They're used for a bird's eye view
|
||||
// of components dependent on the z-axis and are designed to all work together.
|
||||
//
|
||||
// Note: These variables are not generated into the Customizer.
|
||||
|
||||
$zindex-navbar: 1000 !default;
|
||||
$zindex-dropdown: 1000 !default;
|
||||
$zindex-popover: 1010 !default;
|
||||
$zindex-tooltip: 1030 !default;
|
||||
$zindex-navbar-fixed: 1030 !default;
|
||||
$zindex-modal-background: 1040 !default;
|
||||
$zindex-modal: 1050 !default;
|
||||
|
||||
|
||||
//== Media queries breakpoints
|
||||
//
|
||||
//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
|
||||
|
||||
// Extra small screen / phone
|
||||
// Note: Deprecated $screen-xs and $screen-phone as of v3.0.1
|
||||
$screen-xs: 480px !default;
|
||||
$screen-xs-min: $screen-xs !default;
|
||||
$screen-phone: $screen-xs-min !default;
|
||||
|
||||
// Small screen / tablet
|
||||
// Note: Deprecated $screen-sm and $screen-tablet as of v3.0.1
|
||||
$screen-sm: 768px !default;
|
||||
$screen-sm-min: $screen-sm !default;
|
||||
$screen-tablet: $screen-sm-min !default;
|
||||
|
||||
// Medium screen / desktop
|
||||
// Note: Deprecated $screen-md and $screen-desktop as of v3.0.1
|
||||
$screen-md: 992px !default;
|
||||
$screen-md-min: $screen-md !default;
|
||||
$screen-desktop: $screen-md-min !default;
|
||||
|
||||
// Large screen / wide desktop
|
||||
// Note: Deprecated $screen-lg and $screen-lg-desktop as of v3.0.1
|
||||
$screen-lg: 1200px !default;
|
||||
$screen-lg-min: $screen-lg !default;
|
||||
$screen-lg-desktop: $screen-lg-min !default;
|
||||
|
||||
// So media queries don't overlap when required, provide a maximum
|
||||
$screen-xs-max: ($screen-sm-min - 1) !default;
|
||||
$screen-sm-max: ($screen-md-min - 1) !default;
|
||||
$screen-md-max: ($screen-lg-min - 1) !default;
|
||||
|
||||
|
||||
//== Grid system
|
||||
//
|
||||
//## Define your custom responsive grid.
|
||||
|
||||
//** Number of columns in the grid.
|
||||
$grid-columns: 12 !default;
|
||||
//** Padding between columns. Gets divided in half for the left and right.
|
||||
$grid-gutter-width: 30px !default;
|
||||
// Navbar collapse
|
||||
//** Point at which the navbar becomes uncollapsed.
|
||||
$grid-float-breakpoint: $screen-sm-min !default;
|
||||
//** Point at which the navbar begins collapsing.
|
||||
$grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default;
|
||||
|
||||
|
||||
//== Container sizes
|
||||
//
|
||||
//## Define the maximum width of `.container` for different screen sizes.
|
||||
|
||||
// Small screen / tablet
|
||||
$container-tablet: ((720px + $grid-gutter-width)) !default;
|
||||
//** For `$screen-sm-min` and up.
|
||||
$container-sm: $container-tablet !default;
|
||||
|
||||
// Medium screen / desktop
|
||||
$container-desktop: ((940px + $grid-gutter-width)) !default;
|
||||
//** For `$screen-md-min` and up.
|
||||
$container-md: $container-desktop !default;
|
||||
|
||||
// Large screen / wide desktop
|
||||
$container-large-desktop: ((1140px + $grid-gutter-width)) !default;
|
||||
//** For `$screen-lg-min` and up.
|
||||
$container-lg: $container-large-desktop !default;
|
||||
|
||||
|
||||
//== Navbar
|
||||
//
|
||||
//##
|
||||
|
||||
// Basics of a navbar
|
||||
$navbar-height: 50px !default;
|
||||
$navbar-margin-bottom: $line-height-computed !default;
|
||||
$navbar-border-radius: $border-radius-base !default;
|
||||
$navbar-padding-horizontal: floor(($grid-gutter-width / 2)) !default;
|
||||
$navbar-padding-vertical: (($navbar-height - $line-height-computed) / 2) !default;
|
||||
$navbar-collapse-max-height: 340px !default;
|
||||
|
||||
$navbar-default-color: #777 !default;
|
||||
$navbar-default-bg: #f8f8f8 !default;
|
||||
$navbar-default-border: darken($navbar-default-bg, 6.5%) !default;
|
||||
|
||||
// Navbar links
|
||||
$navbar-default-link-color: #777 !default;
|
||||
$navbar-default-link-hover-color: #333 !default;
|
||||
$navbar-default-link-hover-bg: transparent !default;
|
||||
$navbar-default-link-active-color: #555 !default;
|
||||
$navbar-default-link-active-bg: darken($navbar-default-bg, 6.5%) !default;
|
||||
$navbar-default-link-disabled-color: #ccc !default;
|
||||
$navbar-default-link-disabled-bg: transparent !default;
|
||||
|
||||
// Navbar brand label
|
||||
$navbar-default-brand-color: $navbar-default-link-color !default;
|
||||
$navbar-default-brand-hover-color: darken($navbar-default-brand-color, 10%) !default;
|
||||
$navbar-default-brand-hover-bg: transparent !default;
|
||||
|
||||
// Navbar toggle
|
||||
$navbar-default-toggle-hover-bg: #ddd !default;
|
||||
$navbar-default-toggle-icon-bar-bg: #888 !default;
|
||||
$navbar-default-toggle-border-color: #ddd !default;
|
||||
|
||||
|
||||
// Inverted navbar
|
||||
// Reset inverted navbar basics
|
||||
$navbar-inverse-color: $gray-light !default;
|
||||
$navbar-inverse-bg: #222 !default;
|
||||
$navbar-inverse-border: darken($navbar-inverse-bg, 10%) !default;
|
||||
|
||||
// Inverted navbar links
|
||||
$navbar-inverse-link-color: $gray-light !default;
|
||||
$navbar-inverse-link-hover-color: #fff !default;
|
||||
$navbar-inverse-link-hover-bg: transparent !default;
|
||||
$navbar-inverse-link-active-color: $navbar-inverse-link-hover-color !default;
|
||||
$navbar-inverse-link-active-bg: darken($navbar-inverse-bg, 10%) !default;
|
||||
$navbar-inverse-link-disabled-color: #444 !default;
|
||||
$navbar-inverse-link-disabled-bg: transparent !default;
|
||||
|
||||
// Inverted navbar brand label
|
||||
$navbar-inverse-brand-color: $navbar-inverse-link-color !default;
|
||||
$navbar-inverse-brand-hover-color: #fff !default;
|
||||
$navbar-inverse-brand-hover-bg: transparent !default;
|
||||
|
||||
// Inverted navbar toggle
|
||||
$navbar-inverse-toggle-hover-bg: #333 !default;
|
||||
$navbar-inverse-toggle-icon-bar-bg: #fff !default;
|
||||
$navbar-inverse-toggle-border-color: #333 !default;
|
||||
|
||||
|
||||
//== Navs
|
||||
//
|
||||
//##
|
||||
|
||||
//=== Shared nav styles
|
||||
$nav-link-padding: 10px 15px !default;
|
||||
$nav-link-hover-bg: $gray-lighter !default;
|
||||
|
||||
$nav-disabled-link-color: $gray-light !default;
|
||||
$nav-disabled-link-hover-color: $gray-light !default;
|
||||
|
||||
$nav-open-link-hover-color: #fff !default;
|
||||
|
||||
//== Tabs
|
||||
$nav-tabs-border-color: #ddd !default;
|
||||
|
||||
$nav-tabs-link-hover-border-color: $gray-lighter !default;
|
||||
|
||||
$nav-tabs-active-link-hover-bg: $body-bg !default;
|
||||
$nav-tabs-active-link-hover-color: $gray !default;
|
||||
$nav-tabs-active-link-hover-border-color: #ddd !default;
|
||||
|
||||
$nav-tabs-justified-link-border-color: #ddd !default;
|
||||
$nav-tabs-justified-active-link-border-color: $body-bg !default;
|
||||
|
||||
//== Pills
|
||||
$nav-pills-border-radius: $border-radius-base !default;
|
||||
$nav-pills-active-link-hover-bg: $component-active-bg !default;
|
||||
$nav-pills-active-link-hover-color: $component-active-color !default;
|
||||
|
||||
|
||||
//== Pagination
|
||||
//
|
||||
//##
|
||||
|
||||
$pagination-color: $link-color !default;
|
||||
$pagination-bg: #fff !default;
|
||||
$pagination-border: #ddd !default;
|
||||
|
||||
$pagination-hover-color: $link-hover-color !default;
|
||||
$pagination-hover-bg: $gray-lighter !default;
|
||||
$pagination-hover-border: #ddd !default;
|
||||
|
||||
$pagination-active-color: #fff !default;
|
||||
$pagination-active-bg: $brand-primary !default;
|
||||
$pagination-active-border: $brand-primary !default;
|
||||
|
||||
$pagination-disabled-color: $gray-light !default;
|
||||
$pagination-disabled-bg: #fff !default;
|
||||
$pagination-disabled-border: #ddd !default;
|
||||
|
||||
|
||||
//== Pager
|
||||
//
|
||||
//##
|
||||
|
||||
$pager-bg: $pagination-bg !default;
|
||||
$pager-border: $pagination-border !default;
|
||||
$pager-border-radius: 15px !default;
|
||||
|
||||
$pager-hover-bg: $pagination-hover-bg !default;
|
||||
|
||||
$pager-active-bg: $pagination-active-bg !default;
|
||||
$pager-active-color: $pagination-active-color !default;
|
||||
|
||||
$pager-disabled-color: $pagination-disabled-color !default;
|
||||
|
||||
|
||||
//== Jumbotron
|
||||
//
|
||||
//##
|
||||
|
||||
$jumbotron-padding: 30px !default;
|
||||
$jumbotron-color: inherit !default;
|
||||
$jumbotron-bg: $gray-lighter !default;
|
||||
$jumbotron-heading-color: inherit !default;
|
||||
$jumbotron-font-size: ceil(($font-size-base * 1.5)) !default;
|
||||
|
||||
|
||||
//== Form states and alerts
|
||||
//
|
||||
//## Define colors for form feedback states and, by default, alerts.
|
||||
|
||||
$state-success-text: #3c763d !default;
|
||||
$state-success-bg: #dff0d8 !default;
|
||||
$state-success-border: darken(adjust-hue($state-success-bg, -10), 5%) !default;
|
||||
|
||||
$state-info-text: #31708f !default;
|
||||
$state-info-bg: #d9edf7 !default;
|
||||
$state-info-border: darken(adjust-hue($state-info-bg, -10), 7%) !default;
|
||||
|
||||
$state-warning-text: #8a6d3b !default;
|
||||
$state-warning-bg: #fcf8e3 !default;
|
||||
$state-warning-border: darken(adjust-hue($state-warning-bg, -10), 5%) !default;
|
||||
|
||||
$state-danger-text: #a94442 !default;
|
||||
$state-danger-bg: #f2dede !default;
|
||||
$state-danger-border: darken(adjust-hue($state-danger-bg, -10), 5%) !default;
|
||||
|
||||
|
||||
//== Tooltips
|
||||
//
|
||||
//##
|
||||
|
||||
//** Tooltip max width
|
||||
$tooltip-max-width: 200px !default;
|
||||
//** Tooltip text color
|
||||
$tooltip-color: #fff !default;
|
||||
//** Tooltip background color
|
||||
$tooltip-bg: #000 !default;
|
||||
$tooltip-opacity: .9 !default;
|
||||
|
||||
//** Tooltip arrow width
|
||||
$tooltip-arrow-width: 5px !default;
|
||||
//** Tooltip arrow color
|
||||
$tooltip-arrow-color: $tooltip-bg !default;
|
||||
|
||||
|
||||
//== Popovers
|
||||
//
|
||||
//##
|
||||
|
||||
//** Popover body background color
|
||||
$popover-bg: #fff !default;
|
||||
//** Popover maximum width
|
||||
$popover-max-width: 276px !default;
|
||||
//** Popover border color
|
||||
$popover-border-color: rgba(0,0,0,.2) !default;
|
||||
//** Popover fallback border color
|
||||
$popover-fallback-border-color: #ccc !default;
|
||||
|
||||
//** Popover title background color
|
||||
$popover-title-bg: darken($popover-bg, 3%) !default;
|
||||
|
||||
//** Popover arrow width
|
||||
$popover-arrow-width: 10px !default;
|
||||
//** Popover arrow color
|
||||
$popover-arrow-color: #fff !default;
|
||||
|
||||
//** Popover outer arrow width
|
||||
$popover-arrow-outer-width: ($popover-arrow-width + 1) !default;
|
||||
//** Popover outer arrow color
|
||||
$popover-arrow-outer-color: fadein($popover-border-color, 5%) !default;
|
||||
//** Popover outer arrow fallback color
|
||||
$popover-arrow-outer-fallback-color: darken($popover-fallback-border-color, 20%) !default;
|
||||
|
||||
|
||||
//== Labels
|
||||
//
|
||||
//##
|
||||
|
||||
//** Default label background color
|
||||
$label-default-bg: $gray-light !default;
|
||||
//** Primary label background color
|
||||
$label-primary-bg: $brand-primary !default;
|
||||
//** Success label background color
|
||||
$label-success-bg: $brand-success !default;
|
||||
//** Info label background color
|
||||
$label-info-bg: $brand-info !default;
|
||||
//** Warning label background color
|
||||
$label-warning-bg: $brand-warning !default;
|
||||
//** Danger label background color
|
||||
$label-danger-bg: $brand-danger !default;
|
||||
|
||||
//** Default label text color
|
||||
$label-color: #fff !default;
|
||||
//** Default text color of a linked label
|
||||
$label-link-hover-color: #fff !default;
|
||||
|
||||
|
||||
//== Modals
|
||||
//
|
||||
//##
|
||||
|
||||
//** Padding applied to the modal body
|
||||
$modal-inner-padding: 20px !default;
|
||||
|
||||
//** Padding applied to the modal title
|
||||
$modal-title-padding: 15px !default;
|
||||
//** Modal title line-height
|
||||
$modal-title-line-height: $line-height-base !default;
|
||||
|
||||
//** Background color of modal content area
|
||||
$modal-content-bg: #fff !default;
|
||||
//** Modal content border color
|
||||
$modal-content-border-color: rgba(0,0,0,.2) !default;
|
||||
//** Modal content border color **for IE8**
|
||||
$modal-content-fallback-border-color: #999 !default;
|
||||
|
||||
//** Modal backdrop background color
|
||||
$modal-backdrop-bg: #000 !default;
|
||||
//** Modal backdrop opacity
|
||||
$modal-backdrop-opacity: .5 !default;
|
||||
//** Modal header border color
|
||||
$modal-header-border-color: #e5e5e5 !default;
|
||||
//** Modal footer border color
|
||||
$modal-footer-border-color: $modal-header-border-color !default;
|
||||
|
||||
$modal-lg: 900px !default;
|
||||
$modal-md: 600px !default;
|
||||
$modal-sm: 300px !default;
|
||||
|
||||
|
||||
//== Alerts
|
||||
//
|
||||
//## Define alert colors, border radius, and padding.
|
||||
|
||||
$alert-padding: 15px !default;
|
||||
$alert-border-radius: $border-radius-base !default;
|
||||
$alert-link-font-weight: bold !default;
|
||||
|
||||
$alert-success-bg: $state-success-bg !default;
|
||||
$alert-success-text: $state-success-text !default;
|
||||
$alert-success-border: $state-success-border !default;
|
||||
|
||||
$alert-info-bg: $state-info-bg !default;
|
||||
$alert-info-text: $state-info-text !default;
|
||||
$alert-info-border: $state-info-border !default;
|
||||
|
||||
$alert-warning-bg: $state-warning-bg !default;
|
||||
$alert-warning-text: $state-warning-text !default;
|
||||
$alert-warning-border: $state-warning-border !default;
|
||||
|
||||
$alert-danger-bg: $state-danger-bg !default;
|
||||
$alert-danger-text: $state-danger-text !default;
|
||||
$alert-danger-border: $state-danger-border !default;
|
||||
|
||||
|
||||
//== Progress bars
|
||||
//
|
||||
//##
|
||||
|
||||
//** Background color of the whole progress component
|
||||
$progress-bg: #f5f5f5 !default;
|
||||
//** Progress bar text color
|
||||
$progress-bar-color: #fff !default;
|
||||
|
||||
//** Default progress bar color
|
||||
$progress-bar-bg: $brand-primary !default;
|
||||
//** Success progress bar color
|
||||
$progress-bar-success-bg: $brand-success !default;
|
||||
//** Warning progress bar color
|
||||
$progress-bar-warning-bg: $brand-warning !default;
|
||||
//** Danger progress bar color
|
||||
$progress-bar-danger-bg: $brand-danger !default;
|
||||
//** Info progress bar color
|
||||
$progress-bar-info-bg: $brand-info !default;
|
||||
|
||||
|
||||
//== List group
|
||||
//
|
||||
//##
|
||||
|
||||
//** Background color on `.list-group-item`
|
||||
$list-group-bg: #fff !default;
|
||||
//** `.list-group-item` border color
|
||||
$list-group-border: #ddd !default;
|
||||
//** List group border radius
|
||||
$list-group-border-radius: $border-radius-base !default;
|
||||
|
||||
//** Background color of single list elements on hover
|
||||
$list-group-hover-bg: #f5f5f5 !default;
|
||||
//** Text color of active list elements
|
||||
$list-group-active-color: $component-active-color !default;
|
||||
//** Background color of active list elements
|
||||
$list-group-active-bg: $component-active-bg !default;
|
||||
//** Border color of active list elements
|
||||
$list-group-active-border: $list-group-active-bg !default;
|
||||
$list-group-active-text-color: lighten($list-group-active-bg, 40%) !default;
|
||||
|
||||
$list-group-link-color: #555 !default;
|
||||
$list-group-link-heading-color: #333 !default;
|
||||
|
||||
|
||||
//== Panels
|
||||
//
|
||||
//##
|
||||
|
||||
$panel-bg: #fff !default;
|
||||
$panel-body-padding: 15px !default;
|
||||
$panel-border-radius: $border-radius-base !default;
|
||||
|
||||
//** Border color for elements within panels
|
||||
$panel-inner-border: #ddd !default;
|
||||
$panel-footer-bg: #f5f5f5 !default;
|
||||
|
||||
$panel-default-text: $gray-dark !default;
|
||||
$panel-default-border: #ddd !default;
|
||||
$panel-default-heading-bg: #f5f5f5 !default;
|
||||
|
||||
$panel-primary-text: #fff !default;
|
||||
$panel-primary-border: $brand-primary !default;
|
||||
$panel-primary-heading-bg: $brand-primary !default;
|
||||
|
||||
$panel-success-text: $state-success-text !default;
|
||||
$panel-success-border: $state-success-border !default;
|
||||
$panel-success-heading-bg: $state-success-bg !default;
|
||||
|
||||
$panel-info-text: $state-info-text !default;
|
||||
$panel-info-border: $state-info-border !default;
|
||||
$panel-info-heading-bg: $state-info-bg !default;
|
||||
|
||||
$panel-warning-text: $state-warning-text !default;
|
||||
$panel-warning-border: $state-warning-border !default;
|
||||
$panel-warning-heading-bg: $state-warning-bg !default;
|
||||
|
||||
$panel-danger-text: $state-danger-text !default;
|
||||
$panel-danger-border: $state-danger-border !default;
|
||||
$panel-danger-heading-bg: $state-danger-bg !default;
|
||||
|
||||
|
||||
//== Thumbnails
|
||||
//
|
||||
//##
|
||||
|
||||
//** Padding around the thumbnail image
|
||||
$thumbnail-padding: 4px !default;
|
||||
//** Thumbnail background color
|
||||
$thumbnail-bg: $body-bg !default;
|
||||
//** Thumbnail border color
|
||||
$thumbnail-border: #ddd !default;
|
||||
//** Thumbnail border radius
|
||||
$thumbnail-border-radius: $border-radius-base !default;
|
||||
|
||||
//** Custom text color for thumbnail captions
|
||||
$thumbnail-caption-color: $text-color !default;
|
||||
//** Padding around the thumbnail caption
|
||||
$thumbnail-caption-padding: 9px !default;
|
||||
|
||||
|
||||
//== Wells
|
||||
//
|
||||
//##
|
||||
|
||||
$well-bg: #f5f5f5 !default;
|
||||
$well-border: darken($well-bg, 7%) !default;
|
||||
|
||||
|
||||
//== Badges
|
||||
//
|
||||
//##
|
||||
|
||||
$badge-color: #fff !default;
|
||||
//** Linked badge text color on hover
|
||||
$badge-link-hover-color: #fff !default;
|
||||
$badge-bg: $gray-light !default;
|
||||
|
||||
//** Badge text color in active nav link
|
||||
$badge-active-color: $link-color !default;
|
||||
//** Badge background color in active nav link
|
||||
$badge-active-bg: #fff !default;
|
||||
|
||||
$badge-font-weight: bold !default;
|
||||
$badge-line-height: 1 !default;
|
||||
$badge-border-radius: 10px !default;
|
||||
|
||||
|
||||
//== Breadcrumbs
|
||||
//
|
||||
//##
|
||||
|
||||
$breadcrumb-padding-vertical: 8px !default;
|
||||
$breadcrumb-padding-horizontal: 15px !default;
|
||||
//** Breadcrumb background color
|
||||
$breadcrumb-bg: #f5f5f5 !default;
|
||||
//** Breadcrumb text color
|
||||
$breadcrumb-color: #ccc !default;
|
||||
//** Text color of current page in the breadcrumb
|
||||
$breadcrumb-active-color: $gray-light !default;
|
||||
//** Textual separator for between breadcrumb elements
|
||||
$breadcrumb-separator: "/" !default;
|
||||
|
||||
|
||||
//== Carousel
|
||||
//
|
||||
//##
|
||||
|
||||
$carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6) !default;
|
||||
|
||||
$carousel-control-color: #fff !default;
|
||||
$carousel-control-width: 15% !default;
|
||||
$carousel-control-opacity: .5 !default;
|
||||
$carousel-control-font-size: 20px !default;
|
||||
|
||||
$carousel-indicator-active-bg: #fff !default;
|
||||
$carousel-indicator-border-color: #fff !default;
|
||||
|
||||
$carousel-caption-color: #fff !default;
|
||||
|
||||
|
||||
//== Close
|
||||
//
|
||||
//##
|
||||
|
||||
$close-font-weight: bold !default;
|
||||
$close-color: #000 !default;
|
||||
$close-text-shadow: 0 1px 0 #fff !default;
|
||||
|
||||
|
||||
//== Code
|
||||
//
|
||||
//##
|
||||
|
||||
$code-color: #c7254e !default;
|
||||
$code-bg: #f9f2f4 !default;
|
||||
|
||||
$kbd-color: #fff !default;
|
||||
$kbd-bg: #333 !default;
|
||||
|
||||
$pre-bg: #f5f5f5 !default;
|
||||
$pre-color: $gray-dark !default;
|
||||
$pre-border-color: #ccc !default;
|
||||
$pre-scrollable-max-height: 340px !default;
|
||||
|
||||
|
||||
//== Type
|
||||
//
|
||||
//##
|
||||
|
||||
//** Text muted color
|
||||
$text-muted: $gray-light !default;
|
||||
//** Abbreviations and acronyms border color
|
||||
$abbr-border-color: $gray-light !default;
|
||||
//** Headings small color
|
||||
$headings-small-color: $gray-light !default;
|
||||
//** Blockquote small color
|
||||
$blockquote-small-color: $gray-light !default;
|
||||
//** Blockquote font size
|
||||
$blockquote-font-size: ($font-size-base * 1.25) !default;
|
||||
//** Blockquote border color
|
||||
$blockquote-border-color: $gray-lighter !default;
|
||||
//** Page header border color
|
||||
$page-header-border-color: $gray-lighter !default;
|
||||
|
||||
|
||||
//== Miscellaneous
|
||||
//
|
||||
//##
|
||||
|
||||
//** Horizontal line color.
|
||||
$hr-border: $gray-lighter !default;
|
||||
|
||||
//** Horizontal offset for forms and lists.
|
||||
$component-offset-horizontal: 180px !default;
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,16 @@
|
|||
@charset "utf-8";
|
||||
|
||||
a[accesskey] {
|
||||
position: absolute;
|
||||
margin-left: -15px;
|
||||
color: transparent !important;
|
||||
}
|
||||
|
||||
#orbit-bar a[accesskey] {
|
||||
color: #666666 !important;
|
||||
margin-left: 0;
|
||||
position: relative;
|
||||
&:hover {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,156 @@
|
|||
.response-content {
|
||||
position: relative;
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: $screen-md) {
|
||||
width: 970px;
|
||||
}
|
||||
|
||||
@media (min-width: $screen-lg) {
|
||||
width: 1100px;
|
||||
}
|
||||
}
|
||||
.response-content {
|
||||
position: static;
|
||||
}
|
||||
.response-content {
|
||||
position: static;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
|
||||
body[data-module="page_content"] {
|
||||
[data-content="true"] {
|
||||
h1 {
|
||||
font-size: $font-h1;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: $font-h2;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: $font-h3;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: $font-h4;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: $font-h5;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: $font-h6;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 2;
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
@import "variables";
|
||||
|
||||
html {
|
||||
font-size: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: $sub-font;
|
||||
font-size: inherit;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
a:link,
|
||||
a:visited {
|
||||
color: darken($theme-color-main, 10%);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus {
|
||||
color: darken($theme-color-main, 20%);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.admin-edit {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
// override bootsrap settings
|
||||
th,
|
||||
td {
|
||||
padding: 8px .5rem;
|
||||
}
|
||||
|
||||
.borderless > tbody > tr > td,
|
||||
.borderless > tbody > tr > th,
|
||||
.borderless > tfoot > tr > td,
|
||||
.borderless > tfoot > tr > th,
|
||||
.borderless > thead > tr > td,
|
||||
.borderless > thead > tr > th {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
a.btn-primary {
|
||||
color: $theme-white;
|
||||
border-color: $theme-color-main;
|
||||
background-color: $theme-color-main;
|
||||
font-size: 0.8125rem;
|
||||
|
||||
&:hover {
|
||||
background-color: darken($theme-color-main, 10%);
|
||||
border-color: darken($theme-color-main, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
// Page heading
|
||||
.page-module-title {
|
||||
@extend .unity-title;
|
||||
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.view-count {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.view_count {
|
||||
> i {
|
||||
font-size: 0.75rem;
|
||||
|
||||
&:before {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Take care of exceeding content
|
||||
body[data-module="page_content"],
|
||||
body[data-module="announcement"] {
|
||||
.layout-content {
|
||||
overflow-x: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
|
||||
.go-back-top {
|
||||
background: rgba($theme-color-main, 0.9);
|
||||
text-align: center;
|
||||
padding: 10px 12px;
|
||||
position: fixed;
|
||||
bottom: 15px;
|
||||
right: 15px;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
color: $theme-white;
|
||||
font-size: 12px;
|
||||
border-radius: 2px;
|
||||
z-index: 1;
|
||||
|
||||
&:hover {
|
||||
background: rgba($theme-color-main, 1);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
// Set Triangle
|
||||
@import "variables";
|
||||
|
||||
@mixin arrow($direction, $width, $height, $color) {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border-style: solid;
|
||||
|
||||
@if $direction == "top" {
|
||||
border-width: $width $height 0 $height;
|
||||
border-color: $color transparent transparent transparent;
|
||||
}
|
||||
|
||||
@else if $direction == "right" {
|
||||
border-width: $height $width $height 0;
|
||||
border-color: transparent $color transparent transparent;
|
||||
}
|
||||
|
||||
@else if $direction == "bottom" {
|
||||
border-width: 0 $height $width $height;
|
||||
border-color: transparent transparent $color transparent;
|
||||
}
|
||||
|
||||
@else if $direction == "left" {
|
||||
border-width: $height 0 $height $width;
|
||||
border-color: transparent transparent transparent $color;
|
||||
}
|
||||
|
||||
@else if $direction == "top-right" {
|
||||
border-width: 0 $width $height 0;
|
||||
border-color: transparent $color transparent transparent;
|
||||
}
|
||||
|
||||
@else if $direction == "top-left" {
|
||||
border-width: $height $width 0 0;
|
||||
border-color: $color transparent transparent transparent;
|
||||
}
|
||||
|
||||
@else if $direction == "bottom-right" {
|
||||
border-width: 0 0 $height $width;
|
||||
border-color: transparent transparent $color transparent;
|
||||
}
|
||||
|
||||
@else if $direction == "bottom-left" {
|
||||
border-width: $height 0 0 $width;
|
||||
border-color: transparent transparent transparent $color;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin list-reset {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
$theme-white: #fff;
|
||||
$orbit-bg-color:#9f2a2f;
|
||||
$orbit-bg-hover-color: $theme-color-main;
|
||||
$orbit-border-color: #444;
|
||||
|
||||
body {
|
||||
#orbit-bar .orbit-bar-inner > ul > li:hover > a,
|
||||
#orbit-bar .orbit-bar-inner > ul > li:hover > span,
|
||||
#orbit-bar .orbit-bar-inner > ul > li:hover > label,
|
||||
#orbit-bar .orbit-bar-inner > ul > li > ul li:hover,
|
||||
#orbit-bar .orbit-bar-inner > ul > li > ul li.active {
|
||||
background: $orbit-bg-hover-color;
|
||||
}
|
||||
|
||||
#orbit-bar .orbit-bar-inner {
|
||||
background: $orbit-bg-color;
|
||||
}
|
||||
|
||||
#orbit-bar .orbit-bar-search-sign-language #search input[type="search"] {
|
||||
margin-bottom: 0;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
#orbit-bar #search {
|
||||
border-right: none;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 550px) {
|
||||
body #orbit-bar .orbit-bar-search-sign-language #search input[type="search"] {
|
||||
width: 140px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 540px) {
|
||||
body {
|
||||
#orbit-bar ul.orbit-bar-search-sign-language > li + li:hover > a,
|
||||
#orbit-bar ul.orbit-bar-search-sign-language > li + li:hover > span {
|
||||
background-color: $orbit-bg-color;
|
||||
}
|
||||
|
||||
#orbit-bar .orbit-bar-inner > label {
|
||||
border-color: $theme-white;
|
||||
color: $theme-white;
|
||||
}
|
||||
|
||||
#orbit-bar .orbit-bar-inner > ul {
|
||||
background: $orbit-bg-color;
|
||||
}
|
||||
|
||||
#orbit-bar .orbit-bar-inner > ul > li > ul li:hover,
|
||||
#orbit-bar .orbit-bar-inner > ul > li > ul li.active {
|
||||
background: $orbit-bg-hover-color;
|
||||
}
|
||||
|
||||
#orbit-bar .orbit-bar-inner > ul > li > ul a {
|
||||
color: $theme-white;
|
||||
}
|
||||
|
||||
#orbit-bar .orbit-bar-inner > ul > li > ul li.divider {
|
||||
background: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#orbit-bar ul.orbit-bar-search-sign-language > li {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#orbit-bar ul.orbit-bar-search-sign-language > li {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#orbit-bar ul.orbit-bar-search-sign-language > li + li {
|
||||
border-top: 1px solid $orbit-border-color;
|
||||
border-right: 1px solid $orbit-border-color;
|
||||
box-sizing: border-box;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#orbit-bar ul.orbit-bar-search-sign-language > li + li:hover > ul {
|
||||
background-color: $orbit-bg-color;
|
||||
}
|
||||
|
||||
.orbit-bar-logo + ul > li {
|
||||
border-bottom: 1px solid $orbit-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
|
||||
.pagination {
|
||||
li {
|
||||
a {
|
||||
font-size: 0.8125rem;
|
||||
margin: 0 0.2em;
|
||||
color: $theme-color-main;
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
a {
|
||||
background-color: $theme-color-main;
|
||||
border-color: $theme-color-main;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
|
||||
body .sitemap-list {
|
||||
a {
|
||||
color: $theme-gray;
|
||||
|
||||
&:hover {
|
||||
color: lighten($theme-color-main, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
|
||||
// Title
|
||||
.unity-title {
|
||||
margin: 0 0 0.5em 0;
|
||||
line-height: 1.5;
|
||||
font-family: $main-font;
|
||||
font-size: $font-h1;
|
||||
|
||||
.layout-footer & {
|
||||
margin-bottom: 10px;
|
||||
border-bottom: none;
|
||||
|
||||
span {
|
||||
display: inline;
|
||||
margin-bottom: 0;
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.status {
|
||||
font-family: $main-font;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.status-top {
|
||||
background-color: $theme-color-second;
|
||||
}
|
||||
|
||||
.status-hot {
|
||||
background-color: $theme-color-third;
|
||||
}
|
||||
|
||||
.status-source {
|
||||
background-color: $theme-color-main;
|
||||
|
||||
a {
|
||||
color: $theme-white;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
|
||||
// 把可以重覆使用的類別放在這個檔案裡
|
||||
|
||||
// 只保留第一個editmode連結，後面的都藏起來以免使用者插入其他的內容造成版面跑版
|
||||
.single-child-datapp {
|
||||
> .editmode-ps + a[href^="/page_parts/"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.transfrom-180 {
|
||||
-webkit-transform: rotate(180deg);
|
||||
transform: rotate(180deg);
|
||||
-webkit-transition: .3s all ease;
|
||||
transition: .3s all ease;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.text-white {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.text-black {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.text-red {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: $theme-color-main;
|
||||
}
|
||||
|
||||
.box-social-share {
|
||||
margin: 15px 0;
|
||||
> * {
|
||||
display: inline-block;
|
||||
margin: 0 6px 0 0;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
top: 0;
|
||||
transition: 0.2s;
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
top: -3px;
|
||||
}
|
||||
}
|
||||
.fb-share-button.fb_iframe_widget {
|
||||
> span {
|
||||
vertical-align: top !important;
|
||||
}
|
||||
}
|
||||
.print-button {
|
||||
a {
|
||||
color: #333;
|
||||
font: 15px/20px $main-font;
|
||||
.fa {
|
||||
color: #666;
|
||||
font-size: 18px;
|
||||
margin: 0 3px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,136 @@
|
|||
@charset "utf-8";
|
||||
|
||||
// Base Color
|
||||
$theme-gray: #495054;
|
||||
$theme-gray-subtle: #ddd;
|
||||
$theme-gray-light: #cecece;
|
||||
$theme-gray-lighter: #f3f3f3;
|
||||
$theme-gray-dark: #363636;
|
||||
$theme-gray-darker: #242424;
|
||||
$theme-white: #fff;
|
||||
$theme-red: #d20001;
|
||||
$theme-blue: #003d7e;
|
||||
|
||||
$theme-color-main: #dab005;
|
||||
$theme-color-second: #a25a05;
|
||||
$theme-color-third: #403c3e;
|
||||
$theme-color-four:#d7c39c;
|
||||
|
||||
// Font stacks
|
||||
$main-font: "Roboto", "微軟正黑體", "Helvetica Neue", Helvetica, sans-serif;
|
||||
$sub-font: "Roboto", "新細明體", "Helvetica Neue", Helvetica, sans-serif;
|
||||
|
||||
// Font sizes
|
||||
$font-15: 0.9375rem;
|
||||
$font-13: 0.8125rem;
|
||||
|
||||
$font-h1: 1.5rem;
|
||||
$font-h2: 1.35rem;
|
||||
$font-h3: 1.2rem;
|
||||
$font-h4: 1.1rem;
|
||||
$font-h5: 1rem;
|
||||
$font-h6: 0.9rem;
|
||||
|
||||
//
|
||||
// Modules
|
||||
// --------------------------------------------------
|
||||
// ## commonly use in all widgets
|
||||
|
||||
// Font sizes
|
||||
$w-widget-title-font-size: 1.5rem;
|
||||
|
||||
// Colors
|
||||
$w-border-color: $theme-gray-lighter;
|
||||
|
||||
//
|
||||
// AD banner Module
|
||||
// --------------------------------------------------
|
||||
|
||||
// Font sizes
|
||||
$w-caption-font-size: 1.4rem;
|
||||
$w-caption-desc: 0.85rem;
|
||||
|
||||
//
|
||||
// Announcement Module
|
||||
// --------------------------------------------------
|
||||
|
||||
// Font sizes
|
||||
$w-title-font-size-small: 0.75rem;
|
||||
$w-subtitle-font-size: 0.75rem;
|
||||
$w-meta-font-size: 0.75rem;
|
||||
|
||||
$w-table-th-font-size: 0.75em;
|
||||
$w-table-td-font-size: 0.75em;
|
||||
|
||||
$i-title-font-size-large: 2em;
|
||||
|
||||
// colors
|
||||
|
||||
$link-color: $theme-color-main;
|
||||
$link-hover-color: lighten($theme-color-main, 10%);
|
||||
|
||||
$table-th-bgcolor: $theme-color-main;
|
||||
|
||||
//
|
||||
// Archive Module
|
||||
// --------------------------------------------------
|
||||
|
||||
// Font sizes
|
||||
$w-item-heading-font-size: 0.85rem;
|
||||
|
||||
//
|
||||
// Member Module
|
||||
// --------------------------------------------------
|
||||
|
||||
$border-width: 4px;@import "../../bootstrap/variables";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.response-content {
|
||||
justify-self: auto;
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
@import "bootstrap/mixins";
|
||||
@import "bootstrap/variables";
|
||||
@import "base/mixins";
|
||||
@import "base/variables";
|
||||
|
|
@ -0,0 +1,499 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.layout-content {
|
||||
position: relative;
|
||||
min-height: 600px;
|
||||
padding:2em 0 5em;
|
||||
background-color: #f5f5f5;
|
||||
.container {
|
||||
@extend .response-content;
|
||||
@media (min-width: $screen-md){}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.page-home{
|
||||
.layout-content{
|
||||
|
||||
padding: 0 0 2em 0;
|
||||
margin: 0;
|
||||
background:url(/assets/content_bg3.jpg);
|
||||
@media (min-width: $screen-md){
|
||||
padding: 0 0 5em 0;
|
||||
}
|
||||
.layout-slide.no-print.single-child-datapp{
|
||||
.w-ba-banner.ba-banner-widget-3{
|
||||
width: 100%;
|
||||
@media (min-width: 1040px){
|
||||
width: 1140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.row{
|
||||
@media (max-width: $screen-md){
|
||||
margin: 2em 0 0;
|
||||
}
|
||||
}
|
||||
.w-annc__widget-title{
|
||||
margin-bottom: 20px;
|
||||
font-size: 1rem;
|
||||
color: #fff;
|
||||
border-bottom: 1px solid #b4b4b4;
|
||||
span{
|
||||
background-color: #222;
|
||||
padding: 10px 15px;
|
||||
clear: both;
|
||||
display: table;
|
||||
border-radius: 5px 5px 0 0 ;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
.layout-content-boxL{
|
||||
.content-boxL1{
|
||||
.w-annc__widget-title{
|
||||
span{
|
||||
background-color: #e07e12;
|
||||
}
|
||||
}
|
||||
.widget-announcement-17 {
|
||||
position: relative;
|
||||
li.w-annc__item{
|
||||
/*background-color: #efe3e0;*/
|
||||
/*border-bottom: 1px solid #e6dad6;*/
|
||||
background-color: #f7ebd8;
|
||||
border-bottom: 1px solid #e8dfcd;
|
||||
&:hover{
|
||||
h4.w-annc__entry-title .w-annc__title{
|
||||
color: #d8760b;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 10px;
|
||||
line-height: 20px;
|
||||
.w-annc__more{
|
||||
color: #4f453b;font-size: 14px;
|
||||
&:hover{
|
||||
color:#991c22;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.L11{
|
||||
.widget-announcement-17{
|
||||
.w-annc__widget-title{
|
||||
span{
|
||||
background-color: #900c3b;
|
||||
}
|
||||
}
|
||||
li.w-annc__item{
|
||||
background-color: #f5d9d6;
|
||||
border-bottom: 1px solid #eac7c4;
|
||||
&:hover{
|
||||
h4.w-annc__entry-title .w-annc__title{
|
||||
color: #900c3b;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
a.w-annc__more:hover{
|
||||
color:#900c3b;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
width: 25%;
|
||||
float: left;
|
||||
padding: 0 40px 15px 0;
|
||||
margin-top: 2em;
|
||||
overflow:hidden;
|
||||
}
|
||||
}
|
||||
.content-boxL2{
|
||||
.w-annc__widget-title{
|
||||
span{
|
||||
background-color: #1ba252;
|
||||
}
|
||||
}
|
||||
.widget-announcement-17 {
|
||||
position: relative;
|
||||
li.w-annc__item{
|
||||
/*background-color: #e8f1e6;*/
|
||||
/*border-bottom: 1px solid #d9e4d6;*/
|
||||
background-color: #ddecdd;
|
||||
border-bottom: 1px solid #d1ded1;
|
||||
&:hover{
|
||||
h4.w-annc__entry-title .w-annc__title{
|
||||
color: #03923d;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 10px;
|
||||
line-height: 20px;
|
||||
.w-annc__more{
|
||||
color: #4f453b;font-size: 14px;
|
||||
&:hover{
|
||||
color:#991c22;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.L22{
|
||||
.widget-announcement-17{
|
||||
.w-annc__widget-title{
|
||||
span{
|
||||
background-color: #212763;
|
||||
}
|
||||
}
|
||||
li.w-annc__item{
|
||||
background-color: #d9e2f3;
|
||||
border-bottom: 1px solid #d1daec;
|
||||
&:hover{
|
||||
h4.w-annc__entry-title .w-annc__title{
|
||||
color: #212763;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
a.w-annc__more:hover{
|
||||
color:#212763;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
width: 50%;
|
||||
float: left;
|
||||
padding: 0 40px 15px 0;
|
||||
margin-top: 2em;
|
||||
overflow:hidden;
|
||||
}
|
||||
}
|
||||
.content-boxL3{
|
||||
.w-annc__widget-title{
|
||||
span{
|
||||
background-color: #007bc7;
|
||||
}
|
||||
}
|
||||
.widget-announcement-17 {
|
||||
position: relative;
|
||||
li.w-annc__item{
|
||||
/*background-color: #efe9de;*/
|
||||
/*border-bottom: 1px solid #e6e1d6;*/
|
||||
background-color: #d6ecec;
|
||||
border-bottom: 1px solid #c7dede;
|
||||
&:hover{
|
||||
h4.w-annc__entry-title .w-annc__title{
|
||||
color: #0b74b5;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 10px;
|
||||
line-height: 20px;
|
||||
.w-annc__more{
|
||||
color: #4f453b;font-size: 14px;
|
||||
&:hover{
|
||||
color:#991c22;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.L33{
|
||||
.widget-announcement-17{
|
||||
.w-annc__widget-title{
|
||||
span{
|
||||
background-color: #56277b;
|
||||
}
|
||||
}
|
||||
li.w-annc__item{
|
||||
background-color: #dcdaf1;
|
||||
border-bottom: 1px solid #cecce2;
|
||||
&:hover{
|
||||
h4.w-annc__entry-title .w-annc__title{
|
||||
color: #56277b;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
a.w-annc__more:hover{
|
||||
color:#56277b;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
float: left;
|
||||
width: 25%;
|
||||
padding: 0 40px 15px 0;
|
||||
margin-top: 2em;
|
||||
overflow:hidden;
|
||||
}
|
||||
}
|
||||
// Widget-17
|
||||
.widget-announcement-17 {
|
||||
li.w-annc__item{
|
||||
padding-bottom: 1em;
|
||||
margin-bottom: 1.7em;
|
||||
&:hover{
|
||||
/*box-shadow: 0 3px 5px rgba(0,0,0,0.3);*/
|
||||
.w-annc__img-wrap{
|
||||
img{
|
||||
opacity: 1;
|
||||
/*transform: scale(1.1)!important;*/
|
||||
transition:0.3s;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__meta{
|
||||
padding: 0 15px;
|
||||
i{
|
||||
color: #797979;
|
||||
padding-right: 0.1em;
|
||||
}
|
||||
.w-annc__postdate{
|
||||
color: #797979;
|
||||
}
|
||||
}
|
||||
h4.w-annc__entry-title{
|
||||
margin-top: 5px;
|
||||
margin-bottom: 0;
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1rem;
|
||||
color: #474747;
|
||||
padding: 0 15px;
|
||||
display: block;
|
||||
@media (min-width: $screen-md){
|
||||
height: 40px;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-annc__list > .w-annc__item:nth-child(3n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.w-annc__img-wrap {
|
||||
height: 142px;
|
||||
margin: 0 0 1em 0;
|
||||
background-color:#222;
|
||||
overflow: hidden;
|
||||
img{
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
a.btn-primary{
|
||||
color: #000;
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
&:hover{
|
||||
text-decoration:underline;
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
}
|
||||
.fa{
|
||||
padding-left: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content-boxB{
|
||||
position: relative;
|
||||
clear: both;
|
||||
.boxB-menu{
|
||||
ul {
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
border-bottom: 2px solid #5d5d5d;
|
||||
overflow: hidden;
|
||||
li {
|
||||
float: left;
|
||||
border-radius: 5px 5px 0 0;
|
||||
padding: 6px 10px;
|
||||
margin-left: 3px;
|
||||
font-size: $font-15;
|
||||
color: #fff;
|
||||
}
|
||||
li.h2-title1{
|
||||
background-color: #007bc7;
|
||||
}
|
||||
li.h2-title2{
|
||||
background-color: #1ba252;
|
||||
}
|
||||
li.h2-title3{
|
||||
background-color: #e07e12;
|
||||
}
|
||||
li.focusClass,li:hover{
|
||||
background-color: #991c22;
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
margin-right:40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
// Widget-18
|
||||
.widget-announcement-18 {
|
||||
|
||||
h3.w-annc__widget-title{
|
||||
display: none;
|
||||
}
|
||||
ul.w-annc__list{
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
.w-annc__item {
|
||||
margin: 0;
|
||||
padding: 9px 0;
|
||||
border-bottom: 1px solid #e3e3e3;
|
||||
&:nth-of-type(odd) {
|
||||
background-color:#fff;
|
||||
}
|
||||
&:hover{
|
||||
background-color: #f1f0f0;
|
||||
transition:0.2s;
|
||||
}
|
||||
}
|
||||
h4.w-annc__entry-title{
|
||||
margin: 0;
|
||||
a.w-annc__title{
|
||||
color: #474747;
|
||||
line-height: 1.3;
|
||||
&:hover{
|
||||
color:#a0050d;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.w-annc__category-wrap,
|
||||
.w-annc__status,
|
||||
.w-annc__title,
|
||||
.w-annc__postdate-wrap {
|
||||
font-size: 0.8125rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.w-annc__postdate-wrap{
|
||||
max-width: 82px;
|
||||
padding-right: 0;
|
||||
list-style: 20px;
|
||||
.w-annc__postdate {
|
||||
vertical-align: sub;
|
||||
}
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
}
|
||||
.w-annc__more-wrap.clearfix {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
line-height: 35px;
|
||||
right: 1%;
|
||||
|
||||
font-size: 14px;
|
||||
a.w-annc__more{
|
||||
color: #222;
|
||||
&:hover{
|
||||
color:#991c22;
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
margin-right: 40px;
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
margin-right:40px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@media (min-width: $screen-sm){
|
||||
padding: 0 15px;
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
float: left;
|
||||
width: 100%;
|
||||
padding-right: 1em;
|
||||
padding-left: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-content-boxR{
|
||||
|
||||
.layout-content-boxR2{
|
||||
& > div{
|
||||
background-color: #f7f7f7;
|
||||
margin-top:2em;
|
||||
@media (min-width: $screen-md){
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.ba-banner-widget-4{
|
||||
.w-ba-banner__wrap.image-only{
|
||||
padding: 20px 1em;
|
||||
a{
|
||||
float: left;
|
||||
width: 46%;
|
||||
border-radius: 13px;
|
||||
margin: 2%;
|
||||
&:hover{}
|
||||
img{
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (max-width: $screen-md)and(min-width: $screen-xs){
|
||||
width: 21%;
|
||||
}
|
||||
@media (min-width: 1999px){
|
||||
width: 46%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.w-ba-banner.ba-banner-widget-3{
|
||||
padding: 20px 1em;
|
||||
h3{
|
||||
margin-top: 0;
|
||||
font-size: 22px;
|
||||
border-bottom: 3px solid #79050b;
|
||||
color: #79050b;
|
||||
margin-bottom: 12px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
.banner-pager{
|
||||
right: 1.3em;
|
||||
bottom: 1.3em;
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-sm){
|
||||
padding: 0 15px;
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
float: right;
|
||||
width: 25%;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.layout-footer {
|
||||
padding: 20px 0;
|
||||
color: #fff;
|
||||
font-size: $font-13;
|
||||
line-height: 1.6;
|
||||
background-color: $theme-color-third;
|
||||
|
||||
.container {
|
||||
@extend .response-content;
|
||||
@media (min-width: $screen-md){
|
||||
position:relative;
|
||||
padding: 0 35px;
|
||||
&:after {
|
||||
width: 566px;
|
||||
height: 79px;
|
||||
position: absolute;
|
||||
top: -99px;
|
||||
content: "";
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: $screen-xs){
|
||||
table td{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: darken(#fff, 10%);
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,199 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.layout-header {
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
z-index: 100;
|
||||
.container {
|
||||
@extend .response-content;
|
||||
}
|
||||
|
||||
.header-nav {
|
||||
|
||||
color: #FFF;
|
||||
font-family: $main-font;
|
||||
.header-nav2 {
|
||||
padding: 0;
|
||||
padding: 9px 10px;
|
||||
border-top: 0;
|
||||
border-radius: 3px;
|
||||
background-color: #a25a05;
|
||||
}
|
||||
& > * {
|
||||
display: inline-block;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 0.8em;
|
||||
color: #fff;
|
||||
}
|
||||
ul{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
}
|
||||
li{
|
||||
display: inline-block;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
&:hover{
|
||||
text-decoration:underline;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
text-align: right;
|
||||
padding: 37px 70px 0px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-header {
|
||||
|
||||
|
||||
.navbar-toggle {
|
||||
padding: 18px 20px;
|
||||
border-radius: 2px;
|
||||
border-width: 2px;
|
||||
border-color: #fff;
|
||||
|
||||
.icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
&.collapsed {
|
||||
.icon-bar-top {
|
||||
top: 0;
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
|
||||
.icon-bar-middle {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.icon-bar-bottom {
|
||||
top: 0;
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
}
|
||||
|
||||
// icon bar animation
|
||||
.icon-bar {
|
||||
transition: .2s all;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.icon-bar-top {
|
||||
top: 6px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.icon-bar-middle {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.icon-bar-bottom {
|
||||
top: -6px;
|
||||
-webkit-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
@media (max-width: $screen-sm) {
|
||||
float:none;
|
||||
width:100%;
|
||||
border:0;
|
||||
background:$theme-color-second;
|
||||
margin:5px 0 0 0;
|
||||
border-radius:0;
|
||||
.icob-box{
|
||||
float: right;
|
||||
line-height: 1;
|
||||
color: #fff;
|
||||
padding-left: 8px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
height: 59px;
|
||||
margin: 8px 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
line-height: 34px;
|
||||
color: #FFF;
|
||||
font-size: 1.4em;
|
||||
font-family: $main-font;
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
height: 79px;
|
||||
margin: 12px 0 ;
|
||||
padding-left: 0;
|
||||
line-height: 60px;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.site-logo {
|
||||
width: auto;
|
||||
height: 100%;
|
||||
margin-right: 0.5em;
|
||||
float: left;
|
||||
}
|
||||
.site_name{
|
||||
display: none;
|
||||
}
|
||||
@media (max-width: $screen-sm) {
|
||||
float:none;
|
||||
display:block;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (max-width: $screen-lg)and(min-width: $screen-sm){
|
||||
.container{
|
||||
width: 100%;
|
||||
}
|
||||
#layout-navigation{
|
||||
margin: 0 -15px;
|
||||
}
|
||||
.navbar-brand{
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-sm){
|
||||
.header-nav {
|
||||
float: right;
|
||||
width: 40%;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.navbar-header {
|
||||
float: left;
|
||||
width: 60%;
|
||||
}
|
||||
&:after{
|
||||
content: "";
|
||||
display: table;
|
||||
width: 621px;
|
||||
height: 103px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
min-height:145px;
|
||||
.container{}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.layout-slide {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
background: #000;
|
||||
|
||||
.w-ba-banner {
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,127 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
//
|
||||
// Widget
|
||||
//
|
||||
|
||||
// Widget
|
||||
// ## gerenral styles
|
||||
.w-ba-banner {
|
||||
position: relative;
|
||||
|
||||
.cursor {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.w-ba-banner__wrap {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.w-ba-banner__slide {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.banner-pager {
|
||||
@include list-reset;
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
top: 1em;
|
||||
z-index: 200;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
a {
|
||||
background: $theme-color-main;
|
||||
display: inline-block;
|
||||
margin-right: 0.25em;
|
||||
width: 0.8em;
|
||||
height: 0.8em;
|
||||
border-radius: 50%;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.active-slide a {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.banner-responsive {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// Widget 1
|
||||
.ba-banner-widget-1 {
|
||||
.w-ba-banner__caption {
|
||||
background: $theme-color-main;
|
||||
color: $theme-white;
|
||||
z-index: 200;
|
||||
padding: 0.5em 1em;
|
||||
|
||||
h2 {
|
||||
font-family: $main-font;
|
||||
font-size: $w-caption-font-size;
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: $main-font;
|
||||
font-size: $w-caption-desc;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Widget 2
|
||||
.ba-banner-widget-2 {
|
||||
.w-ba-banner__image {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.youtube, .cycle-youtube {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
object, embed {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.banner-pager {
|
||||
right: 1em;
|
||||
bottom: 1em;
|
||||
z-index: 102;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget 3
|
||||
.ba-banner-widget-3 {
|
||||
.w-ba-banner__wrap {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.w-ba-banner__slide {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.banner-pager {
|
||||
top: auto;
|
||||
right: 1em;
|
||||
bottom: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
// specific style for youtube widget
|
||||
.ba-banner-widget-youtube {
|
||||
.cycle-slide-active {
|
||||
z-index: 101 !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,210 @@
|
|||
.annc-box{
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
// height: 500px;
|
||||
}
|
||||
.pages{
|
||||
|
||||
// transition:opacity.5s;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
position:absolute;
|
||||
left: 100%;
|
||||
top:0;
|
||||
text-align: center;
|
||||
a{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.w-annc__item{
|
||||
float: none;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
padding: 0 1px;
|
||||
.mask{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transition:.3s;
|
||||
}
|
||||
.w-annc__postdate-wrap{
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: rgba(0,0,0,.5);
|
||||
color: #fff;
|
||||
padding: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.w-annc__subtitle{
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
font-family: '微軟正黑體','sans-serif';
|
||||
line-height: 1.7em;
|
||||
}
|
||||
.w-annc__title{
|
||||
color:#7d7133;
|
||||
&:hover{
|
||||
color: $theme-color-main;
|
||||
}
|
||||
}
|
||||
}
|
||||
.data{
|
||||
background: #fff;
|
||||
&:hover .mask{
|
||||
background: rgba(0,0,0,.3);
|
||||
}
|
||||
}
|
||||
.w-annc__content-wrap{
|
||||
padding: 15px;
|
||||
}
|
||||
img{
|
||||
transform:scale(1,1) !important;
|
||||
transition:transform 0s 2s ;
|
||||
}
|
||||
|
||||
&.active{
|
||||
left:0;
|
||||
opacity: 1;
|
||||
}
|
||||
&.active img,&.ltr_in img,&.rtl_in img{
|
||||
transition: transform 20s;
|
||||
transform-origin:center center 0px;
|
||||
transition-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1);
|
||||
transform:scale(1.3) !important;
|
||||
}
|
||||
// &.ltr_in {
|
||||
// left: 0;
|
||||
// -webkit-animation: left-in 1s ;
|
||||
// -moz-animation: left-in 1s ;
|
||||
// -ms-animation: left-in 1s ;
|
||||
// -o-animation: left-in 1s ;
|
||||
// animation: left-in 1s ;
|
||||
// animation-fill-mode:forwards;
|
||||
// }
|
||||
// &.ltr_out {
|
||||
|
||||
// -webkit-animation: left-out 1s ;
|
||||
// -moz-animation: left-out 1s ;
|
||||
// -ms-animation: left-out 1s ;
|
||||
// -o-animation: left-out 1s ;
|
||||
// animation: left-out 1s ;
|
||||
// animation-fill-mode:forwards;
|
||||
// }
|
||||
// &.rtl_in {
|
||||
|
||||
// left: 0;
|
||||
// -webkit-animation: right-in 1s ;
|
||||
// -moz-animation: right-in 1s ;
|
||||
// -ms-animation: right-in 1s ;
|
||||
// -o-animation: right-in 1s ;
|
||||
// animation: right-in 1s ;
|
||||
// animation-fill-mode:forwards;
|
||||
// }
|
||||
// &.rtl_out {
|
||||
|
||||
// -webkit-animation: right-out 1s ;
|
||||
// -moz-animation: right-out 1s ;
|
||||
// -ms-animation: right-out 1s ;
|
||||
// -o-animation: right-out 1s ;
|
||||
// animation: right-out 1s ;
|
||||
// animation-fill-mode:forwards;
|
||||
// }
|
||||
}
|
||||
@-webkit-keyframes left-in {
|
||||
/*0%{left: -900px;}*/
|
||||
0% {
|
||||
|
||||
left: -100%;
|
||||
}
|
||||
100% {
|
||||
transform:scale(1,1);
|
||||
opacity: 1;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes right-in {
|
||||
/*0%{left: 900px;}*/
|
||||
0% {
|
||||
|
||||
left: 100%;
|
||||
}
|
||||
100% {
|
||||
transform:scale(1,1);
|
||||
opacity: 1;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes left-out {
|
||||
0% {
|
||||
|
||||
left: 0;
|
||||
}
|
||||
/*100%{left: 900px;}*/
|
||||
100% {
|
||||
opacity: 1;
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes right-out {
|
||||
0% {
|
||||
|
||||
left: 0;
|
||||
}
|
||||
/*100%{left: -900px;}*/
|
||||
100% {
|
||||
opacity: 1;
|
||||
left: -100%;
|
||||
}
|
||||
}
|
||||
@keyframes left-in {
|
||||
/*0%{left: -900px;}*/
|
||||
0% {
|
||||
|
||||
left: -100%;
|
||||
}
|
||||
100% {
|
||||
transform:scale(1,1);
|
||||
opacity: 1;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
@keyframes right-in {
|
||||
/*0%{left: 900px;}*/
|
||||
0% {
|
||||
|
||||
left: 100%;
|
||||
}
|
||||
100% {
|
||||
transform:scale(1,1);
|
||||
opacity: 1;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
@keyframes left-out {
|
||||
0% {
|
||||
|
||||
left: 0;
|
||||
}
|
||||
/*100%{left: 900px;}*/
|
||||
100% {
|
||||
opacity: 1;
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
@keyframes right-out {
|
||||
0% {
|
||||
|
||||
left: 0;
|
||||
}
|
||||
/*100%{left: -900px;}*/
|
||||
100% {
|
||||
|
||||
opacity: 1;
|
||||
left: -100%;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,793 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
//
|
||||
// Widget
|
||||
//
|
||||
|
||||
// Announcement widget
|
||||
// ## Gerneral styles for widgets
|
||||
.w-annc {
|
||||
.w-annc__widget-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.w-annc__list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.w-annc__item {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 0.75rem;
|
||||
font-weight: normal;
|
||||
padding: .2em .6em;
|
||||
}
|
||||
|
||||
.w-annc__meta {
|
||||
.w-annc__status-wrap,
|
||||
.w-annc__postdate-wrap,
|
||||
.w-annc__category-wrap {
|
||||
display: inline-block;
|
||||
margin-right: 0.2em;
|
||||
font-size: 0.8125em;
|
||||
color: $theme-gray;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
i {
|
||||
color: $theme-gray;
|
||||
}
|
||||
}
|
||||
|
||||
.w-annc__subtitle {
|
||||
font-size: 0.8125em;
|
||||
line-height: 22px;
|
||||
color: $theme-gray;
|
||||
}
|
||||
|
||||
.w-annc__entry-title {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $sub-font;
|
||||
color: $theme-color-main;
|
||||
text-decoration: none;
|
||||
font-size: 0.8125rem;
|
||||
|
||||
&:hover {
|
||||
color: darken($theme-color-main, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-1
|
||||
.widget-announcement-1 {
|
||||
.w-annc__img-wrap {
|
||||
height: 200px;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-2
|
||||
.widget-announcement-2 {
|
||||
.w-annc__img-wrap {
|
||||
height: 200px;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-3
|
||||
.widget-announcement-3 {
|
||||
.w-annc__img-wrap {
|
||||
height: 200px;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-4
|
||||
.widget-announcement-4 {
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.w-annc__list > .w-annc__item:nth-child(3n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.w-annc__img-wrap {
|
||||
height: 200px;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-5
|
||||
.widget-announcement-5 {
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.w-annc__item {
|
||||
border-bottom: 1px solid #cccccc;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 0;
|
||||
p{
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-6
|
||||
.widget-announcement-6 {
|
||||
.w-annc__item {
|
||||
margin-bottom: 0.8em;
|
||||
padding-bottom: 0.8em;
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
}
|
||||
|
||||
.w-annc__entry-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.w-annc__category-wrap,
|
||||
.w-annc__status,
|
||||
.w-annc__title,
|
||||
.w-annc__postdate-wrap {
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-7
|
||||
.widget-announcement-7 {
|
||||
.w-annc__item {
|
||||
margin-bottom: 0.8em;
|
||||
padding-bottom: 0.8em;
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
}
|
||||
|
||||
.w-annc__entry-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.w-annc__category-wrap,
|
||||
.w-annc__status,
|
||||
.w-annc__title,
|
||||
.w-annc__postdate-wrap {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
// ## Gerneral styles for table widgets
|
||||
|
||||
.w-annc__postdate,
|
||||
.w-annc__category {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// Widget-8
|
||||
// ## Table
|
||||
.widget-announcement-8 {
|
||||
.w-annc__th {
|
||||
color: #fff;
|
||||
background: $theme-color-main;
|
||||
font-size: 0.8125em;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-9
|
||||
// ## Table
|
||||
.widget-announcement-9 {
|
||||
.w-annc__th {
|
||||
color: #fff;
|
||||
background: $theme-color-main;
|
||||
font-size: 0.8125em;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-10
|
||||
.widget-announcement-10 {
|
||||
.w-annc__item {
|
||||
margin-bottom: 0.8em;
|
||||
padding-bottom: 0.8em;
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
}
|
||||
|
||||
.w-annc__entry-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.w-annc__postdate-wrap {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-11
|
||||
.widget-announcement-11 {
|
||||
.w-annc__item {
|
||||
margin-bottom: 0.8em;
|
||||
padding-bottom: 0.8em;
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
}
|
||||
|
||||
.w-annc__entry-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.w-annc__postdate-wrap {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-12
|
||||
// ## Table
|
||||
.widget-announcement-12 {
|
||||
.w-annc__th {
|
||||
color: #fff;
|
||||
background: $theme-color-main;
|
||||
font-size: 0.8125em;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-13
|
||||
// ## Table
|
||||
.widget-announcement-13 {
|
||||
.w-annc__th {
|
||||
color: #fff;
|
||||
background: $theme-color-main;
|
||||
font-size: 0.8125em;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-14
|
||||
.widget-announcement-14 {
|
||||
.w-annc__list {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.w-annc__img-wrap {
|
||||
height: 300px;
|
||||
margin-bottom: 15px;
|
||||
|
||||
@media (min-width: $screen-md) {
|
||||
height: 200px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.w-annc__item {
|
||||
margin-bottom: 0.8em;
|
||||
padding-bottom: 0.8em;
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
}
|
||||
|
||||
.w-annc__entry-title {
|
||||
margin: 0 0 10px 0;
|
||||
|
||||
@media (min-width: $screen-md) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.w-annc__postdate-wrap {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
.w-annc__status {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.w-annc__postdate {
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-15
|
||||
.widget-announcement-15 {
|
||||
.w-annc__img-wrap {
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
|
||||
img.w-annc__img{
|
||||
border: 5px solid #ddd;
|
||||
border-radius: 50%;
|
||||
@media (max-width: $screen-xs){
|
||||
max-width: 290px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.w-annc__item{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
p.w-annc__subtitle{
|
||||
font-size: $font-15;
|
||||
line-height: 1.6;
|
||||
font-family: $main-font;
|
||||
|
||||
}
|
||||
.w-annc__more-wrap{
|
||||
a.btn-primary{
|
||||
color: #000;
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
&:hover{
|
||||
text-decoration:underline;
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
}
|
||||
.fa{
|
||||
padding-left: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Widget-16
|
||||
.widget-announcement-16 {
|
||||
|
||||
.w-annc__item{
|
||||
margin-bottom: 0;
|
||||
padding-bottom: 20px;
|
||||
p {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.w-annc__img-wrap {
|
||||
|
||||
}
|
||||
h4.w-annc__entry-title{
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
.w-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 20px;
|
||||
color: #453839;
|
||||
}
|
||||
|
||||
}
|
||||
.w-annc__meta{ /*date*/
|
||||
text-align: center;
|
||||
.w-annc__postdate-wrap{
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
padding: 10px 13px;
|
||||
background-color: #cca129;
|
||||
margin-right: 0;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// Announcement index
|
||||
// ## General style for index pages
|
||||
.i-annc {
|
||||
.i-annc__page-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.i-annc__list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.i-annc__widget-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.i-annc__item {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.i-annc__img {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.i-annc__th {
|
||||
color: $theme-white;
|
||||
background: $theme-color-main;
|
||||
font-size: 0.8125em;
|
||||
border: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.i-annc__postdate,
|
||||
.i-annc__category,
|
||||
.i-annc__view-count {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.i-annc__status-wrap {
|
||||
span {
|
||||
display: inline-block;
|
||||
padding: .2em .6em .3em;
|
||||
|
||||
&:last-child {
|
||||
margin: 0 5px 3px 0;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
.i-annc__title:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 0.75rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.i-annc__meta {
|
||||
.i-annc__status-wrap,
|
||||
.i-annc__postdate-wrap,
|
||||
.i-annc__category-wrap {
|
||||
display: inline-block;
|
||||
margin-right: 0.2em;
|
||||
font-size: 0.8125em;
|
||||
color: $theme-gray;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
i {
|
||||
color: $theme-gray;
|
||||
}
|
||||
}
|
||||
|
||||
.i-annc__subtitle {
|
||||
font-size: 0.8125em;
|
||||
color: $theme-gray;
|
||||
}
|
||||
|
||||
.i-annc__entry-title {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.i-annc__title {
|
||||
font-family: $sub-font;
|
||||
color: #474747;
|
||||
text-decoration: none;
|
||||
font-size: 0.8125rem;
|
||||
|
||||
&:hover {
|
||||
color: darken($theme-color-main, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Index-1
|
||||
.index-announcement-1 {}
|
||||
|
||||
// Index-5
|
||||
// Index-6
|
||||
.index-announcement-5,
|
||||
.index-announcement-6 {
|
||||
.i-annc__img-wrap {
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
|
||||
.i-annc__title {
|
||||
font-family: $main-font;
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
}
|
||||
|
||||
// Index-7
|
||||
.index-announcement-7 {
|
||||
.i-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.i-annc__list > .i-annc__item:nth-child(3n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.i-annc__img-wrap {
|
||||
height: 200px;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Index-8
|
||||
.index-announcement-8 {
|
||||
.i-annc__title {
|
||||
font-family: $main-font;
|
||||
line-height: 1.3;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.i-annc__item {
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
padding-bottom: 1em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
// Index-9
|
||||
// Index-10
|
||||
.index-announcement-9,
|
||||
.index-announcement-10 {
|
||||
.i-annc__item {
|
||||
margin-bottom: 0.8em;
|
||||
padding-bottom: 0.8em;
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
}
|
||||
|
||||
.i-annc__entry-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.i-annc__category-wrap,
|
||||
.i-annc__status,
|
||||
.i-annc__title,
|
||||
.i-annc__postdate-wrap {
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
.i-annc__status {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
// Index-11
|
||||
// Index-12
|
||||
.index-announcement-11,
|
||||
.index-announcement-12 {
|
||||
.i-annc__item {
|
||||
margin-bottom: 0.8em;
|
||||
padding-bottom: 0.8em;
|
||||
border-bottom: 1px dashed lighten($theme-gray, 65%);
|
||||
}
|
||||
|
||||
.i-annc__entry-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.i-annc__postdate-wrap {
|
||||
font-size: 0.8125em;
|
||||
}
|
||||
|
||||
.i-annc__status {
|
||||
display: inline-block;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Index-16
|
||||
.index-announcement-16 {
|
||||
td ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Announcement show
|
||||
.s-annc {
|
||||
.s-annc__show-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.s-annc__meta-wrap {
|
||||
border-bottom: 1px solid $theme-gray-light;
|
||||
|
||||
@include clearfix;
|
||||
|
||||
.s-annc__meta--item {
|
||||
font-size: 0.875rem;
|
||||
margin-right: 1em;
|
||||
margin-bottom: 0.6em;
|
||||
float: left;
|
||||
|
||||
i {
|
||||
color: darken($theme-gray-light, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.s-annc__tag-wrap {
|
||||
position: relative;
|
||||
margin-right: 0;
|
||||
padding-left: 1.6em;
|
||||
clear: both;
|
||||
float: none;
|
||||
|
||||
i {
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.s-annc__tag-wrap {
|
||||
.s-annc__tag {
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.s-annc__post-wrap {
|
||||
@include clearfix;
|
||||
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.s-annc__related-wrap {
|
||||
padding-top: 1em;
|
||||
border-top: 1px dotted $theme-gray-light;
|
||||
}
|
||||
|
||||
.s-annc__related-file {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.s-annc__related-file,
|
||||
.s-annc__related-link {
|
||||
padding-bottom: 6px;
|
||||
padding-left: 1.6em;
|
||||
|
||||
i {
|
||||
margin: 8px 0 0 -1.6em;
|
||||
float: left;
|
||||
color: darken($theme-gray-light, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.s-annc__related-link-list,
|
||||
.s-annc__related-file-list {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.s-annc__flie-title {
|
||||
max-width: 9.375rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.s-annc__social > * {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.s-annc__social .print-button {
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
border-radius: 4px;
|
||||
padding: 2px 6px;
|
||||
background-color: $theme-color-main;
|
||||
}
|
||||
|
||||
.s-annc__social .print-button:hover {
|
||||
background-color: lighten($theme-color-main, 10%);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,219 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
//
|
||||
// Widget
|
||||
//
|
||||
// Widget
|
||||
// ## gerenral styles
|
||||
.w-archive {
|
||||
.w-archive__widget-title {
|
||||
font-family: $main-font;
|
||||
font-size: $w-widget-title-font-size;
|
||||
color: $theme-gray;
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Widget 1
|
||||
.widget-archive-1 {
|
||||
.w-archive__list.level-1 {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.w-archive__item.level-1 {
|
||||
list-style-position: inside;
|
||||
margin-bottom: 0.8rem;
|
||||
}
|
||||
|
||||
.w-archive__item-heading {
|
||||
display: inline-block;
|
||||
font-size: $w-item-heading-font-size;
|
||||
font-family: $main-font;
|
||||
color: $theme-gray;
|
||||
margin: 0;
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.w-archive__list.level-2 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.w-archive__item.level-2 {
|
||||
border-bottom: 1px dashed $w-border-color;
|
||||
padding: 0 0 0.5rem 0.4rem;
|
||||
}
|
||||
|
||||
.w-archive__link {
|
||||
font-size: $w-title-font-size-small;
|
||||
}
|
||||
}
|
||||
|
||||
// Archive index 1
|
||||
.index-archive-1 {
|
||||
font-family: $main-font;
|
||||
|
||||
.i-archive__archive-title {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 10px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.i-archive__status-wrap {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.i-archive__item {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.i-archive__category-list {}
|
||||
|
||||
.i-archive__category-title {
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.i-archive__category-item {
|
||||
font-size: 13px;
|
||||
display: inline;
|
||||
font-size: .8125rem;
|
||||
}
|
||||
|
||||
.i-archive__item-wrap {}
|
||||
|
||||
.i-archive__file-list {
|
||||
display: block;
|
||||
margin-bottom: 0.8em;
|
||||
}
|
||||
|
||||
.i-archive__file-wrap {
|
||||
margin: 0 0.625rem 15px 0;
|
||||
padding: 8px 12px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid lighten($theme-gray-light, 10%);
|
||||
}
|
||||
|
||||
.i-archive__file-name {
|
||||
font-size: 12px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
.index-archive-2,
|
||||
.index-archive-4 {
|
||||
.panel {
|
||||
font-family: $main-font;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
font-family: $main-font;
|
||||
}
|
||||
|
||||
.i-archive-tags {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.i-archive-files-item {
|
||||
font-size: 13px;
|
||||
font-family: $main-font;
|
||||
}
|
||||
|
||||
.i-archive-files-list {
|
||||
dd {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.i-archive-tag-name {
|
||||
margin-bottom: 8px;
|
||||
font-size: 0.9375rem;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media screen and (min-width: $screen-sm) {
|
||||
.dl-horizontal {
|
||||
dt {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.has-archive-tab {
|
||||
.i-tag__item {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tab-content--active {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.i-archive__tag-name {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.index-archive-3 {
|
||||
.i-archive__tag-name {
|
||||
background-color: $theme-color-main;
|
||||
color: $theme-white;
|
||||
font-family: $main-font;
|
||||
display: inline-block;
|
||||
padding: 10px 12px;
|
||||
margin-right: 5px;
|
||||
border-radius: 4px;
|
||||
font-size: 15px;
|
||||
|
||||
&:hover {
|
||||
background-color: darken($theme-color-main, 7%);
|
||||
}
|
||||
|
||||
&.tab--active {
|
||||
background-color: darken($theme-color-main, 7%);
|
||||
}
|
||||
}
|
||||
.list-unstyled{
|
||||
margin-top: 20px;
|
||||
}
|
||||
.tab-content {
|
||||
background-color: lighten($theme-gray, 65%);
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.i-archive__category-item {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.i-archive__category-title {
|
||||
font-family: $main-font;
|
||||
}
|
||||
|
||||
.i-archive__archive-title {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.i-archive__file-name {
|
||||
font-size: $font-15;
|
||||
color: #333;
|
||||
&:hover{
|
||||
color:darken($theme-color-main, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
.i-archive__file-wrap {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.i-archive__item-wrap {
|
||||
font-family: $main-font;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.w-calendar {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
.widget-title {
|
||||
text-align: center;
|
||||
border: 1px solid $theme-gray-subtle;
|
||||
margin: 0;
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
th {
|
||||
background: $theme-color-main;
|
||||
color: $theme-white;
|
||||
text-align: center;
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
td {
|
||||
border: 1px solid $theme-gray-subtle;
|
||||
text-align: center;
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
}
|
||||
|
||||
.w-calendar-table {
|
||||
margin-bottom: 0;
|
||||
|
||||
.w-calendar-today {
|
||||
background: $theme-color-main;
|
||||
color: $theme-white;
|
||||
}
|
||||
|
||||
.w-calendar-event {
|
||||
background: $theme-color-third;
|
||||
color: $theme-white;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.w-calendar-nav {
|
||||
a {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 10px;
|
||||
color: $theme-color-main;
|
||||
}
|
||||
|
||||
.w-calendar-nav-next {
|
||||
left: auto;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
// Faqs MODULES
|
||||
.widget-faqs {
|
||||
&.widget1 {
|
||||
.widget-content {
|
||||
padding-bottom: 10px;
|
||||
|
||||
& + .widget-content {
|
||||
border-top: 1px dotted $theme-gray-light;
|
||||
}
|
||||
|
||||
.widget-content-title {
|
||||
display: inline-block;
|
||||
padding: 5px 0;
|
||||
}
|
||||
}
|
||||
|
||||
// 在 layout-content 下的樣式
|
||||
.layout-content & {
|
||||
.widget-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
}
|
||||
|
||||
// 在 layout-footer 下的樣式
|
||||
.layout-footer & {
|
||||
.widget-content {
|
||||
line-height: 2em;
|
||||
border-top-color: $theme-gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Faqs INDEX
|
||||
.index-faqs {
|
||||
.index-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
&.index1 {
|
||||
.index-content {
|
||||
list-style-type: decimal-leading-zero;
|
||||
list-style-position: inside;
|
||||
|
||||
& + .index-content {
|
||||
border-top: 1px dotted $theme-gray-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,145 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
// Gallery MODULES
|
||||
.widget-gallery {
|
||||
.widget-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.widget-content {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&.widget1 {
|
||||
.widget-content {
|
||||
overflow: hidden;
|
||||
|
||||
.widget-pic {
|
||||
display: inline-block;
|
||||
padding: 1px;
|
||||
text-align: center;
|
||||
|
||||
@include size(33.3333%, auto);
|
||||
|
||||
img {
|
||||
@include size(100%, 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.widget2 {
|
||||
.widget-content {
|
||||
margin-left: -5px;
|
||||
margin-right: -5px;
|
||||
|
||||
.widget-pic {
|
||||
margin-bottom: 10px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
|
||||
img {
|
||||
@include size(100%, auto);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.index-gallery {
|
||||
.index-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
&.index1 {
|
||||
.index-content {
|
||||
&:nth-child(4n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.index-part {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.index-content-inner {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.index-content-title {
|
||||
font-family: $main-font;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.index-img-description {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.index2 {
|
||||
.index-content {
|
||||
padding: 25px 15px;
|
||||
background: lighten($theme-gray, 60%);
|
||||
margin-bottom: 20px;
|
||||
border-radius: 2px;
|
||||
|
||||
@media screen and (max-width: $screen-sm) {
|
||||
margin-right: 20px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.index-content-inner {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.index-img {
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.index-content-title {
|
||||
font-family: $main-font;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.index-img-description {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.show-gallery {
|
||||
.show-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.show-content {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
|
||||
&:nth-child(6n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.img {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.show-content-inner {
|
||||
position: relative;
|
||||
padding: 5px;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.show-description {
|
||||
font-family: $main-font;
|
||||
font-size: 13px;
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,209 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
//
|
||||
// Index
|
||||
//
|
||||
// Member Index
|
||||
// ## Gerneral styles for Index
|
||||
|
||||
// Index 1
|
||||
.index-member-1 {
|
||||
.i-member-tr-head {
|
||||
&:nth-child(1n+2) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
th {
|
||||
background: $theme-color-main;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Index 2
|
||||
.index-member-2 {
|
||||
.i-member-section {
|
||||
max-width: 500px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.i-member-status-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.i-member-item-inner {
|
||||
background: none;
|
||||
border-radius: 0.25rem;
|
||||
padding: 24px 1rem;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.i-member-pic-wrap {
|
||||
height: auto;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.i-member-pic {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.i-member-profile-list {
|
||||
@include list-reset;
|
||||
}
|
||||
|
||||
.i-member-profile-item {
|
||||
margin-bottom: 8px;
|
||||
font-size: $font-13;
|
||||
}
|
||||
|
||||
// RWD
|
||||
@media screen and (min-width: $screen-sm) {
|
||||
.i-member-section {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.i-member-item-inner {
|
||||
background: $theme-gray-lighter;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Index 3
|
||||
.index-member-3 {
|
||||
.i-member-section {
|
||||
max-width: 500px;
|
||||
margin: auto;
|
||||
}
|
||||
.i-member-list {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
margin: 0;
|
||||
}
|
||||
.i-member-item {
|
||||
background: #f1f1f1 none repeat scroll 0 0;
|
||||
border-radius: 5px;
|
||||
float: none;
|
||||
margin: 0 1% 30px;
|
||||
padding: 20px;
|
||||
width: 48%;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
|
||||
.i-member-pic {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.i-member-profile-list {
|
||||
@include list-reset;
|
||||
}
|
||||
|
||||
.i-member-profile-item {
|
||||
margin-bottom: 8px;
|
||||
font-size: $font-13;
|
||||
}
|
||||
|
||||
.i-member-item:nth-child(odd) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.i-member-item-inner {}
|
||||
|
||||
.i-member-pic-wrap {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// RWD
|
||||
@media screen and (min-width: $screen-sm) {
|
||||
.i-member-section {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.i-member-item-inner {
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: $screen-md) {
|
||||
.i-member-pic-wrap {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Index 4
|
||||
.index-member-4 {
|
||||
.i-member-section {
|
||||
max-width: 500px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.i-member-status-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
.i-member-item-inner {
|
||||
background: none;
|
||||
border-radius: 0.25rem;
|
||||
padding: 12px 1rem;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.i-member-profile-list {
|
||||
@include list-reset;
|
||||
}
|
||||
|
||||
.i-member-profile-item {
|
||||
margin-bottom: 8px;
|
||||
font-size: $font-13;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.i-member-item:nth-child(6n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
// RWD
|
||||
@media screen and (min-width: $screen-sm) {
|
||||
.i-member-section {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.i-member-item-inner {
|
||||
background: $theme-gray-lighter;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Show page
|
||||
.show-member {
|
||||
font-family: $sub-font;
|
||||
|
||||
th, td {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.member-plugins {
|
||||
margin: 20px 0;
|
||||
|
||||
a {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,338 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.modules-menu {
|
||||
font-family: $sub-font;
|
||||
max-height: none;
|
||||
clear: both;
|
||||
background-color: #a25a05;
|
||||
li {
|
||||
white-space: nowrap;
|
||||
|
||||
& > a,
|
||||
& > .fa {
|
||||
color: $theme-white;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
& > a,
|
||||
& > .fa {
|
||||
color: $theme-white;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modules-menu-level-0 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
.has-dropdown.level-1.active {
|
||||
.modules-menu-level-1 {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.has-dropdown.level-2.active {
|
||||
.modules-menu-level-2 {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-toggle-icon {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 5px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
cursor: pointer;
|
||||
line-height: 40px;
|
||||
font-size: 1em;
|
||||
text-align: center;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.dropdown-toggle-icon.level-1 {
|
||||
background-color: $theme-color-second;
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.dropdown-toggle-icon.level-2 {
|
||||
background-color: $theme-color-second;
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
& > li {
|
||||
position: relative;
|
||||
margin: 0 -15px;
|
||||
padding: 0 15px;
|
||||
border-bottom: 1px solid #790e13;
|
||||
|
||||
& > a {
|
||||
display: block;
|
||||
padding: 18px 0;
|
||||
font-family: $main-font;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: darken( $theme-color-second , 20%);
|
||||
|
||||
& > a {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
/*.modules-menu-level-0 li*/
|
||||
position: relative;
|
||||
margin: 0 ;
|
||||
padding: 0 10px;
|
||||
border-bottom: none;
|
||||
transition:.3s;
|
||||
&:hover{
|
||||
background-color:#222;
|
||||
}
|
||||
&:hover > .modules-menu-level-2{
|
||||
display: block;
|
||||
}
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
|
||||
.modules-menu-level-1 {
|
||||
|
||||
|
||||
&:before {
|
||||
right: 10px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
& > li {
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
|
||||
& > a {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.modules-menu-level-2 {
|
||||
right: 100%;
|
||||
left: auto;
|
||||
|
||||
&:before {
|
||||
right: -6px;
|
||||
left: auto;
|
||||
|
||||
@include arrow("left", 6px, 6px, $theme-gray-darker);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
& > a {
|
||||
padding: 11px 0;
|
||||
font-size: $font-15;
|
||||
}
|
||||
|
||||
& > .fa {
|
||||
position: static;
|
||||
|
||||
@include size(auto, auto);
|
||||
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
font-size: 1em;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
& > a {
|
||||
padding: 11px 0;
|
||||
}
|
||||
|
||||
.modules-menu-level-1 {
|
||||
display: block;
|
||||
top: 42px;
|
||||
left: 15px;
|
||||
opacity: 1;
|
||||
transition:opacity.3s,top .3s;
|
||||
// border-top: 1px solid #222;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modules-menu-level-1 {
|
||||
display: none;
|
||||
min-width: 100%;
|
||||
margin: 0 -15px;
|
||||
padding: 0;
|
||||
background-color: #222;
|
||||
list-style: none;
|
||||
z-index: 1;
|
||||
|
||||
& > li {
|
||||
position: relative;
|
||||
|
||||
& + li {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
|
||||
& > a {
|
||||
display: block;
|
||||
padding: 18px 25px;
|
||||
font-family: $main-font;
|
||||
font-size: 15px;
|
||||
@media (min-width: $screen-sm) {
|
||||
padding: 11px 25px;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: darken($theme-color-second, 10%);
|
||||
transition:.3s;
|
||||
& > a,
|
||||
& > .fa {
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
position: absolute;
|
||||
// left: 15px;
|
||||
display: block;
|
||||
left: -10000px;
|
||||
top: 108px;
|
||||
opacity: 0;
|
||||
transition:opacity.3s,top .3s,left 0s .3s;
|
||||
// border:1px solid orange;
|
||||
background: #EFEFEF;
|
||||
& > li {
|
||||
padding-right: 30px;
|
||||
|
||||
& > a {
|
||||
color:#333;
|
||||
padding-left: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
& > .fa {
|
||||
position: static;
|
||||
|
||||
@include size(auto, auto);
|
||||
|
||||
padding: 0;
|
||||
margin-right: 0;
|
||||
line-height: 1;
|
||||
float: none;
|
||||
font-size: 1em;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.modules-menu-level-2 {
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 100%;
|
||||
opacity: 1;
|
||||
transition:opacity .3s ,left .3s;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
&:before {
|
||||
content: "\f105";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modules-menu-level-2 {
|
||||
display: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #EFEFEF;
|
||||
list-style: none;
|
||||
|
||||
& > li {
|
||||
transition:.3s;
|
||||
& + li {
|
||||
// border-top: 1px solid lighten($theme-gray-darker, 5%);
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
|
||||
& > a {
|
||||
color:#333;
|
||||
font-weight: bold;
|
||||
display: block;
|
||||
padding: 15px 50px;
|
||||
font-family: $main-font;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: darken($theme-color-main, 5%);
|
||||
|
||||
& > a {
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -10000px;
|
||||
left: 130%;
|
||||
opacity: 0;
|
||||
transition:left .3s,opacity .3s,top 0s .3s;
|
||||
&:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 13px;
|
||||
left: -6px;
|
||||
|
||||
@include arrow("right", 6px, 6px, white);
|
||||
}
|
||||
|
||||
& > li {
|
||||
padding-right: 15px;
|
||||
|
||||
& > a {
|
||||
padding-left: 15px;
|
||||
padding: 0.7em 0 0.7em 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
&:before {
|
||||
content: "\f105";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-md){
|
||||
padding:0;
|
||||
}
|
||||
}
|
||||
|
||||
.has-mobile-dropdown {
|
||||
.modules-menu {
|
||||
.dropdown-toggle-icon {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
@charset "utf-8";
|
||||
|
||||
.plugin-show-table th {
|
||||
text-align: right;
|
||||
min-width: 80px;
|
||||
}
|
||||
|
|
@ -0,0 +1,359 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.left-column {
|
||||
.o-question {
|
||||
font-size: 15px;
|
||||
}
|
||||
.o-question input[type="checkbox"], .o-question input[type="radio"] {
|
||||
margin: 0 5px 0 0 !important;
|
||||
}
|
||||
.o-question textarea {
|
||||
resize: vertical;
|
||||
}
|
||||
.o-question-topic {
|
||||
color: #666;
|
||||
font-size: 24px;
|
||||
line-height: normal;
|
||||
padding: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.o-question-description {
|
||||
font-size: 0.9em;
|
||||
line-height: 1.5em;
|
||||
overflow: hidden;
|
||||
margin-bottom: 10px;
|
||||
color: #b9141c;
|
||||
}
|
||||
.o-question-list {
|
||||
border: 1px solid #e2e2e2;
|
||||
border-radius: 3px;
|
||||
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.1);
|
||||
clear: both;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
.o-question-list > li {
|
||||
border-top: 1px solid #e2e2e2;
|
||||
font-size: 13px;
|
||||
list-style: outside none none;
|
||||
margin: 0;
|
||||
padding: 15px;
|
||||
position: relative;
|
||||
&:hover{
|
||||
background-color: #f5f3e8;
|
||||
transition: 0.3s;
|
||||
}
|
||||
&.question-57f31f091d41c8db3500001d,&.question-57f44e771d41c8d2b300001a,&.question-57f4528e1d41c8d2c400000c,&.question-57f4544b1d41c8d2d1000027,&.question-57f456601d41c8d2d1000045 {
|
||||
background-color: #f9eadd;
|
||||
.o-question-title{
|
||||
color: #940c13;
|
||||
}
|
||||
}
|
||||
}
|
||||
.o-question-list > li:nth-child(even) {
|
||||
background: #fbfbfb;
|
||||
&:hover{
|
||||
background-color: #f5f3e8;
|
||||
transition: 0.3s;
|
||||
}
|
||||
}
|
||||
.o-question-list > li .required-star {
|
||||
position: static;
|
||||
padding: 0;
|
||||
vertical-align: top;
|
||||
line-height: 24px;
|
||||
color: #666;
|
||||
}
|
||||
.o-question-list > li:first-child {
|
||||
border: 0 none;
|
||||
}
|
||||
.required-star +.o-question-title {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.o-question-title {
|
||||
color: #666;
|
||||
display: inline-block;
|
||||
font-size: 15px;
|
||||
font-weight: normal;
|
||||
line-height: 24px;
|
||||
margin: 0 25px 0 0;
|
||||
vertical-align: top;
|
||||
width: 94%;
|
||||
min-width: 4em;
|
||||
@media (min-width: $screen-md){
|
||||
width: 26%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
.o-question-title + .o-question-description {
|
||||
background-color: transparent;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
padding: 1px 8px;
|
||||
background-color: #991c22;
|
||||
color: #fff;
|
||||
display: inline;
|
||||
font-size: 13px;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
|
||||
.o-question-title + .o-question-description::before {
|
||||
border-bottom: 12px solid #f6f6f6;
|
||||
border-left: 12px solid transparent;
|
||||
border-right: 12px solid transparent;
|
||||
content: "";
|
||||
left: 16px;
|
||||
position: absolute;
|
||||
top: -12px;
|
||||
display: none;
|
||||
}
|
||||
.o-question-title + input[type="text"], .o-question-title + textarea, .o-question-title + select, .o-question-description + input[type="text"], .o-question-description + textarea, .o-question-description + select {
|
||||
display: block;
|
||||
}
|
||||
.o-question-title + input[type="text"]{
|
||||
border: 1px solid #ccc;
|
||||
display: inline-block;
|
||||
line-height: 24px;
|
||||
margin: 0;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.o-question-description + input[type="text"]{
|
||||
border: 1px solid #ccc;
|
||||
line-height: 24px;
|
||||
margin: 5px 0 0 0;
|
||||
padding: 0 5px;
|
||||
width: 100%;
|
||||
@media (min-width: $screen-md){
|
||||
width: 69%;
|
||||
}
|
||||
}
|
||||
.o-question-title + input[type="text"] {
|
||||
width: 100%;
|
||||
@media (min-width: $screen-md){
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
.o-question-title + textarea {
|
||||
border: 1px solid #ccc;
|
||||
line-height: 24px;
|
||||
margin: 5px 0 0 0;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.o-question-title + textarea {
|
||||
width: 100%;
|
||||
@media (min-width: $screen-md){
|
||||
width: 69%;
|
||||
}
|
||||
}
|
||||
.o-question-group {
|
||||
margin: 20px 0;
|
||||
padding: 0;
|
||||
}
|
||||
.o-question-option {
|
||||
font-weight: normal;
|
||||
}
|
||||
.o-question-group.view-list {
|
||||
list-style: outside none none;
|
||||
color: #666;
|
||||
font-size: 15px;
|
||||
margin: 5px 0 0 0;
|
||||
}
|
||||
.o-question-group.view-list .o-question-option {
|
||||
}
|
||||
.o-question-group.view-list > li {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
}
|
||||
.question-57f31f091d41c8db3500001c .o-question-group.view-list > li,.question-57f44e771d41c8d2b3000019 .o-question-group.view-list > li,.question-57f4507d1d41c8d2d100001a .o-question-group.view-list > li,.question-57f4528e1d41c8d2c400001d .o-question-group.view-list > li,.question-57f4544b1d41c8d2d1000038 .o-question-group.view-list > li,.question-57f456601d41c8d2d1000056 .o-question-group.view-list > li{
|
||||
display: block;
|
||||
}
|
||||
.o-question-group.view-list > li:first-child {
|
||||
margin: 0;
|
||||
}
|
||||
.o-question-group.view-list > li > * {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.o-question-group.view-list > li input + .o-question-option {
|
||||
line-height: 15px;
|
||||
margin: 0 12px 0 0;
|
||||
display: inline;
|
||||
}
|
||||
.o-question-group.view-list > li input + .o-question-option + input[type="text"] {
|
||||
margin: 0 0 0 -15px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.o-question-group.view-dropdown {
|
||||
margin: 8px 0 0px 0;
|
||||
width: 100%;
|
||||
border: 1px solid #ccc;
|
||||
@media (min-width: $screen-md){
|
||||
width: 69%;
|
||||
}
|
||||
}
|
||||
.o-question-group.view-grid {
|
||||
border-collapse: collapse;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
max-width: 100vw;
|
||||
min-width: 0;
|
||||
width: 730px;
|
||||
}
|
||||
.o-question-group.view-grid th, .o-question-group.view-grid td {
|
||||
|
||||
}
|
||||
.o-question-group.view-grid thead th {
|
||||
background: #777 none repeat scroll 0 0;
|
||||
box-sizing: content-box !important;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
width: 146px;
|
||||
}
|
||||
.o-question-group.view-grid tbody th {
|
||||
}
|
||||
.o-question-group.view-grid tbody .odd .o-question-title, .o-question-group.view-grid tbody .odd td {
|
||||
|
||||
}
|
||||
.o-question-group.view-grid .o-question-title {
|
||||
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
|
||||
border-bottom: 1px solid #ccc;
|
||||
box-sizing: content-box;
|
||||
margin: 0;
|
||||
width: 146px;
|
||||
}
|
||||
.o-question-group.view-grid tbody .odd .o-question-title {
|
||||
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
|
||||
border-bottom: 1px solid #ccc;
|
||||
width: 146px;
|
||||
}
|
||||
.o-question-group.view-grid tbody .odd td {
|
||||
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
|
||||
border-bottom: 1px solid #ccc;
|
||||
width: 146px;
|
||||
}
|
||||
.o-question-group.view-grid tbody tr:hover td {
|
||||
background: none;
|
||||
}
|
||||
.o-question-group.view-grid tbody td {
|
||||
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
|
||||
border-bottom: 1px solid #ccc;
|
||||
width: 146px;
|
||||
}
|
||||
.o-question-group.view-grid tbody td input {
|
||||
|
||||
}
|
||||
.o-question-action {
|
||||
background-color: #f6f6f6;
|
||||
padding: 20px;
|
||||
}
|
||||
input.survey-submit{
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
border: 0;
|
||||
background-color: #ffffff;
|
||||
line-height: 40px;
|
||||
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.1);
|
||||
border: 1px solid #e2e2e2;
|
||||
border-top: 0;
|
||||
color: #666;
|
||||
&:hover{
|
||||
background-color: #dab005;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
@media (min-width: $screen-lg){
|
||||
.o-question-title[for="answer_57f31f091d41c8db35000010"] + .o-question-description{
|
||||
margin-left: -7%;
|
||||
}
|
||||
.o-question-title[for="answer_57f31f091d41c8db35000011"] + .o-question-description{
|
||||
margin-left: -2%;
|
||||
}
|
||||
.o-question-title[for="answer_57f31f091d41c8db35000017"] + .o-question-description{
|
||||
margin-left: -10%;
|
||||
}
|
||||
.o-question-title[for="answer_57f31f091d41c8db35000019"] + .o-question-description{
|
||||
margin-left: -8%;
|
||||
}
|
||||
.o-question-title[for="answer_57f31f091d41c8db3500001d"] + .o-question-description{
|
||||
margin-left: -11%;
|
||||
}
|
||||
.o-question-title[for="answer_57f44e771d41c8d2b300000d"] + .o-question-description{
|
||||
margin-left: -9%;
|
||||
}
|
||||
.o-question-title[for="answer_57f44e771d41c8d2b300000e"] + .o-question-description{
|
||||
margin-left: -2%;
|
||||
}
|
||||
.o-question-title[for="answer_57f44e771d41c8d2b3000014"] + .o-question-description{
|
||||
margin-left: -11%;
|
||||
}
|
||||
.o-question-title[for="answer_57f44e771d41c8d2b3000016"] + .o-question-description{
|
||||
margin-left: -9%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4507d1d41c8d2d100000e"] + .o-question-description{
|
||||
margin-left: -9%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4507d1d41c8d2d100000f"] + .o-question-description{
|
||||
margin-left: -2%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4507d1d41c8d2d1000015"] + .o-question-description{
|
||||
margin-left: -11%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4507d1d41c8d2d1000017"] + .o-question-description{
|
||||
margin-left: -9%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4528e1d41c8d2c4000011"] + .o-question-description{
|
||||
margin-left: -8%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4528e1d41c8d2c4000012"] + .o-question-description{
|
||||
margin-left: -2%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4528e1d41c8d2c4000018"] + .o-question-description{
|
||||
margin-left: -11%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4528e1d41c8d2c400001a"] + .o-question-description{
|
||||
margin-left: -9%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4544b1d41c8d2d100002c"] + .o-question-description{
|
||||
margin-left: -8%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4544b1d41c8d2d100002d"] + .o-question-description{
|
||||
margin-left: -2%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4544b1d41c8d2d1000033"] + .o-question-description{
|
||||
margin-left: -11%;
|
||||
}
|
||||
.o-question-title[for="answer_57f4544b1d41c8d2d1000035"] + .o-question-description{
|
||||
margin-left: -9%;
|
||||
}
|
||||
.o-question-title[for="answer_57f456601d41c8d2d100004a"] + .o-question-description{
|
||||
margin-left: -8%;
|
||||
}
|
||||
.o-question-title[for="answer_57f456601d41c8d2d100004b"] + .o-question-description{
|
||||
margin-left: -2%;
|
||||
}
|
||||
.o-question-title[for="answer_57f456601d41c8d2d1000051"] + .o-question-description{
|
||||
margin-left: -11%;
|
||||
}
|
||||
.o-question-title[for="answer_57f456601d41c8d2d1000053"] + .o-question-description{
|
||||
margin-left: -9%;
|
||||
}
|
||||
}
|
||||
@media (max-width: 480px){
|
||||
.o-question-title + input[type="text"], .left-column .o-question-title + textarea,.o-question-group.view-dropdown{
|
||||
display: block;
|
||||
margin-top: 0.5em;
|
||||
width: 100%;
|
||||
}
|
||||
.o-question-title + textarea{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
// Link MODULES
|
||||
.widget-link {
|
||||
// 在 layout-content 下的樣式
|
||||
padding: 25px 8% ;
|
||||
.widget-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
&.widget1 {
|
||||
.list-unstyled{
|
||||
margin: 0;
|
||||
}
|
||||
.widget-content {
|
||||
line-height: 1.2em;
|
||||
padding-bottom: 10px;
|
||||
background: url(/assets/links_icon.jpg) left 7px no-repeat;
|
||||
padding-left: 17px;
|
||||
|
||||
& + .widget-content {
|
||||
|
||||
}
|
||||
|
||||
.widget-content-title {
|
||||
display: inline-block;
|
||||
color: #474747;
|
||||
font-size: $font-15;
|
||||
font-family: $main-font;
|
||||
&:hover{
|
||||
text-decoration: underline;
|
||||
color: $theme-color-main;
|
||||
}
|
||||
@media (max-width: $screen-md){
|
||||
font-size: $font-15;
|
||||
margin-bottom:4px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 在 layout-footer 下的樣式
|
||||
.layout-footer & {
|
||||
.widget-content {
|
||||
line-height: 2em;
|
||||
border-top-color: $theme-gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Link INDEX
|
||||
.index-link {
|
||||
.index-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
&.index1 {
|
||||
.index-content {
|
||||
list-style-type: circle;
|
||||
list-style-position: inside;
|
||||
|
||||
& + .index-content {
|
||||
border-top: 1px dotted $theme-gray-light;
|
||||
}
|
||||
|
||||
.index-context {
|
||||
display: inline-block;
|
||||
font-size: 13px;
|
||||
margin: 0 0 10px 2em;
|
||||
color: darken($theme-gray-light, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
.index-content-title {
|
||||
font-family: $main-font;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
// Customize this scss file as you need to fit the design
|
||||
@charset "utf-8";
|
||||
|
||||
body {
|
||||
background: #fff;
|
||||
color: #000;
|
||||
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
|
||||
line-height: 1.3;
|
||||
font-size: 12pt;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#orbit-bar,
|
||||
.no-print {
|
||||
display: none !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
@import url("http://fonts.googleapis.com/css?family=Droid+Sans:400,700");
|
||||
|
||||
// Base
|
||||
@import "base/orbitbar-override";
|
||||
@import "base/sitemap-override";
|
||||
@import "base/global";
|
||||
@import "base/unity";
|
||||
@import "base/utilities";
|
||||
@import "base/pagination";
|
||||
@import "base/accesskey";
|
||||
@import "base/go_back_top";
|
||||
@import "base/ckeditor-reset";
|
||||
|
||||
// Layout
|
||||
@import "layout/*";
|
||||
|
||||
// Modules
|
||||
@import "modules/*";
|
||||
|
||||
// Widget
|
||||
@import "widget/*";
|
||||
.content_background {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
.mask {
|
||||
display: none;
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
display: block;
|
||||
position: absolute;
|
||||
// margin-top: 185px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: '';
|
||||
z-index: 99;
|
||||
transition: border .7s;
|
||||
|
||||
&.active {
|
||||
left: -10000px;
|
||||
transition: border .7s,left 0s .7s;
|
||||
border-left: 0 solid transparent !important;
|
||||
border-right: 0 solid transparent !important;
|
||||
border-top: 0 solid transparent !important;
|
||||
border-bottom: 0 solid transparent !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.rightTopBG img {
|
||||
max-height: 71px;
|
||||
}
|
||||
.rightTopBG {
|
||||
min-width: 100px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 32px;
|
||||
z-index: 1;
|
||||
}
|
||||
.layout-header .header-nav .header-nav2 {
|
||||
z-index: 3;
|
||||
position: relative;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.navbar-header .navbar-brand img {
|
||||
max-height: 60px;
|
||||
}
|
||||
.navbar-header .navbar-brand,
|
||||
img.site-logo
|
||||
{
|
||||
float: none!important;
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: auto!important;
|
||||
}
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.widget-breadcrumb {
|
||||
.breadcrumb{
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #ececec;
|
||||
}
|
||||
&.widget1 {
|
||||
li {
|
||||
a {
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
a {
|
||||
color: $theme-gray-dark;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "../initial";
|
||||
|
||||
.sitemenu-horizontal {
|
||||
padding: 10px 0;
|
||||
|
||||
@include clearfix;
|
||||
|
||||
.sitemenu-title {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.sitemenu-item.level-1 {
|
||||
font-size: 0.8125rem;
|
||||
position: relative;
|
||||
float: left;
|
||||
margin-right: 1%;
|
||||
margin-bottom: 12px;
|
||||
padding: 8px .8em;
|
||||
padding-bottom: 8px;
|
||||
color: $theme-white;
|
||||
border-radius: .2em;
|
||||
background: $theme-color-second;
|
||||
|
||||
&:hover {
|
||||
background: darken($theme-color-second, 10%);
|
||||
}
|
||||
&:hover ul.dropdown-menu{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.sitemenu-link.level-1 {
|
||||
margin-right: .25rem;
|
||||
color: $theme-white;
|
||||
}
|
||||
|
||||
.sitemenu-dropdown-toggle {
|
||||
font-size: 0.75rem;
|
||||
padding: 2px .3125rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// sitemenu dropdown
|
||||
.sitemenu-list.dropdown-menu { /*第三層選單*/
|
||||
min-width: 100%;
|
||||
margin-top: -2px;
|
||||
border: none;
|
||||
border-radius: 0 0 .2em .2em;
|
||||
background: $theme-color-third;
|
||||
}
|
||||
|
||||
.sitemenu-link.level-2 {
|
||||
color: $theme-white;
|
||||
font-size: 0.8125rem;
|
||||
padding: 4px 0.625rem;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sitemenu-vertical {
|
||||
.sitemenu-list {
|
||||
background-color: $theme-color-second;
|
||||
}
|
||||
|
||||
.sitemenu-item.level-1 {
|
||||
|
||||
position: relative;
|
||||
color: $theme-white;
|
||||
&:hover{
|
||||
background-color: darken( $theme-color-second , 10%);
|
||||
}
|
||||
&:hover ul.dropdown-menu{
|
||||
display:block;
|
||||
}
|
||||
}
|
||||
|
||||
.sitemenu-link {
|
||||
font-size: 0.8125rem;
|
||||
padding: 10px 30px 10px 20px;
|
||||
color: $theme-white;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.sitemenu-dropdown-toggle {
|
||||
font-size: 0.75rem;
|
||||
padding: 2px .3125rem;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 50%;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
.sitemenu-list.dropdown-menu {
|
||||
border: none;
|
||||
border-radius:0 0 .2em .2em;
|
||||
margin-top: 0;
|
||||
background: $theme-color-third;
|
||||
width: auto;
|
||||
min-width: 100px;
|
||||
padding: 0;
|
||||
right: 100%;
|
||||
left: auto;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.sitemenu-link.level-2 {
|
||||
color: $theme-white;
|
||||
font-size: 0.8125rem;
|
||||
padding: 11px 20px;
|
||||
border-bottom: 1px solid lighten( $theme-color-third , 5%);
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
background-color: darken( $theme-color-third, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<footer class="layout-footer no-print">
|
||||
<div class="container layout-footer-inner">
|
||||
<div class="layout-footer-content">{{footer-data}}</div>
|
||||
<div class="footer-counter">{{site-counter}}</div>
|
||||
<div class="footer-updated-date">{{last-updated}}</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
<div id="fb-root"></div>
|
||||
<script>(function(d, s, id) {
|
||||
var js, fjs = d.getElementsByTagName(s)[0];
|
||||
if (d.getElementById(id)) return;
|
||||
js = d.createElement(s); js.id = id;
|
||||
js.src = "//connect.facebook.net/zh_TW/sdk.js#xfbml=1&version=v2.0";
|
||||
fjs.parentNode.insertBefore(js, fjs);
|
||||
}(document, 'script', 'facebook-jssdk'));</script>
|
||||
|
||||
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
|
||||
|
||||
<header class="navbar layout-header no-print" role="navigation">
|
||||
<div class="container">
|
||||
<div class="header-nav"><div class="header-nav2">
|
||||
<a id="accesskey_top" accesskey="Q" href="/<%= "#{locale.to_s}" %>/accesskey" title="Toolbar">:::</a>
|
||||
{{header-data}}
|
||||
</div>
|
||||
<section class="rightTopBG" data-pp="301"></section>
|
||||
</div>
|
||||
<div class="navbar-header">
|
||||
<a title="{{site_title_1}}" class="navbar-brand" href="{{home_link_1}}"><img class="site-logo" src="{{logo_url_1}}" alt="Site Logo"></a><script>$(document).ready(function(){var url =$('.site-logo').eq(0).attr('src');if(url == "/assets/default-site-logo.png"){$('.navbar-brand').eq(0).remove();};if($('.navbar-brand').length == 2){$('.site-logo').css('height','auto')};$('.site-logo').eq(0).css('margin-right',0);$('.navbar-brand').css('padding-right',0)})</script><a title="{{site_title}}" class="navbar-brand" href="{{home_link}}"><img class="site-logo" src="{{logo_url}}" alt="Site Logo"> {{site_name}}</a>
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#layout-navigation">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icob-box">
|
||||
<span class="icon-bar icon-bar-top"></span>
|
||||
<span class="icon-bar icon-bar-middle"></span>
|
||||
<span class="icon-bar icon-bar-bottom"></span>
|
||||
</span>
|
||||
<span class="icob-box">MENU</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse modules-menu" id="layout-navigation">
|
||||
<a id="accesskey_menu" accesskey="M" href="/<%= "#{locale.to_s}" %>/accesskey" title="Main menu">:::</a>
|
||||
<%= render_menu %>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
<!doctype html>
|
||||
<html lang="<%= I18n.locale.to_s %>" class="orbit">
|
||||
<head>
|
||||
<%= render_partial("head") %>
|
||||
</head>
|
||||
<body class="page-home">
|
||||
<%= render_orbit_bar %>
|
||||
<%= render_header %>
|
||||
<div class="layout-content">
|
||||
<div class="mask"></div>
|
||||
<section class="layout-slide no-print single-child-datapp" data-pp="300"></section>
|
||||
|
||||
<a id="accesskey_content" accesskey="C" href="/<%= "#{locale.to_s}" %>/accesskey" title="Content">:::</a>
|
||||
<div data-pp="999" class="content_background"></div>
|
||||
<div class="layout-content-inner container">
|
||||
<section class="layout-content-box" data-pp="1"></section>
|
||||
<div class="row">
|
||||
<section class="layout-content-boxL">
|
||||
<section class="content-boxL1">
|
||||
<div class="single-child-datapp" data-pp="2"></div>
|
||||
<div class="single-child-datapp L11" data-pp="11"></div>
|
||||
</section>
|
||||
<section class="content-boxL2">
|
||||
<div class="single-child-datapp" data-pp="5"></div>
|
||||
<div class="single-child-datapp L22" data-pp="12"></div>
|
||||
</section>
|
||||
<section class="content-boxL3">
|
||||
<div class="single-child-datapp" data-pp="6"></div>
|
||||
<div class="single-child-datapp L33" data-pp="13"></div>
|
||||
</section>
|
||||
<section class="content-boxB">
|
||||
<section class="boxB-menu single-child-datapp" data-pp="7"></section>
|
||||
<section class="boxB-info1 B_news single-child-datapp" data-pp="8"></section>
|
||||
<section class="boxB-info2 B_news single-child-datapp" data-pp="9"></section>
|
||||
<section class="boxB-info3 B_news" data-pp="10"></section>
|
||||
</section>
|
||||
</section>
|
||||
<aside class="layout-content-boxR aside"><aside class="layout-content-boxR2" data-pp="3"></aside>
|
||||
</div>
|
||||
<div class="row">
|
||||
<section class="col-md-3" data-pp="14"></section>
|
||||
<section class="col-md-3" data-pp="15"></section>
|
||||
<section class="col-md-3" data-pp="16"></section>
|
||||
<section class="col-md-3" data-pp="17"></section>
|
||||
</div>
|
||||
<div class="row">
|
||||
<section class="col-md-12" data-pp="18"></section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<%= render_footer %>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<ul id="main-nav" class="navbar-left navbar-nav modules-menu-level-0 nav-level-0 no-print" data-menu-level="0">
|
||||
<li>
|
||||
<a href="" data-menu-link="true" class="dropdown-toggle">{{link_name}}</a>
|
||||
<ul class="modules-menu-level-1 nav-level-1" data-menu-level="1">
|
||||
<li>
|
||||
<a href="" data-menu-link="true">{{link_name}}</a>
|
||||
<ul class="modules-menu-level-2 nav-level-2" data-menu-level="2">
|
||||
<li>
|
||||
<a href="" data-menu-link="true">{{link_name}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!doctype html>
|
||||
<html lang="<%= I18n.locale.to_s %>" class="orbit">
|
||||
<head>
|
||||
<%= render_partial("head") %>
|
||||
</head>
|
||||
<body class="internal-page">
|
||||
<%= render_orbit_bar %>
|
||||
<%= render_header %>
|
||||
<section class="layout-slide no-print single-child-datapp " data-pp="300"></section>
|
||||
<div class="layout-content">
|
||||
<div data-pp="999" class="content_background"></div>
|
||||
<div class="mask"></div>
|
||||
<div class="layout-content-inner container">
|
||||
<div class="breadcrumb-wrap" data-pp="500"></div>
|
||||
<div class="row">
|
||||
<section class="layout-content-box left-column col-sm-9">
|
||||
<div class="extra" data-pp="600"></div>
|
||||
<main id="main-content" class="main-content" data-content="true">
|
||||
<%= yield %>
|
||||
</main>
|
||||
<%= render_every_page_sharer %>
|
||||
<div class="extra" data-pp="700"></div>
|
||||
</section>
|
||||
<aside class="layout-content-box aside right-column col-sm-3" data-pp="13"></aside>
|
||||
</div>
|
||||
<div class="extra" data-pp="800"></div>
|
||||
</div>
|
||||
</div>
|
||||
<%= render_footer %>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<ul class="pagination pagination-sm" data-pagination="true">
|
||||
<li class="{{pagination_active}}">
|
||||
<a href="{{pagination_link}}">{{page_number}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue