github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-06-05 14:07:30 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: Replace href cancel with DButton (#31138)

Browse Source
This commit is contained in:
Jordan Vidrine
2025-02-03 16:24:53 -06:00
committed by GitHub
parent 0ad05e022f
commit 585c2b9ed3
5 changed files with 26 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
app/assets/javascripts/discourse/app/components/composer-container.hbs
View File

@ -239,25 +239,21 @@
/> />
{{#if this.site.mobileView}} {{#if this.site.mobileView}}
<a <DButton
href @action={{this.composer.cancel}}
{{on "click" this.composer.cancel}} class="cancel btn-transparent"
title={{i18n "cancel"}} @icon={{if this.composer.canEdit "xmark" "trash-can"}}
class="cancel" @preventFocus={{true}}
> @title="close"
{{#if this.composer.canEdit}} />
{{d-icon "xmark"}}
{{else}}
{{d-icon "trash-can"}}
{{/if}}
</a>
{{else}} {{else}}
<a <DButton
href @action={{this.composer.cancel}}
{{on "click" this.composer.cancel}} class="cancel btn-transparent"
class="cancel" @preventFocus={{true}}
role="button" @title="close"
>{{i18n "close"}}</a> @label="close"
/>
{{/if}} {{/if}}
{{#if this.site.mobileView}} {{#if this.site.mobileView}}

4
app/assets/javascripts/discourse/tests/acceptance/composer-test.js
View File

@ -214,7 +214,7 @@ acceptance("Composer", function (needs) {
"supports keyboard shortcuts" "supports keyboard shortcuts"
); );
await click("#reply-control a.cancel"); await click("#reply-control button.cancel");
assert.dom(".d-modal").exists("pops up a confirmation dialog"); assert.dom(".d-modal").exists("pops up a confirmation dialog");
await click(".d-modal__footer .discard-draft"); await click(".d-modal__footer .discard-draft");
@ -776,7 +776,7 @@ acceptance("Composer", function (needs) {
await visit("/t/topic-with-whisper/960"); await visit("/t/topic-with-whisper/960");
await click(".topic-post:nth-of-type(3) button.reply"); await click(".topic-post:nth-of-type(3) button.reply");
await click("#reply-control .save-or-cancel a.cancel"); await click("#reply-control .save-or-cancel button.cancel");
await click(".topic-footer-main-buttons button.create"); await click(".topic-footer-main-buttons button.create");
await click(".reply-details summary div"); await click(".reply-details summary div");
assert assert

8
app/assets/stylesheets/common/base/compose.scss
View File

@ -387,16 +387,22 @@ html.composer-open {
.cancel { .cancel {
align-items: center; align-items: center;
display: flex; display: flex;
margin-left: 1.25em; margin-left: 1em;
line-height: normal; line-height: normal;
color: var(--primary-high); color: var(--primary-high);
transition: color 250ms; transition: color 250ms;
padding: 0;
&:hover, &:hover,
&:focus { &:focus {
outline: none; outline: none;
color: var(--danger); color: var(--danger);
} }
&:active {
background-color: transparent;
background-image: none;
}
} }
.preview-template { .preview-template {

4
app/assets/stylesheets/common/components/buttons.scss
View File

@ -435,8 +435,8 @@
} }
.btn-transparent { .btn-transparent {
&, &.btn-default,
&.btn-default { &.btn-text {
background: transparent; background: transparent;
border: 0; border: 0;
color: var(--primary); color: var(--primary);

3
app/assets/stylesheets/mobile/compose.scss
View File

@ -94,10 +94,9 @@
margin-left: 6px; margin-left: 6px;
} }
.cancel { .cancel .d-icon {
font-size: 1.4em; font-size: 1.4em;
color: var(--primary-low-mid); color: var(--primary-low-mid);
margin-left: 0.6em;
padding: 3px 6px; padding: 3px 6px;
} }
} }