owncast/web/styles/chat.scss

123 lines
2.0 KiB
SCSS
Raw Normal View History

2020-12-23 08:15:37 +01:00
.chat-messages {
.ant-table-small .ant-table-selection-column {
width: 20px;
min-width: 20px;
}
.ant-table-tbody > tr > td {
transition: background-color 0.15s;
2020-12-23 08:15:37 +01:00
}
2020-12-27 06:36:48 +01:00
.ant-table-row.hidden {
.ant-table-cell {
color: rgba(0,0,0,.25)
2020-12-27 06:36:48 +01:00
}
2021-01-10 03:38:22 +01:00
@media (prefers-color-scheme: dark) {
.ant-table-cell {
color: rgba(255,255,255,.25)
}
}
2020-12-27 06:36:48 +01:00
}
2020-12-23 08:15:37 +01:00
.ant-table-cell {
font-size: 12px;
&.name-col {
text-overflow: ellipsis;
overflow: hidden;
}
2020-12-27 06:36:48 +01:00
&.toggle-col {
label {
font-size: 11px;
}
}
2020-12-27 06:46:40 +01:00
.message-contents {
2020-12-27 10:15:17 +01:00
overflow: auto;
max-height: 200px;
2020-12-27 06:46:40 +01:00
img {
position: relative;
margin-top: -5px;
width: 3rem;
padding: 0.25rem;
}
2021-01-02 14:10:16 +01:00
p {
margin-bottom: 0;
}
2020-12-27 06:46:40 +01:00
}
2020-12-23 08:15:37 +01:00
}
2020-12-26 08:14:27 +01:00
.bulk-editor {
margin: .5rem 0;
padding: .5rem;
border: 1px solid #ccc;
2020-12-26 08:14:27 +01:00
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
2020-12-27 06:36:48 +01:00
border-radius: 4px;
opacity: .5;
2020-12-27 06:36:48 +01:00
&.active {
opacity: 1;
2020-12-27 06:36:48 +01:00
.label {
color: #000;
2020-12-27 06:36:48 +01:00
}
2021-01-10 03:38:22 +01:00
@media (prefers-color-scheme: dark) {
.label {
color: #fff;
}
}
2020-12-27 06:36:48 +01:00
}
2020-12-26 08:14:27 +01:00
.label {
font-size: .75rem;
color: #666;
2020-12-27 06:36:48 +01:00
margin-right: .5rem;
2020-12-26 08:14:27 +01:00
}
2020-12-27 06:36:48 +01:00
button {
margin: 0 .2rem;
font-size: .75rem;
2020-12-26 08:14:27 +01:00
}
}
2020-12-23 08:15:37 +01:00
}
.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 .15s;
.outcome-icon {
margin-right: .5rem;
}
&.hidden {
opacity: .25;
&:hover {
opacity: 1;
}
}
.ant-btn {
.anticon {
opacity: .5;
}
&:hover {
.anticon {
opacity: 1;
}
}
}
.ant-btn-text:hover {
background-color: rgba(0,0,0,.1)
}
2021-01-10 03:38:22 +01:00
@media (prefers-color-scheme: dark) {
.ant-btn-text:hover {
background-color: rgba(255,255,255,.3)
}
}
2020-12-27 06:36:48 +01:00
}