discourse/plugins/chat/assets/stylesheets/common/chat-channel-info.scss
Joffrey JAFFEUX 53b96638c5
DEV: implements <Chat::Navbar /> (#24917)
This new navbar component is used for every navbar in chat, full page or drawer, and any screen.

This commit also uses this opportunity to correctly decouple drawer-routes from full page routes. This will avoid having this kind of properties in components: `@includeHeader={{false}}`. The header is now defined in the parent template using a navbar. Each route has now its own template wrapped in a div of the name of the route, eg: `<div class="c-routes-threads">..</div>`.

The navbar API:

```gjs
<Navbar as |navbar|>
 <navbar.BackButton />
 <navbar.Title @title="Foo" />
 <navbar.ChannelTitle @channel={{@channel}} />
 <navbar.Actions as |action|>
   <action.CloseThreadButton />
 </navbar.Actions>
</navbar>
```

The full list of components is listed in `plugins/chat/assets/javascripts/discourse/components/navbar/index.gjs` and `plugins/chat/assets/javascripts/discourse/components/navbar/actions.gjs`.

Visually the header is not changing much, only in drawer mode the background has been removed.

This commit also introduces a `<List />` component to facilitate rendering lists in chat plugin.
2023-12-18 17:49:58 +01:00

40 lines
603 B
SCSS

.chat-channel-info {
display: flex;
padding: 1rem;
flex-direction: column;
.chat-message-creator__container {
width: 100%;
}
&__nav {
.nav-pills {
margin: 0;
padding-bottom: 1rem;
}
}
}
.chat-channel-members__add-members {
display: flex;
gap: 1rem;
.chat-message-creator-container {
width: 100%;
}
}
// Info header
.chat-channel-info-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 1rem;
box-sizing: border-box;
}
.chat-channel-info-header__title {
font-size: var(--font-up-2);
margin: 0;
}