diff --git a/CHANGELOG.md b/CHANGELOG.md
index e057c21..2f533a6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,8 @@ extension (`extension/manifest.json`).
### Changed
+- Clearer collections empty state in the popup, with focus on the name field when creating a collection
+
### Fixed
## [1.0.1] - 2026-08-24
diff --git a/extension/popup/popup.css b/extension/popup/popup.css
index 23d02c7..f35ea1a 100644
--- a/extension/popup/popup.css
+++ b/extension/popup/popup.css
@@ -428,6 +428,11 @@ body {
font-size: 0.88rem;
}
+.empty-guide strong {
+ color: var(--ink);
+ font-weight: 700;
+}
+
.empty-steps {
margin: 0 0 14px;
padding-left: 1.2rem;
diff --git a/extension/popup/popup.html b/extension/popup/popup.html
index dcbf7ac..4441934 100644
--- a/extension/popup/popup.html
+++ b/extension/popup/popup.html
@@ -114,7 +114,7 @@
Sign in
diff --git a/extension/popup/popup.js b/extension/popup/popup.js
index a95a67d..018116c 100644
--- a/extension/popup/popup.js
+++ b/extension/popup/popup.js
@@ -228,6 +228,13 @@ async function loadLibrary() {
fillCollectionSelect();
}
+function focusComposerField(type = composerType) {
+ const field = type === 'collection'
+ ? $('#collection-name')
+ : addForm.elements.title;
+ field?.focus();
+}
+
function openComposer(type = 'bookmark') {
hideCollectionComposer();
editingBookmarkId = null;
@@ -237,8 +244,7 @@ function openComposer(type = 'bookmark') {
setComposerType(type);
fillCollectionSelect();
addForm.scrollIntoView({ block: 'nearest' });
- const focusEl = type === 'collection' ? addForm.elements.name : addForm.elements.title;
- focusEl?.focus();
+ focusComposerField(type);
}
function openCollectionComposer() {
@@ -400,6 +406,7 @@ addForm.querySelectorAll('.composer-tab').forEach((tab) => {
tab.addEventListener('click', () => {
if (editingBookmarkId) return;
setComposerType(tab.dataset.type);
+ focusComposerField(tab.dataset.type);
});
});