# Details in topic styling changes - Feedback

**URL:** <https://meta.discourse.org/t/details-in-topic-styling-changes-feedback/285364>\
**Category:** UX\
**Tags:** completed, design-experiment\
**Created:** [November 13, 2023, 10:43pm UTC](https://meta.discourse.org/t/details-in-topic-styling-changes-feedback/285364 "2023-11-13T22:43:00Z")\
**Posts on this page:** 1\
**Showing post:** 16

<div class="post-metadata">

**Author:** ![cvx](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cvx/32/152146_2.png) [@cvx](https://meta.discourse.org/u/cvx)\
**Post date:** [November 14, 2023, 4:27pm UTC](https://meta.discourse.org/t/details-in-topic-styling-changes-feedback/285364/16 "2023-11-14T16:27:08Z")

</div>

Some initial feedback:

1. I glazed over the new details element when I first encountered it. It just didn’t register as a `[details]`. It might be “just because it’s new”, but…
2. It’s divorced from previous design and the default browser implementation – the chevron is after the summary instead of before, and the closed state points in the direction that previously (and by default) meant the opened state.  
closed: ![5e2f09a3273a7776b5183413ef6f10e6527e79e0](https://global.discourse-cdn.com/meta/original/4X/0/a/3/0a32017a11815ebecede85b5248ddad0773e1a52.png) ![d9740bb422e18ababe7c9a7d542c2f16fc133988](https://global.discourse-cdn.com/meta/original/4X/a/4/a/a4a222d1db5daaf7ab61beae24731ef818c29ab1.png)  
open: ![7c34c74801ab3cf04dc83e99b95e7689bb4ded71](https://global.discourse-cdn.com/meta/original/4X/b/0/4/b043827daadc355a90b89816f4b3c8bf2e577f3d.png) ![f65dd89b62acbfaa9dcf83bd03bbe23eb0c1105a](https://global.discourse-cdn.com/meta/original/4X/d/e/1/de167f4b9747c61236c730fb1428b5c351fe3e6a.png)
3. The button/summary element takes much more space (previously it was a semi-inline element)  
 ![39fbd320470a56d690557dcf1ebc9798ac02382f](https://global.discourse-cdn.com/meta/original/4X/4/8/e/48ec6b6247cdddff7fec2589f36cf70ce43b5e51.png) vs ![a3fb90130fd87d41108a24ed0729f5451ce3e900](https://global.discourse-cdn.com/meta/original/4X/9/8/6/986544397745a121a3cd4a938fede826a928375d.png)
4. As seen above, previously the triangle/chevron was aligned with the text and now the “Summary” text isn’t, because of button’s padding (nothing is aligned with anything 😅)  
 ![ab4fb0a6f7cd98f304c30c176018e86b586b2ad2](https://global.discourse-cdn.com/meta/original/4X/2/8/9/289579954d40dc265d3e6893de7dc1a972142d58.png)
5. On mobile, after interacting with it, button’s background stays highlighted  
 ![958cd25a96de8fe709805f50e339070059efb5d8_2_344x140](https://global.discourse-cdn.com/meta/original/4X/2/9/5/29525e9164610270dc29c72483b6fe3c2db8dd72.jpeg)
6. I would have voted for the border rather than the background option – I’d prefer that hiding some content did just that, without affecting contrast (relevant mostly in case of embedded images and emoji)  
 ![5c7bc1c39495778f2cdcdf6349b748c4a888c201_2_690x180](https://global.discourse-cdn.com/meta/original/4X/a/c/c/accd9810140ee10b6a8fdbda6a74c88fb97e9ca2.png)

update:

1. A reduced clickable area:  
 ![image](https://global.discourse-cdn.com/meta/original/4X/9/7/5/9756e02f00bd03f5a11727577b31f136117d139a.png)  
vs  
 ![image](https://global.discourse-cdn.com/meta/original/4X/b/3/e/b3ef014e696b4e3502263687132a0dfde672da82.png)

---

_[View the full topic](https://meta.discourse.org/t/details-in-topic-styling-changes-feedback/285364)._
