fchat-rising/less/chat.less

261 lines
4.5 KiB
Plaintext

.bg-solid-text {
background: @text-background-color
}
.link-preview {
background: @text-background-color;
border-top-right-radius: 2px;
bottom: 0;
left: 0;
max-width: 40%;
overflow-x: hidden;
padding: 0.2em 0.5em;
font-size: 12px;
position: fixed;
text-overflow: ellipsis;
white-space: nowrap;
z-index: 100000;
&.right {
left: auto;
right: 0;
border-top-left-radius: 2px;
border-top-right-radius: 0;
}
}
.has-new {
background-color: @state-danger-bg !important;
}
.overlay-disable {
position: absolute;
opacity: 0.8;
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
background: #ddd;
color: #000;
}
.sidebar-wrapper {
.modal-backdrop {
display: none;
z-index: 9;
}
&.open {
.modal-backdrop {
display: block;
}
.body {
display: block;
}
}
}
.sidebar {
position: absolute;
top: 0;
bottom: 0;
background: @body-bg;
z-index: 10;
flex-shrink: 0;
margin: -10px;
padding: 10px;
.body {
display: none;
width: 200px;
flex-direction: column;
max-height: 100%;
overflow: auto;
}
.expander {
display: block;
position: absolute;
padding: 5px 6px;
border-color: @btn-default-border;
border-top-right-radius: 0;
border-top-left-radius: 0;
@media (min-width: @screen-sm-min) {
.name {
display: none;
}
&:hover .name {
display: inline;
}
}
}
&.sidebar-left {
border-right: solid 1px @panel-default-border;
left: 0;
margin-right: 0;
padding-right: 0;
.expander {
transform: rotate(270deg) translate3d(0, 0, 0);
transform-origin: 100% 0;
-webkit-transform: rotate(270deg) translate3d(0, 0, 0);
-webkit-transform-origin: 100% 0;
right: 0;
}
}
&.sidebar-right {
border-left: solid 1px @panel-default-border;
right: 0;
margin-left: 0;
padding-left: 0;
.expander {
transform: rotate(90deg) translate3d(0, 0, 0);
transform-origin: 0 0;
-webkit-transform: rotate(90deg) translate3d(0, 0, 0);
-webkit-transform-origin: 0 0;
}
}
}
.sidebar-fixed() {
position: static;
margin: 0;
padding: 0;
height: 100%;
.body {
display: block;
}
.expander {
display: none;
}
}
.chat-text-box {
min-height: initial !important;
max-height: 250px;
resize: none;
}
.ads-text-box {
background-color: @state-info-bg;
}
.border-top {
border-top: solid 1px @panel-default-border;
}
.border-bottom {
border-bottom: solid 1px @panel-default-border;
}
.message {
word-wrap: break-word;
word-break: break-word;
padding-bottom: 1px;
}
.message-block {
padding: 1px 0;
&:not(:last-child) {
border-bottom: solid 1px @panel-default-border;
}
}
.message-warn {
background-color: @state-danger-bg;
color: @state-danger-text;
}
.messages-both {
.message-ad {
background-color: @brand-info;
padding: 0 2px 2px 2px;
box-shadow: @gray -2px -2px 2px inset;
}
}
.message-event {
color: @gray;
}
.message-highlight {
background-color: @state-success-bg;
}
.message-action .bbcode {
font-style: italic;
i, em {
font-style: normal;
}
}
.last-read {
border-bottom: solid 2px @state-success-bg !important;
}
.fa.active {
color: @brand-success;
}
.gender-shemale {
color: #CC66FF;
}
.gender-herm {
color: #9B30FF;
}
.gender-none {
color: @gray;
}
.gender-female {
color: #FF6699;
}
.gender-male {
color: #6699FF;
}
.gender-male-herm {
color: #007FFF;
}
.gender-transgender {
color: #EE8822;
}
.gender-cunt-boy {
color: #00CC66;
}
#character-page-sidebar {
margin-top: 0; // Fix up hack for merging the header on the character page, which doesn't work on chat.
}
.profile-viewer {
width: 98%;
height: 100%;
}
#window-tabs .hasNew > a {
background-color: @state-warning-bg;
border-color: @state-warning-border;
color: @state-warning-text;
&:hover {
background-color: @state-warning-border;
}
}
.btn-text {
margin-left: 3px;
@media (max-width: @screen-xs-max) {
display: none;
}
}