diff options
Diffstat (limited to 'src/main')
| -rw-r--r-- | src/main/resources/META-INF/resources/cms2/base.css | 13 | ||||
| -rw-r--r-- | src/main/resources/META-INF/resources/posts/postList.js | 15 | ||||
| -rw-r--r-- | src/main/resources/templates/benki/posts/postList.html | 21 |
3 files changed, 38 insertions, 11 deletions
diff --git a/src/main/resources/META-INF/resources/cms2/base.css b/src/main/resources/META-INF/resources/cms2/base.css index c455ce8..b165f1c 100644 --- a/src/main/resources/META-INF/resources/cms2/base.css +++ b/src/main/resources/META-INF/resources/cms2/base.css @@ -174,6 +174,7 @@ article.bookmark { font-size: smaller; margin: 0; padding: 0; + flex: auto; } article.lazychat-message { @@ -183,6 +184,10 @@ article.lazychat-message { background: #f0f8f0; } +article.lazychat-message > header { + display: flex +} + #bookmark-submission textarea { min-width: calc(100% - 12em); } @@ -196,6 +201,14 @@ elix-expandable-section.editor-pane::part(header) { display: inline-block; } +.lazychat-edit-button { + font-size: small; +} + +.lazychat-message-controls { + flex: initial; +} + .paging { display: flex; flex-direction: row; diff --git a/src/main/resources/META-INF/resources/posts/postList.js b/src/main/resources/META-INF/resources/posts/postList.js index 3eb23ce..7bab4f9 100644 --- a/src/main/resources/META-INF/resources/posts/postList.js +++ b/src/main/resources/META-INF/resources/posts/postList.js @@ -11,9 +11,16 @@ document.addEventListener('DOMContentLoaded', () => { lazychatSubmissionPane.addEventListener('opened',() => lazychatSubmissionForm.focus()); } - let lazychatEditorPanes = document.getElementsByClassName('lazychat-editor-pane'); - for (let pane of lazychatEditorPanes) { - let form = pane.getElementsByTagName('mlk-lazychat-submission-form')[0]; - pane.addEventListener('opened', () => form.focus()); + let lazychatMessages = document.getElementsByClassName('lazychat-message'); + for (let message of lazychatMessages) { + let editorPane = message.getElementsByClassName('lazychat-editor-pane')[0]; + if (editorPane) { + let form = message.getElementsByTagName('mlk-lazychat-submission-form')[0]; + let editButton = message.getElementsByClassName('lazychat-edit-button')[0]; + editButton.addEventListener('click', () => { + editorPane.toggle(); + form.focus(); + }); + } } }); diff --git a/src/main/resources/templates/benki/posts/postList.html b/src/main/resources/templates/benki/posts/postList.html index a66528b..3cd4e49 100644 --- a/src/main/resources/templates/benki/posts/postList.html +++ b/src/main/resources/templates/benki/posts/postList.html @@ -17,6 +17,8 @@ {#head} <link href="{feedUri}" rel="alternate" type="application/atom+xml" /> + <script type="module" src="/web_modules/elix/define/Button.js"></script> + <script type="module" src="/web_modules/elix/define/ExpandablePanel.js"></script> <script type="module" src="/web_modules/elix/define/ExpandableSection.js"></script> <script type="module" src="/bookmarks/MlkBookmarkSubmissionForm.js"></script> <script type="module" src="/lazychat/MlkLazychatSubmissionForm.js"></script> @@ -69,24 +71,29 @@ {#else} <article class="lazychat-message"> <header> - <div class="lazychat-message-info" style="display: inline-block"> + <div class="lazychat-message-info"> <time datetime="{date.htmlDateTime}">{date.humanDateTime}</time> <span class="lazychat-message-owner">{owner.firstName} {owner.lastName}</span> </div> + <div class="lazychat-message-controls"> + {#if showLazychatForm} + <button class="pure-button lazychat-edit-button">Edit</button> + {/if} + </div> + </header> + + <section class="lazychat-editor"> {#if showLazychatForm} - <elix-expandable-section class="lazychat-editor-pane editor-pane"> + <elix-expandable-panel class="lazychat-editor-pane editor-pane"> <mlk-lazychat-submission-form edited-id="{post.id}"></mlk-lazychat-submission-form> - </elix-expandable-section> + </elix-expandable-panel> {/if} - </header> + </section> <section class="lazychat-message-content"> {contentHtml.raw} </section> - - <section class="lazychat-editor"> - </section> </article> {/if} {/with} |