owncast/web/styles/chat.scss
Gabe Kangas b10ba1dcc2 Admin support for managing users (#245)
* First pass at displaying user data in admin

* Hide chat blurb on home page if chat is disabled

* Hide sidebar chat section if chat is disabled

* Block/unblock user interface for https://github.com/owncast/owncast/issues/1096

* Simplify past display name handling

* Updates to reflect the api access token change

* Update paths

* Clean up the new access token page

* Fix linter

* Update linter workflow action

* Cleanup

* Fix exception rendering table row

* Commit next-env file that seems to be required with next 11

* chat refactor - admin adjustments (#250)

* add useragent parser; clean up some html;

* some ui changes
- use modal instead of popover to confirm block/unblock user
- update styles, table styles for consistency
- rename some user/chat labels in nav and content

* format user info modal a bit

* add some sort of mild treatment and delay while processing ban of users

* rename button to 'ban'

* add some notes

* Prettified Code!

* fix disableChat toggle for nav bar

* Support sorting the disabled user list

* Fix linter error around table sorting

* No longer restoring messages on unban so change message prompt

* Standardize on forbiddenUsername terminology

* The linter broke the webhooks page. Fixed it. Linter is probably pissed.

* Move chat welcome message to chat config

* Other submenus don't have icons so remove these ones

Co-authored-by: gingervitis <omqmail@gmail.com>
Co-authored-by: gabek <gabek@users.noreply.github.com>
2021-07-19 22:02:02 -07:00

148 lines
2.4 KiB
SCSS

// Users, Chat views
.chat-messages {
.ant-table-cell {
&.name-col {
text-overflow: ellipsis;
overflow: hidden;
}
&.toggle-col {
label {
font-size: 11px;
}
}
.message-contents {
overflow: auto;
max-height: 200px;
img {
position: relative;
margin-top: -5px;
width: 3rem;
padding: 0.25rem;
}
p {
margin-bottom: 0;
}
}
}
.bulk-editor {
margin: 0.5rem 0;
padding: 0.5rem;
border: 1px solid var(--textfield-border);
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
border-radius: 4px;
&.active {
.label {
color: var(--black);
}
}
.label {
font-size: 0.75rem;
color: var(--white-50);
margin-right: 0.5rem;
}
button {
margin: 0 0.2rem;
font-size: 0.75rem;
}
}
}
.ant-table-filter-dropdown {
max-width: 250px;
}
.toggle-switch {
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: nowrap;
justify-content: flex-end;
transition: opacity 0.15s;
.outcome-icon {
margin-right: 0.5rem;
}
&.hidden {
opacity: 0.25;
&:hover {
opacity: 1;
}
}
.ant-btn {
.anticon {
opacity: 0.5;
}
&:hover {
.anticon {
opacity: 1;
}
}
}
.ant-btn-text:hover {
background-color: var(--black-35);
}
}
.blockuser-popover {
max-width: 400px;
}
.user-item-container {
// reset <button> properties
border: none;
background: none;
text-align: left;
padding: 0;
margin: 0;
cursor: pointer;
outline: none;
.display-name {
color: var(--white);
border-bottom: 1px dotted var(--white-50);
}
&:hover {
.display-name {
border-color: var(--white);
}
}
}
.user-details {
h5 {
color: var(--white);
}
.created-at {
font-size: 0.75em;
font-style: italic;
}
.connection-info {
font-size: 0.88em;
}
.previous-names-list {
font-size: 0.88em;
.user-name-item {
font-family: monospace;
}
.latest {
font-style: italic;
.user-name-item {
font-weight: bold;
font-style: normal;
color: var(--pink);
}
}
}
.ant-divider {
border-color: var(--white-25);
}
}
.block-user-button {
text-transform: capitalize;
}