This commit is contained in:
ken 2026-06-23 11:38:13 +08:00
parent 054a84952a
commit e71348c820
5 changed files with 125 additions and 62 deletions

View File

@ -1189,61 +1189,103 @@
});
$(function() {
function smartFixIcons() {
$('i').each(function() {
var $icon = $(this);
var $parent = $icon.parent();
function smartFixIcons() {
$('i').each(function() {
var $icon = $(this);
var $parent = $icon.parent();
// 1. 基本安全:所有圖示先對螢幕閱讀器隱藏 (避免讀出 Unicode 亂碼)
$icon.attr('aria-hidden', 'true');
// 1. 所有圖示先對螢幕閱讀器隱藏
$icon.attr('aria-hidden', 'true');
// 2. 檢查:如果已經有 aria-label 或旁邊已有 sr-only就不重複處理
if ($icon.attr('aria-label') || $icon.next('.sr-only').length > 0 || $parent.find('.sr-only').length > 0) {
return;
}
var cls = ($icon.attr('class') || '').toLowerCase();
var labelText = '';
// --- 策略 A常見資訊型圖示 (自動識別內容意義) ---
if (cls.includes('calendar')) labelText = '日期:';
else if (cls.includes('user') || cls.includes('male')) labelText = '發布者:';
else if (cls.includes('tag')) labelText = '標籤:';
else if (cls.includes('clock') || cls.includes('time')) labelText = '時間:';
else if (cls.includes('map-marker') || cls.includes('location')) labelText = '地點:';
else if (cls.includes('phone')) labelText = '電話:';
else if (cls.includes('envelope') || cls.includes('mail')) labelText = '信箱:';
else if (cls.includes('folder')) labelText = '分類:';
else if (cls.includes('eye')) labelText = '瀏覽次數:';
else if (cls.includes('download')) labelText = '下載檔案:';
// --- 策略 B功能性按鈕 (如果 i 放在 <a> 或 <button> 裡面且容器沒文字) ---
var $container = $icon.closest('a, button');
if ($container.length > 0 && $container.text().trim() === "") {
// 如果容器裡面什麼字都沒有,這是一個「純圖示按鈕」
// 我們嘗試抓取容器的 title 作為 label
var btnTitle = $container.attr('title');
if (btnTitle) {
labelText = btnTitle;
} else if (cls.includes('search')) labelText = '搜尋';
else if (cls.includes('bars') || cls.includes('navicon')) labelText = '選單';
else if (cls.includes('print')) labelText = '列印此頁';
else if (cls.includes('share')) labelText = '分享至社群';
else if (cls.includes('close') || cls.includes('times')) labelText = '關閉視窗';
}
// --- 3. 執行補強 ---
if (labelText !== '') {
// 如果是按鈕內部,用 aria-label 補強容器
if ($container.length > 0 && $container.text().trim() === "") {
$container.attr('aria-label', labelText);
} else {
// 如果是資訊列表,在 i 後面插入 sr-only
$icon.after('<span class="sr-only">' + labelText + '</span>');
}
}
});
// 特判:.close-screen-btn 內的圖示,移除無關的 sr-only 並設正確 aria-label
if ($parent.hasClass('close-screen-btn')) {
$parent.find('.sr-only').remove();
$parent.attr('aria-label', '關閉公告視窗');
if ($icon.next('.sr-only').length === 0) {
$icon.after('<span class="sr-only">關閉公告視窗</span>');
}
return;
}
// 特判:.gallery-close 內的圖示,移除錯誤的 sr-only「時間」並補正確說明
if ($parent.closest('.gallery-close').length > 0) {
$parent.closest('.gallery-close').find('.sr-only').remove();
$parent.closest('.gallery-close').attr('aria-label', '關閉相簿');
$parent.closest('.gallery-close').attr('role', 'button');
$parent.closest('.gallery-close').attr('tabindex', '0');
if ($icon.next('.sr-only').length === 0) {
$icon.after('<span class="sr-only">關閉相簿</span>');
}
return;
}
// 特判:.gallery-toggle-desc 補說明
if ($parent.closest('.gallery-toggle-desc').length > 0) {
var $toggleBtn = $parent.closest('.gallery-toggle-desc');
if (!$toggleBtn.attr('aria-label')) {
$toggleBtn.attr('aria-label', '顯示或隱藏圖片說明');
$toggleBtn.attr('role', 'button');
$toggleBtn.attr('tabindex', '0');
}
if ($icon.next('.sr-only').length === 0) {
$icon.after('<span class="sr-only">顯示或隱藏圖片說明</span>');
}
return;
}
// 特判:.gallery-theme-switch 補說明
if ($parent.closest('.gallery-theme-switch').length > 0) {
var $themeBtn = $parent.closest('.gallery-theme-switch');
if (!$themeBtn.attr('aria-label')) {
$themeBtn.attr('aria-label', '切換相簿主題');
$themeBtn.attr('role', 'button');
$themeBtn.attr('tabindex', '0');
}
if ($icon.next('.sr-only').length === 0) {
$icon.after('<span class="sr-only">切換相簿主題</span>');
}
return;
}
// 2. 已有 aria-label 或 sr-only 就不重複處理
if ($icon.attr('aria-label') || $icon.next('.sr-only').length > 0 || $parent.find('.sr-only').length > 0) {
return;
}
var cls = ($icon.attr('class') || '').toLowerCase();
var labelText = '';
// --- 策略 A常見資訊型圖示 ---
if (cls.includes('calendar')) labelText = '日期:';
else if (cls.includes('user') || cls.includes('male')) labelText = '發布者:';
else if (cls.includes('tag')) labelText = '標籤:';
else if (cls.includes('clock') || cls.includes('time')) labelText = '時間:';
else if (cls.includes('map-marker') || cls.includes('location')) labelText = '地點:';
else if (cls.includes('phone')) labelText = '電話:';
else if (cls.includes('envelope') || cls.includes('mail')) labelText = '信箱:';
else if (cls.includes('folder')) labelText = '分類:';
else if (cls.includes('eye')) labelText = '瀏覽次數:';
else if (cls.includes('download')) labelText = '下載檔案:';
// --- 策略 B功能性按鈕 ---
var $container = $icon.closest('a, button');
if ($container.length > 0 && $container.text().trim() === '') {
var btnTitle = $container.attr('title');
if (btnTitle) labelText = btnTitle;
else if (cls.includes('search')) labelText = '搜尋';
else if (cls.includes('bars') || cls.includes('navicon')) labelText = '選單';
else if (cls.includes('print')) labelText = '列印此頁';
else if (cls.includes('share')) labelText = '分享至社群';
else if (cls.includes('close') || cls.includes('times')) labelText = '關閉視窗';
else if (cls.includes('image') || cls.includes('photo')) labelText = '顯示原始圖片';
}
// --- 3. 執行補強 ---
if (labelText !== '') {
$icon.after('<span class="sr-only">' + labelText + '</span>');
}
});
}
// 延遲執行確保內容渲染完成
setTimeout(smartFixIcons, 500);
@ -2918,6 +2960,24 @@ $(document).ready(function() {
$('a.fake_link').remove();
}
});
});
$(function() {
var target = document.getElementById('gallery-theater-stage');
if (!target) return;
var observer = new MutationObserver(function() {
var display = target.style.display;
if (display === 'block') {
$('.verticalhome').css('z-index', '2000');
} else if (display === 'none') {
$('.verticalhome').css('z-index', 'auto');
}
});
observer.observe(target, {
attributes : true,
attributeFilter: ['style']
});
});
// 執行 member等高計算目前改用flexbox故mark掉 by ika 20160105
// $(window).load(function() {

