diff --git a/assets/javascripts/app.js b/assets/javascripts/app.js index 4e44b3a..5b164eb 100644 --- a/assets/javascripts/app.js +++ b/assets/javascripts/app.js @@ -2,6 +2,36 @@ // ECMAScript 5 嚴格模式 'use strict'; $(function() { + var $signLanguageBox = $('.orbit-bar-search-sign-language'); + var $headerNav = $('.header-nav'); + var $target = $('.header-nav [accesskey="U"], .header-nav [accesskey="W"]'); + + // 移除 color: inherit !important + $target.each(function() { + $(this)[0].style.removeProperty('color'); + }); + + function handleNavMove() { + var windowWidth = window.innerWidth; + + if (windowWidth > 768) { + if ($signLanguageBox.length && $signLanguageBox.find('[accesskey="U"], [accesskey="W"]').length === 0) { + $signLanguageBox.prepend($target); + } + } else { + if ($headerNav.length && $headerNav.find('[accesskey="U"], [accesskey="W"]').length === 0) { + $headerNav.append($target); + } + } + } + + handleNavMove(); + + $(window).on('resize', function() { + handleNavMove(); + }); + }); + $(function() { var $target = $('.header-nav [accesskey="U"], .header-nav [accesskey="W"]'); // 移除 color: inherit !important $target.each(function() { @@ -297,6 +327,17 @@ $(function(){ }, 100); } }); + // ✅ Tab 鍵跳過 .navbar-toggle 時,觸發與點擊相同的收合邏輯 + $(document).on('focusout', '.mobile-menu', function(e) { + setTimeout(function() { + var $newFocus = $(document.activeElement); + // 焦點已離開 .mobile-menu 且選單是展開狀態 + if ($('.mobile-menu').hasClass('active') && $newFocus.closest('.mobile-menu').length === 0) { + // ✅ 直接 trigger click,與按下 .navbar-toggle 執行完全相同的動作 + $('.navbar-toggle').first().trigger('click'); + } + }, 50); + }); $('.mobile-menu1 > .menu-drop').click(function(){ var $that = $(this); @@ -596,7 +637,7 @@ $(function(){ } }); if (document.documentElement.lang === 'zh_tw') { - document.documentElement.lang = 'zh-Hant'; + document.documentElement.lang = 'zh-Hant-TW'; } //tab鍵按下 $(document).on('keydown', function(e) { @@ -709,20 +750,20 @@ $(function(){ $(this).attr("style", newStyle); } }); - //表格scope - $("table").each(function() { - $(this).find("tr").each(function(rowIndex) { - $(this).find("th").each(function(colIndex) { - if (rowIndex === 0) { - // 第一列的 th,適用於該欄 - $(this).attr("scope", "col"); - } else if (colIndex === 0) { - // 其他列的第一個 th,適用於該行 - $(this).attr("scope", "row"); - } - }); - }); - }); + // //表格scope + // $("table").each(function() { + // $(this).find("tr").each(function(rowIndex) { + // $(this).find("th").each(function(colIndex) { + // if (rowIndex === 0) { + // // 第一列的 th,適用於該欄 + // $(this).attr("scope", "col"); + // } else if (colIndex === 0) { + // // 其他列的第一個 th,適用於該行 + // $(this).attr("scope", "row"); + // } + // }); + // }); + // }); $(".banner-pager button").addClass('banner-pagerbtn'); $(".banner-pager button").attr("type","button"); $(".banner-pager button").append('下一張'); @@ -918,7 +959,7 @@ $(function() { var urlParams = new URLSearchParams(window.location.search); var isEditMode = urlParams.get('editmode') === 'on'; - var pageLang = $('html').attr('lang') || 'zh-Hant'; + var pageLang = $('html').attr('lang') || 'zh-Hant-TW'; var isEn = pageLang.toLowerCase().startsWith('en'); var i18n = { @@ -1672,6 +1713,7 @@ $(function() { setTimeout(fixTabLinearOrder, 500); }); + //頁籤無障礙 $(function () { function fixTabAccessibility() { @@ -2807,6 +2849,7 @@ $(document).ready(function() { $sitemapLink.prependTo($target); } }); +//post $(document).ready(function () { setTimeout(function () { $('iframe.twitter-share-button, iframe.twitter-tweet-button').each(function () { @@ -2814,6 +2857,55 @@ $(document).ready(function () { }); }, 1500); }); +$(function() { + function bindIframeFocus() { + var $iframe = $('.twitter-share-button'); + if ($iframe.length === 0) return; + + $iframe.each(function() { + var $wrap = $(this).closest('.tw-share-button'); + + // 讓外層可以被 tab 到並顯示焦點框 + $wrap.attr('tabindex', '-1'); + + $(window).on('blur.twitterFocus', function() { + setTimeout(function() { + if (document.activeElement && + $(document.activeElement).hasClass('twitter-share-button')) { + $wrap.css({ + 'outline': '3px solid #005fcc', + 'outline-offset': '2px', + 'border-radius': '2px' + }); + } + }, 100); + }); + + $(window).on('focus.twitterFocus', function() { + $wrap.css({ + 'outline': '', + 'outline-offset': '' + }); + }); + }); + } + + // 用 MutationObserver 等 iframe 被 Twitter script 插入後才綁定 + var observer = new MutationObserver(function(mutations) { + if ($('.twitter-share-button').length > 0) { + bindIframeFocus(); + observer.disconnect(); // 綁定成功後停止監聽 + } + }); + + observer.observe(document.body, { + childList: true, + subtree: true + }); + + // 保險:2秒後強制執行一次 + setTimeout(bindIframeFocus, 1000); +}); //orbitbarlogo無障礙 $(function() { var $logo = $('.orbit-bar-logo'); @@ -2859,6 +2951,9 @@ $(function() { var target = document.getElementById('gallery-theater-stage'); if (!target) return; + // 頁面載入時若已存在 #gallery-theater-stage,則還原 z-index + $('.verticalhome').css('z-index', 'auto'); + var observer = new MutationObserver(function() { var display = target.style.display; if (display === 'block') { @@ -3033,6 +3128,36 @@ $(document).ready(function () { fixSortLinkA11y(); fixSearchInputA11y(); }, 500); +}); +//a無障礙空連結 +function removeHiddenContentLinks() { + // 若網址含有 editmode=on 則不執行 + if (window.location.href.indexOf('editmode=on') !== -1) return; + + $('a').each(function () { + var $link = $(this); + + // 若連結本身是 display:none,直接移除 + if ($link.css('display') === 'none') { + $link.remove(); + return; + } + + // 若連結內有子元素,且全部都是 display:none + var $children = $link.children(); + if ($children.length > 0) { + var allHidden = $children.toArray().every(function (child) { + return $(child).css('display') === 'none'; + }); + if (allHidden) { + $link.remove(); + } + } + }); +} + +$(document).ready(function () { + setTimeout(removeHiddenContentLinks, 500); }); // 執行 member等高計算,目前改用flexbox故mark掉 by ika 20160105 // $(window).load(function() { diff --git a/assets/stylesheets/template/base/_variables.scss b/assets/stylesheets/template/base/_variables.scss index 87154b1..30e2189 100644 --- a/assets/stylesheets/template/base/_variables.scss +++ b/assets/stylesheets/template/base/_variables.scss @@ -16,8 +16,8 @@ $theme-red: #d20001; $theme-blue: #003d7e; $theme-color-main: #333333; -$theme-color-second:#268663; -$theme-color-third: #268663; +$theme-color-second:#20835f; +$theme-color-third: #20835f; $theme-color-green: #32D9C3; $theme-color-hover:#0345bf; diff --git a/assets/stylesheets/template/layout/content.scss b/assets/stylesheets/template/layout/content.scss index ff54fdb..e166eb8 100644 --- a/assets/stylesheets/template/layout/content.scss +++ b/assets/stylesheets/template/layout/content.scss @@ -1,6 +1,11 @@ @charset "utf-8"; @import "../initial"; +.line-it-button{ + .label{ + color: #333!important; + } +} .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{ @media(max-width: $screen-xs){ padding: 0; diff --git a/assets/stylesheets/template/modules/announcement.scss b/assets/stylesheets/template/modules/announcement.scss index 2234a92..7ab6eb1 100644 --- a/assets/stylesheets/template/modules/announcement.scss +++ b/assets/stylesheets/template/modules/announcement.scss @@ -2579,12 +2579,6 @@ .i-annc__entry-title { margin-bottom: 0; margin-top: 0; - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - overflow: hidden; - text-overflow: ellipsis; - // clear: both; } .i-annc__title { @@ -2592,6 +2586,11 @@ color: $theme-color-main; text-decoration: none; @extend .i-title; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + text-overflow: ellipsis; + overflow: hidden; &:hover { color: $theme-color-second; } diff --git a/assets/stylesheets/template/modules/menu.scss b/assets/stylesheets/template/modules/menu.scss index 26b516a..66556d7 100644 --- a/assets/stylesheets/template/modules/menu.scss +++ b/assets/stylesheets/template/modules/menu.scss @@ -97,9 +97,6 @@ body { transition: all .3s ease; } } - .header-nav{ - display: none!important; - } -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; diff --git a/assets/stylesheets/template/template.scss b/assets/stylesheets/template/template.scss index 759fe15..43a961a 100644 --- a/assets/stylesheets/template/template.scss +++ b/assets/stylesheets/template/template.scss @@ -884,6 +884,15 @@ a.ui-state-default{ color:#fff!important ; } } +.btn-search:focus{ + border-color: rgba(82, 168, 236, 0.8); + outline: 0; + outline: thin dotted \9; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + border-radius: 1em; +} /* 當 input 被 focus 或 btn 被點擊時,讓按鈕跳到上層並可點擊 */ .search-box:focus-within .btn-search { z-index: 999;