FIX: Show tag chooser in composer for PM on mobile (#22241)

This was not displayed on mobile due to space constraints. With better
organization of the title, category and tags inputs, it can be
displayed.
This commit is contained in:
Bianca Nenciu 2023-06-26 20:12:32 +03:00 committed by GitHub
parent 0ca6f0cdb0
commit 4bb4be958c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 10 additions and 23 deletions

View File

@ -26,7 +26,12 @@
role="form" role="form"
aria-label={{I18n this.composer.saveLabel}} aria-label={{I18n this.composer.saveLabel}}
class="reply-area class="reply-area
{{if this.composer.canEditTags 'with-tags' 'without-tags'}}" {{if this.composer.canEditTags 'with-tags' 'without-tags'}}
{{if
this.composer.model.showCategoryChooser
'with-category'
'without-category'
}}"
> >
<span class="composer-open-plugin-outlet-container"> <span class="composer-open-plugin-outlet-container">
<PluginOutlet <PluginOutlet

View File

@ -237,10 +237,6 @@ export default class ComposerController extends Controller {
@discourseComputed("model.canEditTitle", "model.creatingPrivateMessage") @discourseComputed("model.canEditTitle", "model.creatingPrivateMessage")
canEditTags(canEditTitle, creatingPrivateMessage) { canEditTags(canEditTitle, creatingPrivateMessage) {
if (creatingPrivateMessage && this.site.mobileView) {
return false;
}
const isPrivateMessage = const isPrivateMessage =
creatingPrivateMessage || this.get("model.topic.isPrivateMessage"); creatingPrivateMessage || this.get("model.topic.isPrivateMessage");

View File

@ -963,10 +963,10 @@ acceptance(
can_tag_topics: true, can_tag_topics: true,
}); });
test("tags are not present on private messages - Mobile mode", async function (assert) { test("tags are present on private messages - Mobile mode", async function (assert) {
await visit("/u/eviltrout/messages"); await visit("/u/eviltrout/messages");
await click(".new-private-message"); await click(".new-private-message");
assert.ok(!exists("#reply-control .mini-tag-chooser")); assert.ok(exists("#reply-control .mini-tag-chooser"));
}); });
} }
); );

View File

@ -278,7 +278,7 @@ html.composer-open {
} }
} }
.with-tags { .with-tags.with-category {
.title-and-category { .title-and-category {
flex-wrap: wrap; flex-wrap: wrap;
} }
@ -319,7 +319,6 @@ html.composer-open {
.mini-tag-chooser { .mini-tag-chooser {
flex-grow: 1; flex-grow: 1;
max-width: calc(50% - 4px);
margin: 0 0 8px 0px; margin: 0 0 8px 0px;
z-index: z("composer", "dropdown"); z-index: z("composer", "dropdown");
.select-kit-header { .select-kit-header {

View File

@ -94,7 +94,7 @@
} }
.category-input, .category-input,
.with-tags .category-input { .with-tags.with-category .category-input {
margin-bottom: 6px; margin-bottom: 6px;
max-width: calc(50% - 3px); max-width: calc(50% - 3px);
} }
@ -209,19 +209,6 @@
margin: 0 0 6px 6px; margin: 0 0 6px 6px;
max-width: calc(50% - 3px); max-width: calc(50% - 3px);
} }
.selected-name {
.name {
font-size: var(--font-down-1);
.badge-wrapper {
font-size: var(--font-0);
}
}
}
.formatted-selection {
font-size: var(--font-down-1);
}
} }
.without-tags { .without-tags {