v4.3 ui: 3D wooden bookshelf redesign, fix player cover aspect ratio, and smooth subtitle scroll

This commit is contained in:
Ashim Kumar
2026-07-03 18:43:07 +06:00
parent cf93085e22
commit 14d18fbad4
14 changed files with 1174 additions and 193 deletions

View File

@@ -1331,7 +1331,7 @@ body {
.project-thumb-overlay {
position: absolute;
inset: 0;
background: rgba(0,0,0,0.6);
background: rgba(0,0,0,0.62);
color: white;
display: flex;
flex-direction: column;
@@ -1340,15 +1340,38 @@ body {
opacity: 0;
transition: opacity 0.2s;
font-size: 0.7rem;
gap: 4px;
gap: 6px;
padding: 6px;
}
.project-thumb:hover .project-thumb-overlay {
opacity: 1;
}
.project-thumb-overlay i {
font-size: 1.2rem;
.thumb-action-btn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
width: 100%;
background: rgba(255,255,255,0.14);
border: 1px solid rgba(255,255,255,0.3);
color: white;
border-radius: 6px;
padding: 5px 4px;
font-size: 0.66rem;
font-weight: 600;
cursor: pointer;
transition: background 0.15s;
}
.thumb-action-btn:hover {
background: rgba(255,255,255,0.28);
}
.thumb-action-btn i {
font-size: 1rem;
}
.project-info-v2 {
@@ -1375,6 +1398,57 @@ body {
font-style: italic;
}
.project-public-link {
display: flex;
align-items: center;
gap: 4px;
margin-top: 6px;
font-size: 0.78rem;
color: var(--text-muted);
max-width: 100%;
}
.project-public-link > i {
color: var(--success-color);
flex-shrink: 0;
}
.project-public-link a {
color: var(--primary-color);
text-decoration: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 280px;
}
.project-public-link a:hover {
text-decoration: underline;
}
.link-copy-btn {
background: var(--bg-tertiary);
border: 1px solid var(--border-color);
color: var(--text-secondary);
border-radius: 5px;
width: 24px;
height: 24px;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
flex-shrink: 0;
font-size: 0.72rem;
transition: all 0.15s;
padding: 0;
}
.link-copy-btn:hover {
background: var(--primary-color);
color: white;
border-color: var(--primary-color);
}
.project-actions-v2 {
display: flex;
gap: 6px;