wip new panel

tests_hugo/chat_node/chat_client/chat.html

@@ -42,12 +42,11 @@
 			--------------------------------- -->
 
 			<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>
+				<p class="__center">list of your rooms :</p>
+				<div id="chat_room_list">
+					<div class="chat_room_name __show_if_only_child">
+						<p class="__center">/ you have no chat room yet /</p>
 					</div>
-					<!-- placeholders
-					-->
 					<button class="chat_room_name" onclick="layout('room')">
 						<p>a room</p>
 					</button>
@@ -57,7 +56,8 @@
 					<button class="chat_room_name" onclick="layout('room')">
 						<p>placeholder</p>
 					</button>
-					<!-- END placeholders -->
+					<!-- placeholders -------
+					---- END placeholders -->
 				</div>
 			</div>
 
@@ -77,8 +77,7 @@
 			</div>
 
 			<div class="chat_item chat_panel chat_panel_new" id="chat_panel_new">
-				<!-- content -->
-				panel new
+				<button id="create_new_room_btn"><p>create</p></button>
 			</div>
 
 			<div class="chat_item chat_panel chat_panel_settings" id="chat_panel_settings">

tests_hugo/chat_node/chat_client/style/chat.css

@@ -1,4 +1,8 @@
 
+/*
+cxv
+*/
+
 @import 'chat__global.css';
 
 @import 'layout_close.css';

tests_hugo/chat_node/chat_client/style/chat__global.css

@@ -6,12 +6,12 @@
 	font-size: 15px;
 }
 
-/* show first child only if it's alone
+/* show child only if it's alone
 */
-#chat_box .__first_child_vanish > *#chat_home_no_room_yet {
+#chat_box .__show_if_only_child {
 	display: none;
 }
-#chat_box .__first_child_vanish > *#chat_home_no_room_yet:only-child {
+#chat_box .__show_if_only_child:only-child {
 	display: flex;
 	color: rgb(100, 100, 100);
 }
@@ -22,3 +22,16 @@
 #chat_box .chat_item.chat_panel {
 	border-top: 1px solid black;
 }
+
+
+/* text center
+*/
+#chat_box p.__center {
+	text-align: center;
+}
+
+#chat_box .chat_item > * {
+	margin: 0px;
+}
+
+

tests_hugo/chat_node/chat_client/style/chat_room_list.css

@@ -1,9 +1,9 @@
 
 /* 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;
@@ -15,7 +15,6 @@
 }
 
 #chat_box #chat_panel_home .chat_room_name p {
-	margin: 0px;
-	text-align: start;
+	margin-left: 0px;
 }
 

tests_hugo/chat_node/chat_client/style/chat_write.css

@@ -1,3 +1,7 @@
+
+.chat_item#chat_panel_write {
+	border: 1px solid black;
+}
 .chat_item#chat_panel_write .text_area {
 	display: block;
 	position: absolute;
@@ -13,7 +17,6 @@
 	overflow-x: hidden;
 	overflow-y: scroll;
 	background-color: white;
-	border: 1px solid black;
 }
 .chat_item#chat_panel_write .text_area div {
 	display: block ruby;

tests_hugo/chat_node/chat_client/style/layout_new.css

@@ -21,3 +21,8 @@
 	pointer-events: none;
 }
 
+#chat_box.new .chat_item button#create_new_room_btn {
+	margin: 10px 0px;
+}
+
+