mirror of
https://github.com/LibreSpark/LibreTV.git
synced 2026-05-07 06:06:43 +08:00
优化卡片内容高度和标题显示
This commit is contained in:
@@ -47,44 +47,18 @@ button, .card-hover {
|
||||
|
||||
/* 确保卡片内容区域高度一致性 */
|
||||
.card-hover .flex-grow {
|
||||
height: 90px; /* 固定高度替代最小高度 */
|
||||
min-height: 90px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between; /* 均匀分布内容 */
|
||||
}
|
||||
|
||||
/* 针对不同长度的标题优化显示 */
|
||||
.card-hover h3 {
|
||||
height: 3rem; /* 固定高度替代最小高度 */
|
||||
min-height: 3rem;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2; /* 限制两行 */
|
||||
word-break: break-word; /* 支持长单词换行 */
|
||||
text-align: center;
|
||||
transition: all 0.3s ease;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 添加悬停提示效果 */
|
||||
.card-hover h3:hover::after {
|
||||
content: attr(title);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: -40px;
|
||||
background: rgba(0, 0, 0, 0.9);
|
||||
color: white;
|
||||
border-radius: 4px;
|
||||
padding: 6px 8px;
|
||||
font-size: 0.8rem;
|
||||
white-space: normal;
|
||||
max-width: 200px;
|
||||
z-index: 10;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
transform: translateY(5px);
|
||||
animation: fadeIn 0.2s forwards 0.3s;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
|
||||
.card-hover::before {
|
||||
|
||||
18
js/app.js
18
js/app.js
@@ -634,24 +634,26 @@ async function search() {
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (!data || !data.list || !Array.isArray(data.list)) {
|
||||
if (!data || !data.list || !Array.isArray(data.list) || data.list.length === 0) {
|
||||
return [];
|
||||
}
|
||||
|
||||
// 为每个搜索结果添加来源信息和API URL
|
||||
return data.list.map(item => ({
|
||||
// 添加源信息到每个结果
|
||||
const results = data.list.map(item => ({
|
||||
...item,
|
||||
source_name: apiName,
|
||||
source_code: apiId,
|
||||
api_url: apiUrl
|
||||
api_url: apiId.startsWith('custom_') ? getCustomApiInfo(apiId.replace('custom_', ''))?.url : undefined
|
||||
}));
|
||||
|
||||
return results;
|
||||
} catch (error) {
|
||||
console.error(`API ${apiId} 搜索错误:`, error);
|
||||
console.warn(`API ${apiId} 搜索失败:`, error);
|
||||
return [];
|
||||
}
|
||||
});
|
||||
|
||||
// 并行处理所有API搜索
|
||||
// 等待所有搜索请求完成
|
||||
const resultsArray = await Promise.all(searchPromises);
|
||||
|
||||
// 合并所有结果
|
||||
@@ -705,7 +707,7 @@ async function search() {
|
||||
return !banned.some(keyword => typeName.includes(keyword));
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// 添加XSS保护,使用textContent和属性转义
|
||||
resultsDiv.innerHTML = allResults.map(item => {
|
||||
const safeId = item.vod_id ? item.vod_id.toString().replace(/[^\w-]/g, '') : '';
|
||||
@@ -739,7 +741,7 @@ async function search() {
|
||||
|
||||
<div class="p-2 flex flex-col flex-grow">
|
||||
<div class="flex-grow">
|
||||
<h3 class="text-sm font-semibold mb-1 break-words text-center" title="${safeName}">${safeName}</h3>
|
||||
<h3 class="text-sm font-semibold mb-1 break-words line-clamp-2 text-center" title="${safeName}">${safeName}</h3>
|
||||
|
||||
<div class="flex flex-wrap justify-center gap-1 mb-1">
|
||||
${(item.type_name || '').toString().replace(/</g, '<') ?
|
||||
|
||||
Reference in New Issue
Block a user