discourse/plugins/chat/assets/stylesheets/common/chat-channel-info.scss
Martin Brennan 31f6811a93
FIX: Change wording from title -> name in channel about page (#19889)
We refer to the channel name rather than title elsewhere
(including the new channel modal), so we should be consistent.
Title is an internal abstraction, since DM channels cannot have
names (currently).

Also change the name field on channel edit to a input type="text"
rather than a textarea, since we don't want a huge input here.
2023-01-18 09:13:33 +10:00

145 lines
2.6 KiB
SCSS

.channel-info {
display: flex;
flex-direction: column;
height: 100%;
}
// Info header
.channel-info-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 1rem;
box-sizing: border-box;
}
.channel-info-header__title {
font-size: var(--font-up-2);
margin: 0;
}
// About view
.channel-info-about-view__title-input {
width: 100%;
}
.channel-info-about-view__description-input {
height: 150px;
width: 100%;
}
.channel-info-about-view__description__helper-text {
color: var(--primary-medium);
}
.channel-settings-view__desktop-notification-level-selector,
.channel-settings-view__mobile-notification-level-selector,
.channel-settings-view__muted-selector,
.channel-settings-view__auto-join-selector,
.channel-settings-view__channel-wide-mentions-selector {
width: 220px;
}
.chat-form__btn.delete-btn {
.d-icon {
color: var(--danger);
}
}
// Members list
.chat-tabs__memberships-count {
margin-left: 0.25em;
}
.channel-members-view-wrapper {
display: flex;
flex-direction: column;
height: 100%;
box-sizing: border-box;
padding: 0 1rem;
}
.channel-members-view__search-input-container {
display: flex;
align-items: center;
border: 1px solid var(--primary-medium);
&.is-focused {
border: 1px solid var(--tertiary);
}
.d-icon {
padding: 0.5rem;
color: var(--primary-medium);
}
}
input.channel-members-view__search-input {
border: 0;
margin: 0;
outline: 0;
width: 100%;
&:focus {
border: 0;
outline: 0;
}
}
.channel-members-view__status {
display: flex;
align-items: center;
}
.channel-members-view__list-container {
display: flex;
flex-direction: column;
margin-top: 1em;
box-sizing: border-box;
min-height: 1px;
overflow-y: auto;
height: 100%;
@include chat-scrollbar(var(--secondary));
}
.channel-members-view__list-item {
display: flex;
align-items: center;
padding: 0.5rem 0 0.5rem 1px;
&:hover {
background-color: var(--tertiary-very-low);
border-radius: 0.25rem;
}
.chat-user-avatar {
margin-right: 0.5rem;
}
}
// Channel info edit name modal
.chat-channel-edit-name-modal__name-input {
display: flex;
margin: 0;
width: 100%;
}
.chat-channel-edit-name-modal__description {
display: flex;
padding: 0.5rem 0;
color: var(--primary-medium);
}
// Channel info edit description modal
.chat-channel-edit-description-modal__description-input {
display: flex;
margin: 0;
min-height: 200px;
}
.chat-channel-edit-description-modal__description {
display: flex;
padding: 0.75rem 0 0.5rem;
color: var(--primary-medium);
}