Hide bookmark submission form by default.
Change-Id: I542d39164297afa70d66102bd7db0bf064df9e02
diff --git a/src/main/resources/META-INF/resources/cms2/base.css b/src/main/resources/META-INF/resources/cms2/base.css
index 735b297..ebfeeca 100644
--- a/src/main/resources/META-INF/resources/cms2/base.css
+++ b/src/main/resources/META-INF/resources/cms2/base.css
@@ -77,6 +77,10 @@
font-size: 1em;
}
+.small-title {
+ font-size: 1em;
+}
+
body > nav {
grid-area: navbar;
diff --git a/src/main/resources/templates/benki/bookmarks/bookmarkList.html b/src/main/resources/templates/benki/bookmarks/bookmarkList.html
index 9d4c706..270a789 100644
--- a/src/main/resources/templates/benki/bookmarks/bookmarkList.html
+++ b/src/main/resources/templates/benki/bookmarks/bookmarkList.html
@@ -12,41 +12,45 @@
{#body}
{#if authenticated}
- <section id="bookmark-submission">
- <form class="pure-form pure-form-aligned" method="post">
- <fieldset>
- <legend>Submit Bookmark</legend>
+ <script type="module" src="/web_modules/elix/define/ExpandableSection.js"></script>
+ <elix-expandable-section>
+ <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">
+ <fieldset>
+ <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/>
- </div>
+ <div class="pure-control-group">
+ <label for="title-input">Title:</label>
+ <input name="title" id="title-input" type="text" placeholder="Title" required/>
+ </div>
- <div class="pure-control-group">
- <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/>
+ </div>
- <div class="pure-control-group">
- <label for="description-input">Description:</label>
- <textarea name="description" id="description-input" placeholder="Description"></textarea>
- </div>
+ <div class="pure-control-group">
+ <label for="description-input">Description:</label>
+ <textarea name="description" id="description-input" placeholder="Description"></textarea>
+ </div>
- <div class="pure-control-group">
- <label for="visibility-input">Visibility:</label>
- <select id="visibility-input" name="visibility" required>
- <option value="public">Public</option>
- <option value="semiprivate" selected>Semiprivate</option>
- <option value="private">Private</option>
- </select>
- </div>
+ <div class="pure-control-group">
+ <label for="visibility-input">Visibility:</label>
+ <select id="visibility-input" name="visibility" required>
+ <option value="public">Public</option>
+ <option value="semiprivate" selected>Semiprivate</option>
+ <option value="private">Private</option>
+ </select>
+ </div>
- <div class="pure-controls">
- <button type="submit" class="pure-button pure-button-primary">Submit Bookmark</button>
- </div>
- </fieldset>
- </form>
- </section>
+ <div class="pure-controls">
+ <button type="submit" class="pure-button pure-button-primary">Submit Bookmark</button>
+ </div>
+ </fieldset>
+ </form>
+ </section>
+ </elix-expandable-section>
{/if}
{#for bookmark in bookmarks}