View File

@ -5,7 +5,9 @@ a[accesskey] {
margin-left: -0.9375em;
color: transparent ;
}
a[accesskey="C"]{
position: absolute!important;
}
#orbit-bar a[accesskey] {
color: #fff ;
margin-left: 0;

View File

@ -110,13 +110,13 @@
cursor: pointer;
z-index: 2;
font-weight: bold;
color: #6D6D6D;
color: #3f3f3f;
width: 100%;
position: relative;
display: block;
margin-bottom: 10px;
a{
color: #6D6D6D;
color: #3f3f3f;
}
&:hover{
background: radial-gradient(circle at 70% 80%, #66a9e2b3, transparent 60%), radial-gradient(circle at 1% 1%, #fb8f72, transparent 30%), radial-gradient(circle at 50% 50%, #3c78ff4d, transparent 70%), linear-gradient(135deg, #2b7bbe 0%, #00437c 80%, #fb8f72 100%);
@ -129,6 +129,7 @@
transform: translateY(-6px);
a{
color: #fff;
text-shadow: 0px 0px 9px #000000;
}
}
@ -195,7 +196,7 @@
width: 95%;
height: 95%;
background: #f8f8f8;
color: #6D6D6D;
color: #3f3f3f;
display: flex;
justify-content: center;
align-items: center;
@ -236,7 +237,7 @@
// background:linear-gradient(180deg, #ec6641 0, #e8f6ff 100%);
background: radial-gradient(circle at 60% 90%, #ffe6df, transparent 60%), radial-gradient(circle at 20% 10%, #f5bfb0de, transparent 25%), #ec66418b;
}
background:$theme-color-third;
background:#ff803d;
-webkit-transition: .3s all ease;
-o-transition: .3s all ease;
transition: .3s all ease;
@ -296,7 +297,7 @@
padding: 2em;
text-align: center;
margin: 0.8em;
color: #6D6D6D;
color: #3f3f3f;
display: flex;
justify-content: center;
align-items: center;

View File

@ -876,8 +876,7 @@ a.ui-state-default{
}
@media(max-width: 768px){
position: relative;
width: 80%;
float: left;
width: 100%;
}
@media(min-width:769px){
width: 100%;
@ -957,7 +956,7 @@ a.ui-state-default{
opacity: 1;
width: 100%;
@media(max-width:$screen-xs){
width: 150px;
}
}
.search-box.searching .btn-search {

View File

@ -39,7 +39,7 @@
margin-right: 1%;
margin-bottom: 0.5em;
cursor: pointer;
background: radial-gradient(circle at 60% 90%, #d44e27, transparent 60%), radial-gradient(circle at 10px 10px, #de552f, transparent 25%), #cc1c00;
background: radial-gradient(circle at 60% 90%, #d95c37, transparent 60%), radial-gradient(circle at 10px 10px, #e65c36, transparent 25%), #cc3d00;
border-radius: 2em;
color: #fff;
text-align: center;
@ -58,6 +58,7 @@
.sitemenu-link.level-1 {
margin-right: .25rem;
text-shadow: 0px 0px 8px #000000;
}
.sitemenu-dropdown-toggle {