|
- @import "../../../css/ui.less";
-
- @pad: 8px;
- @btnSize: 64px;
-
- .uiMessages {
- position: absolute;
- left: 10px;
- bottom: 10px;
-
- width: 480px;
- padding: @pad;
-
- pointer-events: none;
-
- &.typing {
- pointer-events: all;
-
- .el.message {
- display: block;
- }
-
- .filters {
- pointer-events: all;
- display: block;
- }
-
- .list {
- overflow-y: auto;
- background-color: @darkGray;
-
- .list-message {
- filter: none;
- }
- }
- }
-
- &.active {
- .list-message {
- opacity: 1 !important;
- }
- }
-
- .filters {
- display: none;
- width: 100%;
- height: 26px;
- margin-bottom: 10px;
-
- .filter {
- height: 100%;
- background-color: @blackC;
- float: left;
- color: @blackA;
- margin-right: 10px;
- padding: 5px 10px;
- cursor: pointer;
-
- &:hover {
- background-color: @blackB;
- color: @grayD;
- }
-
- &.active {
- background-color: @blackB;
- color: @green;
-
- &:hover {
- background-color: @blackA;
- color: @grayB;
- }
- }
- }
- }
-
- .list {
- overflow-y: hidden;
- width: 100%;
- max-height: 320px;
-
- .list-message {
- width: 100%;
- padding: 5px 10px;
- color: white;
- filter:
- drop-shadow(0px -2px 0px @blackD)
- drop-shadow(0px 2px 0px @blackD)
- drop-shadow(2px 0px 0px @blackD)
- drop-shadow(-2px 0px 0px @blackD);
-
- word-wrap: break-word;
- line-height: 18px;
-
- &.q0 {
- color: @white;
- }
-
- &.q1 {
- color: @blue;
- }
-
- a, &.q2 {
- color: @yellow;
- }
-
- &.q3 {
- color: @purple;
- }
-
- &.q4 {
- color: @orange;
- }
-
- &.color-green {
- color: @green;
- }
-
- &.color-red {
- color: @red;
- }
-
- &.color-cyan {
- color: @blueA;
- }
-
- display: none;
- }
-
- &.rep .list-message.rep {
- display: block;
- }
-
- &.chat .list-message.chat {
- display: block;
- }
-
- &.info .list-message.info {
- display: block;
- }
-
- &.loot .list-message.loot {
- display: block;
- }
- }
-
- .el.message {
- display: none;
- text-align: left;
- background-color: @gray;
- width: 100%;
- color: @white;
- padding: 5px 10px;
- }
- }
|