005cfe3dc8
* added doctypes, created frappe chat ui * added component layout with state-like abilities, added apis * updated user doctype, moved from state-like feature and component abstraction * added room component * fixed publish_realtime with after_commit = True * created room component and searchbar * minor fix * functional message parsing * update * Added Chat Profile * added chat message * more changes into chat room * fixed APIs, added client side scripting * added chat message attachements, more doc updates * Brand New UI with socket io room integration * completed socketio integration. off to room subscription and publish * realtime room update * raw update * initialized docs, added p2p connection for call tests * updated docs * added coverage, updated api for ease of use * raw commit * added test cases * Chat Room updates and new room creation * added chat group creation * added collapsible plugin * toggable room view * updated * [RAW] * updated UI for chat * Deleted Previous Chat Page * moved from frappe.Chat.Widget to frappe.Chat * modularized frappe-fab * added more docstrings * tried adding conversation tones * Added conversation_tones and refurbished chat popper * modified frappe.ui.Dialog, moved from AppBar to ActionBar, responsive for Mobile 💃 * moved RoomList item namespace * Configurable Desktop update, moved profile updates to on_update * added state change listeners * removed AppBar to ActionBar customizable 💃 * added destroy method * removed coverage, refactored group creation * Successful Chat Rooms and Group creation * sort rows based on last_message_timestamp or creation * added frappe._.compare * removed redundant less variables * Chat Room back button with custom routing and destroy methods * Added EmojiPicker * fixed multiple dialog render * setup quick access * added chat chime, functional chat message list updates at room list * deleted package-lock.json * realtime date updates * updated chat message list * functional message render and updates * added track seen * added typing status * updated typing status * valid typing statuses and quick search * Functional Quick Search * reverted fix * some more cleanup and promisifed * fixed hints close on click * updated fab boldness * close popper on click panel * close popper on click panel * reverted octicon-lg, fixed popper heading click * new frappe capture * removed webcamjs * added uploader and capture * removed chat FAB, added as notification instead * on message update
225 lines
No EOL
4.1 KiB
Text
225 lines
No EOL
4.1 KiB
Text
// variables
|
|
@color-white: #FFF; //
|
|
|
|
@font-weight-bold: 700; //
|
|
@font-weight-heavy: 900; //
|
|
|
|
@frappe-chat-popper-panel-width: 350px; //
|
|
@frappe-chat-popper-panel-height: 500px; //
|
|
|
|
@frappe-chat-form-font-size: 12px;
|
|
|
|
|
|
@frappe-fab-width: 48px;
|
|
@frappe-fab-height: 48px;
|
|
@frappe-fab-lg: 56px;
|
|
@frappe-fab-sm: 40px;
|
|
// https://github.com/twbs/bootstrap/blob/v3.3.7/less/variables.less#L278
|
|
// Keep z-index of the FAB button higher than others, lower than modal background.
|
|
@frappe-fab-box-shadow: 0px 3px 6px 0px rgba(0,0,0,.25);
|
|
@frappe-fab-box-shadow-hover: 0px 5px 9px 0px rgba(0,0,0,.25);
|
|
|
|
@frappe-chat-panel-heading-box-shadow: 0px 2px 2px 0px rgba(0,0,0,.14); //
|
|
@frappe-chat-panel-body-padding: 10px;
|
|
@frappe-chat-panel-heading-action-padding: 5px;
|
|
|
|
@frappe-chat-popper-z-index: 1035;
|
|
@frappe-chat-popper-margin: 20px;
|
|
@frappe-chat-popper-panel-box-shadow: @frappe-fab-box-shadow;
|
|
// z-index greater than FAB, lesser than modal.
|
|
@frappe-chat-popper-panel-span-z-index: 1037;
|
|
|
|
@frappe-chat-form-list-group-height: 150px;
|
|
@frappe-chat-form-menu-border-radius: 4px;
|
|
|
|
@frappe-chat-emoji-width: 250px;
|
|
@frappe-chat-emoji-height: 300px;
|
|
|
|
.font-bold
|
|
{
|
|
font-weight: @font-weight-bold;
|
|
}
|
|
|
|
.font-heavy
|
|
{
|
|
font-weight: @font-weight-heavy;
|
|
}
|
|
|
|
.cursor-pointer
|
|
{
|
|
cursor: pointer;
|
|
}
|
|
|
|
.avatar
|
|
{
|
|
padding: 1px;
|
|
}
|
|
|
|
.frappe-fab
|
|
{
|
|
width: @frappe-fab-width;
|
|
height: @frappe-fab-height;
|
|
border-radius: 50%;
|
|
box-shadow: @frappe-fab-box-shadow;
|
|
|
|
&:hover
|
|
{
|
|
box-shadow: @frappe-fab-box-shadow-hover;
|
|
};
|
|
|
|
&.frappe-fab-sm
|
|
{
|
|
width: @frappe-fab-sm;
|
|
height: @frappe-fab-sm;
|
|
};
|
|
|
|
&.frappe-fab-lg
|
|
{
|
|
width: @frappe-fab-lg;
|
|
height: @frappe-fab-lg;
|
|
};
|
|
};
|
|
|
|
.frappe-chat
|
|
{
|
|
.panel
|
|
{
|
|
margin-bottom: 0px !important;
|
|
|
|
.panel-heading
|
|
{
|
|
box-shadow: @frappe-chat-panel-heading-box-shadow;
|
|
}
|
|
|
|
.panel-body
|
|
{
|
|
padding: @frappe-chat-panel-body-padding;
|
|
}
|
|
|
|
.frappe-chat-room-footer
|
|
{
|
|
position: absolute;
|
|
bottom: 0px;
|
|
}
|
|
}
|
|
|
|
.frappe-chat-form
|
|
{
|
|
.form-control
|
|
{
|
|
font-size: @frappe-chat-form-font-size;
|
|
}
|
|
|
|
.dropdown-menu
|
|
{
|
|
border-radius: @frappe-chat-form-menu-border-radius;
|
|
}
|
|
|
|
.btn
|
|
{
|
|
border-radius: 0px !important;
|
|
}
|
|
|
|
.list-group
|
|
{
|
|
margin-bottom: 0px !important;
|
|
max-height: @frappe-chat-form-list-group-height;
|
|
overflow-y: auto;
|
|
|
|
.list-group-item:first-child, .list-group-item:last-child
|
|
{
|
|
border-radius: 0px !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.frappe-chat-popper
|
|
{
|
|
position: fixed;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
margin: @frappe-chat-popper-margin;
|
|
|
|
z-index: @frappe-chat-popper-z-index;
|
|
|
|
.frappe-chat-popper-collapse
|
|
{
|
|
position: fixed;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
margin: @frappe-chat-popper-margin;
|
|
// margin-bottom: calc(@frappe-chat-popper-margin + 50px);
|
|
|
|
& > .panel
|
|
{
|
|
position: relative;
|
|
box-shadow: @frappe-chat-popper-panel-box-shadow;
|
|
width: @frappe-chat-popper-panel-width;
|
|
height: @frappe-chat-popper-panel-height;
|
|
overflow-y: auto;
|
|
|
|
.panel-body
|
|
{
|
|
width: @frappe-chat-popper-panel-width;
|
|
height: @frappe-chat-popper-panel-height;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
& > .panel-heading
|
|
{
|
|
box-shadow: @frappe-chat-panel-heading-box-shadow;
|
|
|
|
.action
|
|
{
|
|
padding: @frappe-chat-panel-heading-action-padding;
|
|
}
|
|
|
|
a
|
|
{
|
|
color: @color-white;
|
|
}
|
|
|
|
.text-muted
|
|
{
|
|
color: @color-white !important;
|
|
}
|
|
}
|
|
};
|
|
|
|
.panel-span
|
|
{
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0px;
|
|
left: 0px;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
z-index: @frappe-chat-popper-panel-span-z-index;
|
|
overflow: auto;
|
|
border-radius: none;
|
|
};
|
|
};
|
|
};
|
|
|
|
.frappe-chat-emoji
|
|
{
|
|
.dropdown-menu
|
|
{
|
|
min-width: @frappe-chat-emoji-width;
|
|
background: none !important;
|
|
border: none !important;
|
|
}
|
|
|
|
.panel
|
|
{
|
|
margin-bottom: 0 !important;
|
|
height: @frappe-chat-emoji-height;
|
|
|
|
.form-group
|
|
{
|
|
margin-bottom: 0 !important;
|
|
}
|
|
}
|
|
}; |