wip layout home room list
This commit is contained in:
@@ -41,7 +41,27 @@
|
||||
id="msg_thread"
|
||||
--------------------------------- -->
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_msg" id="chat_panel_msg">
|
||||
<div class="chat_item chat_panel chat_panel_home" id="chat_panel_home">
|
||||
<div id="chat_room_list" class="__first_child_vanish">
|
||||
<div class="chat_room_name" id="chat_home_no_room_yet">
|
||||
<p>/ you have no chat room yet /</p>
|
||||
</div>
|
||||
<!-- placeholders
|
||||
-->
|
||||
<button class="chat_room_name">
|
||||
<p>a room</p>
|
||||
</button>
|
||||
<button class="chat_room_name">
|
||||
<p>another room</p>
|
||||
</button>
|
||||
<div class="chat_room_name">
|
||||
<p>placeholder</p>
|
||||
</div>
|
||||
<!-- END placeholders -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_msg" id="chat_panel_msg">
|
||||
<div id="chat_msg_thread">
|
||||
<!-- placeholder -->
|
||||
<div class="chat_msg bob">
|
||||
@@ -56,61 +76,42 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_home" id="chat_panel_home">
|
||||
<div id="chat_room_list" class="_first_child_vanish">
|
||||
<div class="chat_room_name">
|
||||
<p>you don't have any chat yet</p>
|
||||
</div>
|
||||
<!-- placeholders -->
|
||||
<div class="chat_room_name">
|
||||
<p>placeholder</p>
|
||||
</div>
|
||||
<div class="chat_room_name">
|
||||
<p>placeholder</p>
|
||||
</div>
|
||||
<div class="chat_room_name">
|
||||
<p>placeholder</p>
|
||||
</div>
|
||||
<!-- END placeholders -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_new" id="chat_panel_new">
|
||||
<div class="chat_item chat_panel chat_panel_new" id="chat_panel_new">
|
||||
<!-- content -->
|
||||
panel new
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_settings" id="chat_panel_settings">
|
||||
<div class="chat_item chat_panel chat_panel_settings" id="chat_panel_settings">
|
||||
<!-- content -->
|
||||
panel settings
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_room_set" id="chat_panel_room_set">
|
||||
<div class="chat_item chat_panel chat_panel_room_set" id="chat_panel_room_set">
|
||||
<!-- content -->
|
||||
panel room settings
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_protected" id="chat_panel_protected">
|
||||
<div class="chat_item chat_panel chat_panel_protected" id="chat_panel_protected">
|
||||
<!-- content -->
|
||||
panel protected
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_create" id="chat_panel_create">
|
||||
<div class="chat_item chat_panel chat_panel_create" id="chat_panel_create">
|
||||
<!-- content -->
|
||||
panel create
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_user" id="chat_panel_user">
|
||||
<div class="chat_item chat_panel chat_panel_user" id="chat_panel_user">
|
||||
<!-- content -->
|
||||
panel user
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_mute" id="chat_panel_mute">
|
||||
<div class="chat_item chat_panel chat_panel_mute" id="chat_panel_mute">
|
||||
<!-- content -->
|
||||
panel mute
|
||||
</div>
|
||||
|
||||
<div class="chat_item chat_panel chat_panel_write" id="chat_panel_write">
|
||||
<div class="chat_item chat_panel chat_panel_write" id="chat_panel_write">
|
||||
<div class="text_area" contenteditable></div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -17,6 +17,7 @@
|
||||
@import 'chat_close.css';
|
||||
@import 'chat_write.css';
|
||||
@import 'chat_msg.css';
|
||||
@import 'chat_room_list.css';
|
||||
|
||||
/*
|
||||
@import '_chat_controls.css';
|
||||
|
||||
@@ -1,3 +1,17 @@
|
||||
|
||||
/* p in chat_box
|
||||
*/
|
||||
#chat_box p {
|
||||
padding: 10px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/* show first child only if it's alone
|
||||
*/
|
||||
#chat_box .__first_child_vanish > *#chat_home_no_room_yet {
|
||||
display: none;
|
||||
}
|
||||
#chat_box .__first_child_vanish > *#chat_home_no_room_yet:only-child {
|
||||
display: flex;
|
||||
color: rgb(100, 100, 100);
|
||||
}
|
||||
|
||||
21
tests_hugo/chat_node/chat_client/style/chat_room_list.css
Normal file
21
tests_hugo/chat_node/chat_client/style/chat_room_list.css
Normal file
@@ -0,0 +1,21 @@
|
||||
|
||||
/* chat home rooms list
|
||||
*/
|
||||
#chat_box .chat_item#chat_panel_home #chat_room_list {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
#chat_box #chat_panel_home .chat_room_name {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
/* add or remove '.chat_item' to toggle the hover effect */
|
||||
#chat_box button.chat_room_name {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#chat_box #chat_panel_home .chat_room_name p {
|
||||
margin: 0px;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
@@ -52,3 +52,4 @@
|
||||
*/
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user