fixed release chat icons
WolverinDEV
parent
aa692981d3
commit
4835e6e9e8
|
|
@ -1,66 +1,70 @@
|
|||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.align_row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.align_column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.icon_loading {
|
||||
border: 2px solid #f3f3f3; /* Light grey */
|
||||
border-top: 2px solid #3498db; /* Blue */
|
||||
border-radius: 50%;
|
||||
animation: spin 2s linear infinite;
|
||||
border: 2px solid #f3f3f3; /* Light grey */
|
||||
border-top: 2px solid #3498db; /* Blue */
|
||||
border-radius: 50%;
|
||||
animation: spin 2s linear infinite;
|
||||
|
||||
width: 14px!important;
|
||||
height: 14px!important;
|
||||
width: 14px !important;
|
||||
height: 14px !important;
|
||||
}
|
||||
|
||||
.avatar_loading {
|
||||
border: 2px solid #f3f3f3; /* Light grey */
|
||||
border-top: 2px solid #3498db; /* Blue */
|
||||
border-radius: 50%;
|
||||
animation: spin 2s linear infinite;
|
||||
border: 2px solid #f3f3f3; /* Light grey */
|
||||
border-top: 2px solid #3498db; /* Blue */
|
||||
border-radius: 50%;
|
||||
animation: spin 2s linear infinite;
|
||||
|
||||
width: 14px!important;
|
||||
height: 14px!important;
|
||||
width: 14px !important;
|
||||
height: 14px !important;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.select_info {
|
||||
font-family: Arial;
|
||||
font-size: 12px;
|
||||
/*white-space: pre;*/
|
||||
line-height: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-family: Arial;
|
||||
font-size: 12px;
|
||||
/*white-space: pre;*/
|
||||
line-height: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* The Modal (background) */
|
||||
.modal_disabled {
|
||||
display: none; /* Hidden by default */
|
||||
position: fixed; /* Stay in place */
|
||||
z-index: 1; /* Sit on top */
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%; /* Full width */
|
||||
height: 100%; /* Full height */
|
||||
overflow: auto; /* Enable scroll if needed */
|
||||
background-color: rgb(0,0,0); /* Fallback color */
|
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
|
||||
display: none; /* Hidden by default */
|
||||
position: fixed; /* Stay in place */
|
||||
z-index: 1; /* Sit on top */
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%; /* Full width */
|
||||
height: 100%; /* Full height */
|
||||
overflow: auto; /* Enable scroll if needed */
|
||||
background-color: rgb(0, 0, 0); /* Fallback color */
|
||||
background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
|
||||
|
||||
/* Modal Header */
|
||||
.modal-header {
|
||||
|
|
@ -120,7 +124,7 @@
|
|||
border: 2px solid #888;
|
||||
width: auto;
|
||||
max-width: 90%;
|
||||
box-shadow: 0 4px 15px 0 rgba(0,0,0,0.2), 2px 6px 20px 0 rgba(0,0,0,0.19);
|
||||
box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.2), 2px 6px 20px 0 rgba(0, 0, 0, 0.19);
|
||||
animation-name: modalFlyIn;
|
||||
animation-duration: 0.4s;
|
||||
top: 10%;
|
||||
|
|
@ -133,39 +137,45 @@
|
|||
|
||||
/* Add Animation */
|
||||
@keyframes modalFlyIn {
|
||||
from {top: 0%; opacity: 0}
|
||||
to {top: 10%; opacity: 1}
|
||||
from {
|
||||
top: 0%;
|
||||
opacity: 0
|
||||
}
|
||||
to {
|
||||
top: 10%;
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
.channel_perm_tbl input {
|
||||
width: 30px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.channel_perm_tbl .key {
|
||||
width: 120px;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.channel_general_properties .value {
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
html {
|
||||
background-color: gray;
|
||||
background-color: gray;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: unset;
|
||||
display: unset;
|
||||
border: unset;
|
||||
display: unset;
|
||||
}
|
||||
|
||||
.modal-head-error {
|
||||
background: darkred;
|
||||
background: darkred;
|
||||
|
||||
font-family: Arial;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
font-family: Arial;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
|
||||
vertical-align: middle;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.modal-button-group {
|
||||
|
|
@ -173,47 +183,48 @@ fieldset {
|
|||
}
|
||||
|
||||
.modal-button-group button {
|
||||
width: 100px;
|
||||
margin-right: 5px;
|
||||
margin-left: 5px;
|
||||
width: 100px;
|
||||
margin-right: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.modal-button-group button:last-of-type {
|
||||
margin-right: 0px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.invalid_input {
|
||||
border-color: red;
|
||||
border-color: red;
|
||||
}
|
||||
|
||||
.GroupBox {
|
||||
border: gray solid;
|
||||
border-width: 2px;
|
||||
border-radius: 0px 6px 6px 6px;
|
||||
border: gray solid;
|
||||
border-width: 2px;
|
||||
border-radius: 0px 6px 6px 6px;
|
||||
}
|
||||
|
||||
code {
|
||||
background-color: lightgray;
|
||||
padding: 2px;
|
||||
background-color: lightgray;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
footer {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
height: 25px;
|
||||
background-color: lightgray;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
height: 25px;
|
||||
background-color: lightgray;
|
||||
|
||||
display: flex;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
footer .container {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
position: relative;
|
||||
vertical-align: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
position: relative;
|
||||
vertical-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
$separator_thickness: 4px;
|
||||
|
|
@ -336,7 +347,7 @@ html, body {
|
|||
|
||||
body {
|
||||
padding: 8px;
|
||||
background: darkgray!important;
|
||||
background: darkgray !important;
|
||||
}
|
||||
|
||||
.icon-playlist-manage {
|
||||
|
|
@ -358,5 +369,5 @@ x-content {
|
|||
}
|
||||
|
||||
[class*=" bmd-label"], [class^=bmd-label] {
|
||||
color: rgba(0, 0, 0, .6)!important;
|
||||
color: rgba(0, 0, 0, .6) !important;
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
#chat {
|
||||
font-family: Arial;
|
||||
font-family: Arial, serif;
|
||||
font-size: 12px;
|
||||
/*white-space: pre;*/
|
||||
line-height: 1;
|
||||
|
|
@ -44,7 +44,6 @@
|
|||
max-width: 100%;
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
/*height: 24px;*/
|
||||
overflow: auto;
|
||||
overflow-y: hidden;
|
||||
white-space: nowrap;
|
||||
|
|
@ -56,11 +55,12 @@
|
|||
background: #5f5f5f5f;
|
||||
display: inline-block;
|
||||
border: 1px solid #6f6f6f;
|
||||
border-radius: 0px 0px 2px 2px;
|
||||
border-radius: 0 0 2px 2px;
|
||||
vertical-align: middle;
|
||||
padding-right: 5px;
|
||||
padding-left: 2px;
|
||||
cursor: pointer;
|
||||
height: 18px;
|
||||
|
||||
&.active {
|
||||
background: #11111111;
|
||||
|
|
@ -77,6 +77,10 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.name, .chatIcon {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -209,7 +209,7 @@ class ChatEntry {
|
|||
let tag = $.spawn("div");
|
||||
tag.addClass("chat");
|
||||
|
||||
tag.append("<div class=\"chatIcon icon clicon " + this.chatIcon() + "\"></div>");
|
||||
tag.append("<div class=\"chatIcon icon " + this.chatIcon() + "\"></div>");
|
||||
tag.append("<a class='name'>" + this._name + "</a>");
|
||||
|
||||
let closeTag = $.spawn("div");
|
||||
|
|
@ -288,7 +288,7 @@ class ChatEntry {
|
|||
set unread(flag : boolean) {
|
||||
if(this._unread == flag) return;
|
||||
this._unread = flag;
|
||||
this.htmlTag.find(".chatIcon").attr("class", "chatIcon icon clicon " + this.chatIcon());
|
||||
this.htmlTag.find(".chatIcon").attr("class", "chatIcon icon " + this.chatIcon());
|
||||
if(flag) {
|
||||
this.htmlTag.find(".name").css("color", "blue");
|
||||
} else {
|
||||
|
|
|
|||
Loading…
Reference in New Issue