# Help us test a new composer style

**URL:** <https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552>\
**Category:** UX\
**Tags:** testing\
**Created:** [2017年十一月22日 00:22 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552 "2017-11-22T00:22:43Z")\
**Posts on this page:** 20\
**Page:** 3

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2017年十一月23日 06:34 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/60 "2017-11-23T06:34:28Z")

</div>

> [@sam](#):
>
> Where is this scrollbar coming from?

It is related to the tags field, which at very very specific widths (near the pictured width) has a bit of a freakout. You can see it in your screenshot, it is misaligned there. It’s only those very specific sizes.

---

<div class="post-metadata">

**Author:** ![j.jaffeux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/j.jaffeux/32/60297_2.png) [@j.jaffeux](https://meta.discourse.org/u/j.jaffeux)\
**Post date:** [2017年十一月23日 10:06 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/61 "2017-11-23T10:06:41Z")

</div>

{{tag-chooser}} is the last component I have to rewrite before fully removing select2, and I was talking of this with kris yesterday. Our idea so far is something like:

[x tag1 x tag2 …]

`...` expressing the fact that there are more tags, when you would focus the input, it would expand it. This is the best solution we could think of, given the space is very restrained now, and those scrollbars are very odd, this is also not an action many users will do : lot of tags + user wanting to look all the tags or edit them.

---

<div class="post-metadata">

**Author:** ![robmc](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/robmc/32/125900_2.png) [@robmc](https://meta.discourse.org/u/robmc)\
**Post date:** [2017年十一月23日 10:32 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/62 "2017-11-23T10:32:45Z")

</div>

I used it for the first time this morning - bit of a shock, but getting used to it 🙂

I noticed something a little odd when I edited a comment. The initial reply appears immediately as normal, but when I edited a comment, and submitted it, the update did not appear. I was concerned that the content / edit was lost. However, I refreshed the page and the new content was there. Strange it didn’t appear as normal though.

[Edit: making an edit to test it here again …]

[Edit 2: this time it seemed to work OK. Not sure if it was related to the length of time the edit window was open, or the length of the content, or something else, but the behaviour in this instance is as expected. Will continue to keep an eye on this]

---

<div class="post-metadata">

**Author:** ![outofthebox](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/outofthebox/32/83708_2.png) [@outofthebox](https://meta.discourse.org/u/outofthebox)\
**Post date:** [2017年十一月23日 12:17 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/63 "2017-11-23T12:17:52Z")

</div>

On mobile, I wish there was a way to see the post I am responding to while typing the response.

---

<div class="post-metadata">

**Author:** ![itsbhanusharma](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/itsbhanusharma/32/180717_2.png) [@itsbhanusharma](https://meta.discourse.org/u/itsbhanusharma)\
**Post date:** [2017年十一月23日 12:22 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/64 "2017-11-23T12:22:20Z")

</div>

So as the New composer is again stretched to full width, I wanted to know about one thing if there can be a scope of it. Can there be a CSS hack or maybe an admin panel toggle for those who want to go with the composer UI that had space on both sides?

---

<div class="post-metadata">

**Author:** ![dax](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dax/32/244677_2.png) [@dax](https://meta.discourse.org/u/dax)\
**Post date:** [2017年十一月23日 13:22 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/65 "2017-11-23T13:22:46Z")

</div>

你可以尝试使用 CSS，例如：

```
.open .grippie {
    width: 80%;
    margin: 0 auto;
}

#reply-control .reply-area {
    width: 80%;
}

```

效果可能类似于：

 ![YgUGIF1](https://global.discourse-cdn.com/meta/original/4X/5/a/4/5a48cd388c8e016da389e78df5e620b5b862aaa4.png)

---

<div class="post-metadata">

**Author:** ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)\
**Post date:** [2017年十一月24日 19:08 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/68 "2017-11-24T19:08:45Z")

</div>

![composer-horizontal-scroll-bar](https://global.discourse-cdn.com/meta/original/3X/7/d/7d89603c1efeffa6321e2d30763588cc035059d0.PNG)

Horizontal scrollbar shouldn’t come in preview right?

---

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [2017年十一月24日 19:52 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/69 "2017-11-24T19:52:50Z")

</div>

Additional adjustments

- [This tag input positioning issue](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/58) should be fixed
- Also fixed the [link pop-up being too large](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/57) for some mobile devices

---

<div class="post-metadata">

**Author:** ![alttext](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/alttext/32/81278_2.png) [@alttext](https://meta.discourse.org/u/alttext)\
**Post date:** [2017年十一月24日 20:39 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/70 "2017-11-24T20:39:41Z")

</div>

> [@codinghorror](#):
>
> stronger emphasis on the primary input area (left) vs. the preview (right)

Love this. Can’t tell you how many times I thought I was typing on the right 🙂

---

<div class="post-metadata">

**Author:** ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)\
**Post date:** [2017年十一月25日 04:28 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/72 "2017-11-25T04:28:59Z")

</div>

2 posts were split to a new topic: [CommonMark changed the way I number lists](https://meta.discourse.org/t/commonmark-changed-the-way-i-number-lists/74779)

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2017年十一月25日 04:33 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/75 "2017-11-25T04:33:47Z")

</div>

@awesomerobot I would like to roll this into master on end of day Monday the 27th? I think we’ll have gotten all the major issues out by then.

---

<div class="post-metadata">

**Author:** ![jomaxro](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jomaxro/32/126216_2.png) [@jomaxro](https://meta.discourse.org/u/jomaxro)\
**Post date:** [2017年十一月26日 03:23 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/76 "2017-11-26T03:23:22Z")

</div>

Canned Replies has formatting issues when composing a new topic. The top is cut off, and the search box is missing. They seem to format correctly when replying.

 ![image](https://global.discourse-cdn.com/meta/original/3X/4/e/4e0029a4395b4ce75f50c5611f4523e538819e96.png)

---

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [2017年十一月27日 15:21 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/77 "2017-11-27T15:21:33Z")

</div>

Just submitted a PR on canned replies that should fix the layout with the new composer (this will break the layout a little with the old composer).

[https://github.com/discourse/discourse-canned-replies/pull/38](https://github.com/discourse/discourse-canned-replies/pull/38)

---

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [2017年十一月27日 15:26 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/78 "2017-11-27T15:26:57Z")

</div>

This should be ready to merge by the end of the day today (the 27th). I don’t think there are any major issues remaining.

---

<div class="post-metadata">

**Author:** ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)\
**Post date:** [2017年十一月27日 20:18 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/81 "2017-11-27T20:18:53Z")

</div>

Still seeing this @awesomerobot

 ![image](https://global.discourse-cdn.com/meta/original/3X/8/9/891d599df43e38157fc4e09b1b75f743a47f3c78.jpg)

I think this style kind of works for google cause

- bottom is 1px wide
- toolbar is bottom is 2px wide and solid.

---

<div class="post-metadata">

**Author:** ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)\
**Post date:** [2017年十一月28日 01:40 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/83 "2017-11-28T01:40:27Z")

</div>

Still missing a few pixels in the preview area, when fully maximized:

 ![image](https://global.discourse-cdn.com/meta/original/3X/0/c/0ce5be186c8174b37ce00880f27a00db18e4506b.png)

This also causes

 ![image](https://global.discourse-cdn.com/meta/original/3X/7/2/7236a83d7156aa592c6aea70a4b6b8ed7a561f91.png)

---

<div class="post-metadata">

**Author:** ![bjorn81](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bjorn81/32/115064_2.png) [@bjorn81](https://meta.discourse.org/u/bjorn81)\
**Post date:** [2017年十一月28日 10:21 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/84 "2017-11-28T10:21:00Z")

</div>

Some things which I noticed (on Chromium 62, Linux):

- While the composer opens, the scroll bar of the edit area flickers frantically. Happens when unhiding the composer as well.

- When you hide the composer window, the hide button turns into an X, which apparently cancels the message entirely. However, it shows no warning (like the cancel button does) and its tool tip still says “hide or show the composer panel”. I’m afraid that may sting a few people with in-progress posts.

- The line width around the edit area is inconsistent, being two pixels in some places and one pixel in other places.

---

<div class="post-metadata">

**Author:** ![terraboss](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/terraboss/32/381157_2.png) [@terraboss](https://meta.discourse.org/u/terraboss)\
**Post date:** [2017年十一月29日 09:26 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/85 "2017-11-29T09:26:22Z")

</div>

Hi,  
how can I change the top blue color line? Is there any setting in color preferences?

Thanks.

---

<div class="post-metadata">

**Author:** ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)\
**Post date:** [2017年十一月29日 09:30 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/86 "2017-11-29T09:30:41Z")

</div>

It’s tied to the `tertiary` color. Alternatively, you can change it via CSS.

```css
.open .grippie {
  background: <your color>;
}

```

---

<div class="post-metadata">

**Author:** ![jomaxro](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jomaxro/32/126216_2.png) [@jomaxro](https://meta.discourse.org/u/jomaxro)\
**Post date:** [2017年十一月29日 22:28 UTC](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552/87 "2017-11-29T22:28:30Z")

</div>

A post was split to a new topic: [Upload progress bar should use the “grippie” area](https://meta.discourse.org/t/upload-progress-bar-should-use-the-grippie-area/75047)

[上一頁](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552.md?page=2)

[下一頁](https://meta.discourse.org/t/help-us-test-a-new-composer-style/74552.md?page=4)
