Skip to content

Commit e75adeb

Browse files
aFFekoppaFFekopp
committed
chore: bump version to 0.3.1
1 parent 85291bd commit e75adeb

File tree

5 files changed

+183
-89
lines changed

5 files changed

+183
-89
lines changed

‎static/css/styles.css‎

Lines changed: 39 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
:root {
1919
/* Primary Colors */
2020
--color-primary: #2E3A8C;
21+
--color-primary-rgb: 46, 58, 140;
2122
--color-primary-hover: #4A5FD9;
2223
--color-secondary: #4A5FD9;
2324
--color-navy: #1A2254;
@@ -98,6 +99,7 @@
9899
/* Dark Mode Variables */
99100
[data-theme="dark"] {
100101
--color-primary: #4A5FD9;
102+
--color-primary-rgb: 74, 95, 217;
101103
--color-primary-hover: #6B7FE8;
102104
--color-secondary: #2E3A8C;
103105
--color-navy: #E8EAFF;
@@ -944,9 +946,11 @@ a:hover {
944946
background: currentColor;
945947
}
946948

949+
/* Elevate active dropdowns above neighboring cards/items */
947950
/* Elevate active dropdowns above neighboring cards/items */
948951
.card:has(.dropdown.active),
949-
.library-list-item:has(.dropdown.active) {
952+
.library-list-item:has(.dropdown.active),
953+
.library-list-item.active-dropdown {
950954
z-index: 50;
951955
}
952956

@@ -1027,7 +1031,8 @@ a:hover {
10271031

10281032
.table {
10291033
width: 100%;
1030-
border-collapse: collapse;
1034+
border-collapse: separate;
1035+
border-spacing: 0;
10311036
}
10321037

10331038
.table th,
@@ -1042,6 +1047,17 @@ a:hover {
10421047
font-size: var(--font-size-small);
10431048
color: var(--text-secondary);
10441049
background: var(--bg-secondary);
1050+
border-bottom: none;
1051+
}
1052+
1053+
.table th:first-child {
1054+
border-top-left-radius: var(--radius-md);
1055+
border-bottom-left-radius: var(--radius-md);
1056+
}
1057+
1058+
.table th:last-child {
1059+
border-top-right-radius: var(--radius-md);
1060+
border-bottom-right-radius: var(--radius-md);
10451061
}
10461062

10471063
.table tbody tr:hover {
@@ -1405,7 +1421,9 @@ a:hover {
14051421
text-align: center;
14061422
}
14071423

1408-
.text-right {
1424+
.text-right,
1425+
th.text-right,
1426+
td.text-right {
14091427
text-align: right;
14101428
}
14111429

@@ -1469,6 +1487,10 @@ a:hover {
14691487
justify-content: center;
14701488
}
14711489

1490+
.justify-end {
1491+
justify-content: flex-end;
1492+
}
1493+
14721494
.gap-sm {
14731495
gap: var(--spacing-sm);
14741496
}
@@ -1520,7 +1542,6 @@ a:hover {
15201542
padding: var(--spacing-sm);
15211543
padding-bottom: calc(80px + env(safe-area-inset-bottom));
15221544
width: 100%;
1523-
overflow-x: hidden;
15241545
box-sizing: border-box;
15251546
}
15261547

@@ -2048,7 +2069,7 @@ a:hover {
20482069
display: none;
20492070
position: absolute;
20502071
z-index: 2000;
2051-
width: 320px;
2072+
width: 380px;
20522073
background: var(--bg-card);
20532074
border: 1px solid var(--color-border);
20542075
border-radius: var(--radius-lg);
@@ -2095,12 +2116,12 @@ a:hover {
20952116
display: flex;
20962117
gap: 4px;
20972118
overflow-x: auto;
2098-
scrollbar-width: none;
2119+
/* scrollbar-width: none; */
20992120
}
21002121

2101-
.emoji-picker-tabs::-webkit-scrollbar {
2102-
display: none;
2103-
}
2122+
/* .emoji-picker-tabs::-webkit-scrollbar {
2123+
display: block;
2124+
} */
21042125

21052126
.emoji-picker-tab {
21062127
padding: 6px 10px;
@@ -2130,7 +2151,7 @@ a:hover {
21302151
overflow-y: auto;
21312152
padding: var(--spacing-sm);
21322153
display: grid;
2133-
grid-template-columns: repeat(6, 1fr);
2154+
grid-template-columns: repeat(7, 1fr);
21342155
gap: 4px;
21352156
}
21362157

@@ -2197,4 +2218,12 @@ a:hover {
21972218
display: inline-flex !important;
21982219
align-items: center !important;
21992220
}
2221+
2222+
.emoji-picker-container {
2223+
width: 300px;
2224+
}
2225+
2226+
.emoji-picker-content {
2227+
grid-template-columns: repeat(6, 1fr);
2228+
}
22002229
}

‎static/js/emoji-picker.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -133,6 +133,7 @@ class EmojiPicker {
133133

134134
trigger.addEventListener('click', (e) => {
135135
e.stopPropagation();
136+
if (input.disabled) return;
136137
if (this.picker.classList.contains('active') && this.activeInput === input) {
137138
this.hide();
138139
} else {

‎templates/library.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -710,7 +710,7 @@ <h4 style="font-size: 1rem; line-height: 1.2; white-space: nowrap; overflow: hid
710710
function openItemModal(item = null) {
711711
document.getElementById('item-modal-title').textContent = item ? 'Edit Item' : 'Add Item';
712712
document.getElementById('edit-item-id').value = item?.id || '';
713-
document.getElementById('item-category').innerHTML = FretLogData.getCategories().map(c => `< option value = "${c.id}" ${item?.categoryId === c.id ? 'selected' : ''}> ${c.icon} ${c.name}</option > `).join('');
713+
document.getElementById('item-category').innerHTML = FretLogData.getCategories().map(c => `<option value="${c.id}" ${item?.categoryId === c.id ? 'selected' : ''}>${c.icon} ${c.name}</option>`).join('');
714714
populateArtistSelect(item?.artistId);
715715
document.getElementById('item-name').value = item?.name || '';
716716
selectedRating = item?.starRating || 0;
@@ -721,7 +721,7 @@ <h4 style="font-size: 1rem; line-height: 1.2; white-space: nowrap; overflow: hid
721721

722722
function populateArtistSelect(id = null) {
723723
document.getElementById('item-artist').innerHTML = '<option value="">Select artist...</option>' +
724-
FretLogData.getArtists().sort((a, b) => a.name.localeCompare(b.name)).map(a => `< option value = "${a.id}" ${id === a.id ? 'selected' : ''}> ${a.name}</option > `).join('');
724+
FretLogData.getArtists().sort((a, b) => a.name.localeCompare(b.name)).map(a => `<option value="${a.id}" ${id === a.id ? 'selected' : ''}>${a.name}</option>`).join('');
725725
}
726726

727727
function updateCategoryFields() {
@@ -759,8 +759,8 @@ <h4 style="font-size: 1rem; line-height: 1.2; white-space: nowrap; overflow: hid
759759
const counts = {}; FretLogData.getLibraryItems().forEach(i => { const aid = i.artistId || i.artist_id; if (aid) counts[aid] = (counts[aid] || 0) + 1; });
760760
list.innerHTML = FretLogData.getArtists().sort((a, b) => a.name.localeCompare(b.name)).map(a => {
761761
const c = counts[a.id] || 0;
762-
return `< div class="flex justify-between p-sm bg-card border rounded" ><div><strong>${a.name}</strong><br><small>${c} item${c !== 1 ? 's' : ''}</small></div>
763-
<div class="flex gap-xs"><button class="btn btn-ghost btn-sm" onclick="editArtistClick('${a.id}')">Ren</button><button class="btn btn-ghost btn-sm text-danger" onclick="deleteArtistClick('${a.id}')">Del</button></div></div >`;
762+
return `<div class="flex justify-between p-sm bg-card border rounded"><div><strong>${a.name}</strong><br><small>${c} item${c !== 1 ? 's' : ''}</small></div>
763+
<div class="flex gap-xs"><button class="btn btn-ghost btn-sm" onclick="editArtistClick('${a.id}')">Ren</button><button class="btn btn-ghost btn-sm text-danger" onclick="deleteArtistClick('${a.id}')">Del</button></div></div>`;
764764
}).join('');
765765
}
766766

‎templates/sessions.html‎

Lines changed: 41 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -430,11 +430,33 @@ <h3 class="modal-title">Delete Session?</h3>
430430

431431
function toggleItemMenu(e, btn) {
432432
e.stopPropagation();
433-
const menu = btn.nextElementSibling;
434-
document.querySelectorAll('.dropdown-menu.active').forEach(m => { if (m !== menu) m.classList.remove('active'); });
435-
menu.parentElement.classList.toggle('active');
433+
const menu = btn.parentElement; // The .dropdown div
434+
const currentActive = menu.classList.contains('active');
435+
436+
// Close all other dropdowns
437+
document.querySelectorAll('.dropdown.active').forEach(d => {
438+
d.classList.remove('active');
439+
const item = d.closest('.library-list-item');
440+
if (item) item.classList.remove('active-dropdown');
441+
});
442+
443+
// Toggle current
444+
if (!currentActive) {
445+
menu.classList.add('active');
446+
const item = menu.closest('.library-list-item');
447+
if (item) item.classList.add('active-dropdown');
448+
}
436449
}
437450

451+
// Close dropdowns when clicking outside
452+
document.addEventListener('click', () => {
453+
document.querySelectorAll('.dropdown.active').forEach(d => {
454+
d.classList.remove('active');
455+
const item = d.closest('.library-list-item');
456+
if (item) item.classList.remove('active-dropdown');
457+
});
458+
});
459+
438460
// Instrument hook for base.html
439461
window.onInstrumentChange = () => {
440462
filterSessions();
@@ -534,20 +556,22 @@ <h3 class="modal-title">Delete Session?</h3>
534556
return `
535557
<div class="library-list-item" style="cursor: pointer; padding-left: var(--spacing-md); padding-top: 10px; padding-bottom: 10px;" onclick="viewSession('${session.id}')">
536558
<div class="item-info">
537-
<div class="flex items-center gap-sm mb-sm">
538-
<span class="font-bold text-primary">${formatTableDate(session.endTime || session.date)}</span>
539-
<span class="text-secondary" style="font-size: 0.85rem;">at ${formatTableTime(session.endTime || session.date)}</span>
540-
</div>
541-
<div class="flex items-center gap-sm">
542-
<span style="font-size: 0.9rem;">${instrument?.icon || '🎸'} ${instrument?.name || 'Unknown'}</span>
543-
<span class="badge badge-secondary" style="font-size: 0.7rem; padding: 1px 6px;">${itemCount} items</span>
544-
<span class="badge badge-${statusClass}" style="font-size: 0.7rem; padding: 1px 6px;">${statusLabel}</span>
545-
${session.notes ? `
546-
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="opacity: 0.5;">
547-
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
548-
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
549-
</svg>
550-
` : ''}
559+
<div class="flex items-center gap-md flex-wrap">
560+
<div class="flex items-center gap-sm">
561+
<span class="font-bold text-primary">${formatTableDate(session.endTime || session.date)}</span>
562+
<span class="text-secondary" style="font-size: 0.85rem;">at ${formatTableTime(session.endTime || session.date)}</span>
563+
</div>
564+
<div class="flex items-center gap-sm">
565+
<span style="font-size: 0.9rem;">${instrument?.icon || '🎸'} ${instrument?.name || 'Unknown'}</span>
566+
<span class="badge badge-secondary" style="font-size: 0.7rem; padding: 1px 6px;">${itemCount} items</span>
567+
<span class="badge badge-${statusClass}" style="font-size: 0.7rem; padding: 1px 6px;">${statusLabel}</span>
568+
${session.notes ? `
569+
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="opacity: 0.5;">
570+
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
571+
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
572+
</svg>
573+
` : ''}
574+
</div>
551575
</div>
552576
</div>
553577
<div class="time-column text-right">

0 commit comments

Comments
 (0)