jfork/octane-website
1
0
Fork 0
mirror of https://github.com/nfonteyne/octane-website.git synced 2026-09-03 23:24:48 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

update: autosearch for musics

Browse source
This commit is contained in:
Nathan FONTEYNE 2026-07-08 14:46:48 +02:00
parent 9426b73940
commit 6d8fe814b0
12 changed files with 380 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

61
public/css/style.css
View file

@ -289,6 +289,17 @@ h3 { font-size: 1rem; margin: 0 0 0.5rem; }
margin: 0 0 1.5rem;
}
.section-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
flex-wrap: wrap;
margin: 2.25rem 0 0.75rem;
}
.section-header h2 { margin: 0; }
/* ---------- Cards / grids ---------- */
.card-grid {
@ -491,6 +502,56 @@ form.stacked-form label {
gap: 0.3rem;
}
/* ---------- Title autocomplete (add song) ---------- */
.autocomplete-wrapper { position: relative; }
.autocomplete-dropdown {
position: absolute;
top: 100%;
left: 0;
right: 0;
margin-top: 0.25rem;
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-sm);
box-shadow: var(--shadow);
max-height: 260px;
overflow-y: auto;
z-index: 30;
}
.autocomplete-item {
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.45rem 0.6rem;
cursor: pointer;
font-size: 0.85rem;
}
.autocomplete-item:hover,
.autocomplete-item.active {
background: var(--surface-alt);
}
.autocomplete-item img,
.autocomplete-thumb-placeholder {
width: 32px;
height: 32px;
border-radius: 6px;
object-fit: cover;
flex: 0 0 auto;
}
.autocomplete-thumb-placeholder {
display: flex;
align-items: center;
justify-content: center;
background: var(--surface-alt);
color: var(--muted);
}
input, select, textarea {
font: inherit;
padding: 0.5rem 0.65rem;