2 files changed, 11 insertions, 5 deletions
diff --git a/src/main/resources/META-INF/resources/bookmarks/bookmarkList.js b/src/main/resources/META-INF/resources/bookmarks/bookmarkList.js
new file mode 100644
index 0000000..eab07f5
--- /dev/null
+++ b/src/main/resources/META-INF/resources/bookmarks/bookmarkList.js
@@ -0,0 +1,5 @@
+document.addEventListener('DOMContentLoaded', () => {
+  let bookmarkSubmissionPane = document.getElementById('bookmark-submission-pane');
+  let uriInput = document.getElementById('uri-input');
+  bookmarkSubmissionPane.addEventListener('opened', () => uriInput.focus());
+});
+\ No newline at end of file
diff --git a/src/main/resources/templates/benki/bookmarks/bookmarkList.html b/src/main/resources/templates/benki/bookmarks/bookmarkList.html
index 8242cd8..9f7b402 100644
--- a/src/main/resources/templates/benki/bookmarks/bookmarkList.html
+++ b/src/main/resources/templates/benki/bookmarks/bookmarkList.html
@@ -13,7 +13,8 @@
 
 {! #if authenticated !}
   <script type="module" src="/web_modules/elix/define/ExpandableSection.js"></script>
-  <elix-expandable-section>
+  <script type="module" src="/bookmarks/bookmarkList.js" defer></script>
+  <elix-expandable-section id="bookmark-submission-pane">
     <h2 slot="header" class="small-title"><button class="pure-button">Create New Bookmark</button></h2>
     <section id="bookmark-submission">
       <form class="pure-form pure-form-aligned" method="post">
@@ -21,13 +22,13 @@
           <legend>New Bookmark</legend>
 
           <div class="pure-control-group">
-            <label for="title-input">Title:</label>
-            <input name="title" id="title-input" type="text" placeholder="Title" required/>
+            <label for="uri-input">URI:</label>
+            <input name="uri" id="uri-input" type="text" placeholder="URI" required/>
           </div>
 
           <div class="pure-control-group">
-            <label for="uri-input">URI:</label>
-            <input name="uri" id="uri-input" type="text" placeholder="URI" required/>
+            <label for="title-input">Title:</label>
+            <input name="title" id="title-input" type="text" placeholder="Title" required/>
           </div>
 
           <div class="pure-control-group">