UI: minor tweaks to insert-hyplink modal (#12871)

- ensures footer buttons are aligned
- prevents focus on close button to be much larger than it should be, note that this fix could impact other modals but the current solution is not working, so better fix it differently if needed
This commit is contained in:
Joffrey JAFFEUX 2021-04-28 17:21:23 +02:00 committed by GitHub
parent cd93d1b5f7
commit 8be0191ffc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 10 deletions

View File

@ -1,5 +1,5 @@
<form {{action "ok" on="submit"}}>
{{#d-modal-body title="composer.link_dialog_title" class="insert-link"}}
{{#d-modal-body title="composer.link_dialog_title" class="insert-link"}}
<form id="insert-hyperlink-form" {{action "ok" on="submit"}}>
<div class="inputs">
{{text-field
value=linkUrl
@ -18,7 +18,8 @@
class="search-link"
href={{result.url}}
onclick={{action "linkClick"}}
data-title={{result.fancy_title}}>
data-title={{result.fancy_title}}
>
{{topic-status topic=result disableActions=true}}
{{replace-emoji result.fancy_title}}
<div class="search-category">
@ -36,10 +37,21 @@
<div class="inputs">
{{text-field value=linkText placeholderKey="composer.link_optional_text" class="link-text"}}
</div>
{{/d-modal-body}}
</form>
{{/d-modal-body}}
<div class="modal-footer">
{{d-button class="btn-primary" label="composer.modal_ok" action=(action "ok") type="submit"}}
{{d-button class="btn-danger" label="composer.modal_cancel" action=(action "cancel")}}
</div>
</form>
<div class="modal-footer">
{{d-button
class="btn-primary"
label="composer.modal_ok"
action=(action "ok")
type="submit"
form="insert-hyperlink-form"
}}
{{d-button
class="btn-danger"
label="composer.modal_cancel"
action=(action "cancel")
}}
</div>

View File

@ -73,7 +73,7 @@
.modal-close {
order: 2;
margin-left: auto;
padding-left: 2em;
.close {
color: var(--primary-high);
}