discourse/plugins/chat/assets/stylesheets/common/chat-navbar.scss
Joffrey JAFFEUX 76953cc356
FEATURE: allows to force a thread (#25987)
Forcing a thread will work even in channel which don't have `threading_enabled` or in direct message channels.

For now this feature is only available through the `ChatSDK`:

```ruby
ChatSDK::Message.create(in_reply_to_id: 1, guardian: guardian, raw: "foo bar baz", channel_id: 2, force_thread: true)
```
2024-03-06 12:03:42 +01:00

114 lines
1.9 KiB
SCSS

.c-navbar-container {
position: relative;
border-bottom: 1px solid var(--primary-low);
background: var(--secondary);
box-sizing: border-box;
display: flex;
z-index: z("composer", "content") - 1;
padding: 0 1rem;
&.-clickable {
cursor: pointer;
}
&.-full-title {
.c-navbar__title {
min-height: var(--chat-header-offset);
}
.c-navbar__title,
.c-navbar__title-text {
height: auto;
overflow: visible;
white-space: normal;
text-overflow: unset;
}
}
}
.c-navbar {
display: flex;
align-items: flex-start;
width: 100%;
gap: 0.25rem;
position: relative;
.single-select-header {
padding: 0.3675rem 0.584rem;
}
> .c-navbar__title:first-child {
margin-left: 1rem;
}
}
.c-navbar__back-button {
height: var(--chat-header-offset);
}
.c-navbar__channel-title {
@include ellipsis();
font-weight: 700;
height: var(--chat-header-offset);
display: flex;
align-items: center;
}
.c-navbar__title {
display: flex;
align-items: center;
@include ellipsis();
height: var(--chat-header-offset);
&-text {
@include ellipsis();
font-weight: 700;
max-width: 100%;
vertical-align: middle;
padding-block: 5px;
> .d-icon {
margin-right: 5px;
}
}
.chat-drawer & {
padding-left: 1rem;
}
.d-icon {
vertical-align: middle;
}
}
.c-navbar__sub-title {
line-height: var(--line-height-small);
font-size: var(--font-down-1-rem);
font-weight: normal;
}
.c-navbar__threads-list-button {
gap: 0.25rem;
&.has-unreads {
.d-icon-discourse-threads {
color: var(--tertiary-med-or-tertiary);
}
}
}
.c-navbar__actions {
list-style: none;
margin-left: auto;
display: flex;
align-items: center;
height: var(--chat-header-offset);
.d-icon {
color: var(--primary-low-mid);
}
}
.c-navbar__back-button ~ .c-navbar__title {
padding-left: 0;
}