update
This commit is contained in:
parent
de69a08815
commit
269f215855
|
|
@ -4,7 +4,7 @@
|
|||
@import "variables";
|
||||
|
||||
.fa-classic, .fa-regular, .fa-solid, .far, .fas ,.fa{
|
||||
font-family: var(--fa-style-family, "FontAwesome");
|
||||
font-family: "FontAwesome";
|
||||
}
|
||||
#orbit-bar .orbit-bar-inner > label:focus, #orbit-bar .orbit-bar-inner > label.focus{
|
||||
.orbit-bar-search-sign-language{
|
||||
|
|
|
|||
|
|
@ -6,6 +6,11 @@
|
|||
color: #333!important;
|
||||
}
|
||||
}
|
||||
.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;
|
||||
|
|
|
|||
|
|
@ -2580,12 +2580,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 {
|
||||
|
|
@ -2593,6 +2587,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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -151,15 +151,18 @@
|
|||
.i-archive-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
.link{
|
||||
background-color: #1273eb; margin-right: 0.5em;}
|
||||
.txt { background-color: #6dbb73; margin-right: 0.5em;}
|
||||
.xlsx { background-color: #bb6d7f; margin-right: 0.5em;}
|
||||
.pdf { background-color: #3b8347; margin-right: 0.5em;}
|
||||
.docx { background-color: #846dbb; margin-right: 0.5em;}
|
||||
.pptx { background-color: #6d77bb; margin-right: 0.5em;}
|
||||
.jpg { background-color: #bb6d6d; margin-right: 0.5em;}
|
||||
.zip { background-color: #dcb957; margin-right: 0.5em;}
|
||||
.link { background-color: #1368d4 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.txt { background-color: #3a8a40 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.xlsx { background-color: #9e3050 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.pdf { background-color: #2a7d36 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.docx { background-color: #5e46a0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.doc { background-color: #1368d4 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.pptx { background-color: #3d4aa0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.jpg { background-color: #8f3333 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.zip { background-color: #8a6400 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.rar { background-color: #9e5000 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.xls { background-color: #3a8a40 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.odt { background-color: #767676 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th{
|
||||
// border-top: 0.0625em solid #ddd;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,9 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
<ul class="w-ba-banner__pager-2 banner-pager banner_caption_{{subpart-id}}"></ul>
|
||||
<div class="w-ad-banner__pager-2 w-ba-banner__caption banner-pager banner_caption_{{subpart-id}}" data-list="images" data-level="0">
|
||||
<li><button title="Slide {{slide_number}}" aria-label="Pager"><span style="display: none;">Slide {{slide_number}}</span></button></li>
|
||||
</div>
|
||||
<ul class="controlplay" role="radiogroup" aria-label="播放控制選項">
|
||||
<a role="radio" aria-checked="true" href="javascript:;" class="resume-slide active" title="繼續播放" aria-label="繼續播放" aria-live="assertive">
|
||||
<i aria-hidden="true"></i>
|
||||
|
|
|
|||
|
|
@ -17,8 +17,8 @@
|
|||
<dl class="i-archive__file-list" data-list="files" data-level="2">
|
||||
<dd class="i-archive__file-wrap">
|
||||
<i class="fa-solid fa-file"></i>
|
||||
<a class="i-archive__file-name" href="{{file-url}}" target="{{target}}" title="{{file-name}}">{{file-name}}</a>
|
||||
<a href="{{file-url}}" class="i-archive-files-item" target="_blank" data-toggle="tooltip" data-placement="bottom" title="{{file-name}}"><span class="label label-primary">{{file-type}}</span></a>
|
||||
<a class="i-archive__file-name" href="{{file-url}}" target="{{target}}" title="{{file-name}}">{{file-name}}<span class="label label-primary">{{file-type}}</span></a>
|
||||
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,29 +4,35 @@
|
|||
</h3>
|
||||
<ul class="archive-categories nav nav-tabs" role="tablist" data-list="categories" data-level="0" data-no-edit="true">
|
||||
<li class="nav-item {{active_class}}" role="presentation">
|
||||
<a href="#{{category-id}}" role="tab" data-toggle="tab" title="{{category-title}}" >{{category-title}}</a>
|
||||
<a href="#{{category-id}}"
|
||||
role="tab"
|
||||
id="{{category-id}}-tab"
|
||||
data-toggle="tab"
|
||||
title="{{category-title}}"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="{{category-id}}">{{category-title}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content" data-list="categories" data-level="0">
|
||||
<div class="tab-pane {{active_class}}" id="{{category-id}}" role="tabpanel" aria-labelledby="{{category-id}}-tab">
|
||||
<ul class="archives-ul" data-list="archives" data-level="1">
|
||||
<li class="archive-li">
|
||||
<div class="i-archive__item-wrap">
|
||||
<dt class="i-archive__category-item">
|
||||
<span class="i-archive__status-wrap" data-list="statuses" data-level="2">
|
||||
<span class="i-archive__status label status {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<span class="i-archive__archive-title">{{archive-title}}</span>
|
||||
<span class="description" style="margin-top: 0.5em;clear: both;width: 100%;position: relative;display: block;">{{description}}</span>
|
||||
</dt>
|
||||
<dl class="i-archive__file-list" data-list="files" data-level="2">
|
||||
<dd class="i-archive__file-wrap">
|
||||
<i class="fa-solid fa-file"></i>
|
||||
<a class="i-archive__file-name" href="{{file-url}}" target="{{target}}" title="{{file-name}}">{{file-name}}</a>
|
||||
<a href="{{file-url}}" class="i-archive-files-item" target="_blank" data-toggle="tooltip" data-placement="bottom" title="{{file-name}}"><span class="label label-primary">{{file-type}}</span></a>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="i-archive__item-wrap">
|
||||
<dt class="i-archive__category-item">
|
||||
<span class="i-archive__status-wrap" data-list="statuses" data-level="2">
|
||||
<span class="i-archive__status label status {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<span class="i-archive__archive-title">{{archive-title}}</span>
|
||||
<span class="description" style="margin-top: 0.5em;clear: both;width: 100%;position: relative;display: block;">{{description}}</span>
|
||||
</dt>
|
||||
<dl class="i-archive__file-list" data-list="files" data-level="2">
|
||||
<dd class="i-archive__file-wrap">
|
||||
<i class="fa-solid fa-file"></i>
|
||||
<a class="i-archive__file-name" href="{{file-url}}" target="{{target}}" title="{{file-name}}">{{file-name}}<span class="label label-primary">{{file-type}}</span></a>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
{{link_to_edit}}
|
||||
|
|
@ -51,23 +57,93 @@
|
|||
padding: 1em;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
}
|
||||
}
|
||||
.i-archive__file-wrap {
|
||||
font-size: 1.2em;
|
||||
margin: 0;
|
||||
padding: 0.5em 0 0;
|
||||
border-radius: 0.125em;
|
||||
}
|
||||
.archive-li{
|
||||
list-style: none;
|
||||
.archive-li {
|
||||
list-style: none;
|
||||
}
|
||||
.archives-ul {
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
background: #eaeef0;
|
||||
padding: 1em;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
.index-archive-15 .archive-description{
|
||||
.archives-ul {
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
background: #eaeef0;
|
||||
padding: 1em;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
.index-archive-15 .archive-description {
|
||||
color: #9b9b9b;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
/* 非 active 的 tab-pane 內容從 Tab 順序移除 */
|
||||
.tab-pane:not(.active) {
|
||||
display: none;
|
||||
}
|
||||
.tab-pane:not(.active) a,
|
||||
.tab-pane:not(.active) button,
|
||||
.tab-pane:not(.active) input {
|
||||
tabindex: -1;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
var $tablist = $('.index-archive-15 [role="tablist"]');
|
||||
var $tabs = $tablist.find('[role="tab"]');
|
||||
|
||||
// 初始化:第一個 tab active,其他 tabindex=-1
|
||||
$tabs.each(function (i) {
|
||||
if (i === 0) {
|
||||
$(this).attr({ 'tabindex': '0', 'aria-selected': 'true' });
|
||||
} else {
|
||||
$(this).attr({ 'tabindex': '-1', 'aria-selected': 'false' });
|
||||
}
|
||||
});
|
||||
|
||||
// 非 active 的 tab-pane 內的連結設 tabindex="-1"
|
||||
function updatePaneTabindex() {
|
||||
$('.index-archive-15 .tab-pane').each(function () {
|
||||
var isActive = $(this).hasClass('active');
|
||||
$(this).find('a, button, input').attr('tabindex', isActive ? '0' : '-1');
|
||||
});
|
||||
}
|
||||
updatePaneTabindex();
|
||||
|
||||
// 方向鍵切換 tab
|
||||
$tabs.on('keydown', function (e) {
|
||||
var $current = $(this);
|
||||
var index = $tabs.index($current);
|
||||
var $target;
|
||||
|
||||
if (e.keyCode === 39 || e.keyCode === 40) {
|
||||
// 右或下:下一個 tab
|
||||
e.preventDefault();
|
||||
$target = $tabs.eq((index + 1) % $tabs.length);
|
||||
} else if (e.keyCode === 37 || e.keyCode === 38) {
|
||||
// 左或上:上一個 tab
|
||||
e.preventDefault();
|
||||
$target = $tabs.eq((index - 1 + $tabs.length) % $tabs.length);
|
||||
} else if (e.keyCode === 13 || e.keyCode === 32) {
|
||||
// Enter 或 Space:觸發點擊
|
||||
e.preventDefault();
|
||||
$current.trigger('click');
|
||||
return;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
// 更新 tabindex 和 aria-selected
|
||||
$tabs.attr({ 'tabindex': '-1', 'aria-selected': 'false' });
|
||||
$target.attr({ 'tabindex': '0', 'aria-selected': 'true' });
|
||||
$target.focus().trigger('click');
|
||||
});
|
||||
|
||||
// 點擊 tab 切換後同步 tabindex
|
||||
$tabs.on('click', function () {
|
||||
$tabs.attr({ 'tabindex': '-1', 'aria-selected': 'false' });
|
||||
$(this).attr({ 'tabindex': '0', 'aria-selected': 'true' });
|
||||
setTimeout(updatePaneTabindex, 50);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Loading…
Reference in New Issue