alexei.dolgolyov/wled-screen-controller-mixed
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Truncate long card titles with ellipsis and reduce font size

Browse Source 
- Replace flex-wrap with overflow ellipsis on .card-title and .template-name
- Reduce card title font size from 1.2rem/18px to 1.05rem
- Add title attribute (hover tooltip) on all card types for full name

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Admin
2026-03-13 02:08:47 +03:00
parent 561229a7fe
commit fe7fd8d539
8 changed files with 20 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
server/src/wled_controller/static/js/features/automations.js
View File

@@ -201,7 +201,7 @@ function createAutomationCard(automation, sceneMap = new Map()) {
removeTitle: t('common.delete'),
content: `
<div class="card-header">
<div class="card-title">
<div class="card-title" title="${escapeHtml(automation.name)}">
${escapeHtml(automation.name)}
<span class="badge badge-automation-${statusClass}">${statusText}</span>
</div>

2
server/src/wled_controller/static/js/features/color-strips.js
View File

@@ -1271,7 +1271,7 @@ export function createColorStripCard(source, pictureSourceMap, audioSourceMap) {
removeTitle: t('common.delete'),
content: `
<div class="card-header">
<div class="card-title">
<div class="card-title" title="${escapeHtml(source.name)}">
${icon} ${escapeHtml(source.name)}
</div>
</div>

2
server/src/wled_controller/static/js/features/devices.js
View File

@@ -107,7 +107,7 @@ export function createDeviceCard(device) {
removeTitle: t('device.button.remove'),
content: `
<div class="card-header">
<div class="card-title">
<div class="card-title" title="${escapeHtml(device.name || device.id)}">
<span class="health-dot ${healthClass}" title="${healthTitle}"></span>
${device.name || device.id}
${device.url && device.url.startsWith('http') ? `<a class="device-url-badge" href="${device.url}" target="_blank" rel="noopener" title="${t('device.button.webui')}"><span class="device-url-text">${escapeHtml(device.url.replace(/^https?:\/\//, ''))}</span><span class="device-url-icon">${ICON_WEB}</span></a>` : (device.url && !device.url.startsWith('mock://') && !device.url.startsWith('ws://') && !device.url.startsWith('openrgb://') && !device.url.startsWith('http') ? `<span class="device-url-badge"><span class="device-url-text">${escapeHtml(device.url)}</span></span>` : '')}

2
server/src/wled_controller/static/js/features/kc-targets.js
View File

@@ -222,7 +222,7 @@ export function createKCTargetCard(target, sourceMap, patternTemplateMap, valueS
removeTitle: t('common.delete'),
content: `
<div class="card-header">
<div class="card-title">
<div class="card-title" title="${escapeHtml(target.name)}">
${escapeHtml(target.name)}
</div>
</div>

2
server/src/wled_controller/static/js/features/scene-presets.js
View File

@@ -60,7 +60,7 @@ export function createSceneCard(preset) {
<button class="card-remove-btn" onclick="deleteScenePreset('${preset.id}', '${escapeHtml(preset.name)}')" title="${t('scenes.delete')}">&#x2715;</button>
</div>
<div class="card-header">
<div class="card-title">${escapeHtml(preset.name)}</div>
<div class="card-title" title="${escapeHtml(preset.name)}">${escapeHtml(preset.name)}</div>
</div>
${preset.description ? `<div class="card-subtitle"><span class="card-meta">${escapeHtml(preset.description)}</span></div>` : ''}
<div class="stream-card-props">

2
server/src/wled_controller/static/js/features/targets.js
View File

@@ -1001,7 +1001,7 @@ export function createTargetCard(target, deviceMap, colorStripSourceMap, valueSo
removeTitle: t('common.delete'),
content: `
<div class="card-header">
<div class="card-title">
<div class="card-title" title="${escapeHtml(target.name)}">
<span class="health-dot ${healthClass}" title="${healthTitle}"></span>
${escapeHtml(target.name)}
<span class="target-error-indicator" title="${t('device.metrics.errors')}">${ICON_WARNING}</span>