fixed css error in write area expansion
This commit is contained in:
@@ -4,7 +4,7 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="./style/chat.css" type="text/css" rel="stylesheet">
|
||||
<script src="./chat_test_layouts.js" defer></script>
|
||||
<script src="./_test_layouts.js" defer></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
@@ -1,78 +0,0 @@
|
||||
|
||||
.chat._item.main_window .action_board {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-color: transparent;
|
||||
pointer-events: none;
|
||||
}
|
||||
.chat._item.main_window .action_board .action_pannel {
|
||||
/*
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
*/
|
||||
opacity: 0;
|
||||
background-color: white;
|
||||
pointer-events: none;
|
||||
}
|
||||
/* style the close croice */
|
||||
label.close_croice {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
label.close_croice::before,
|
||||
label.close_croice::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 20px;
|
||||
height: 1px;
|
||||
background-color: black;
|
||||
}
|
||||
label.close_croice::before {
|
||||
transform: translate(-50%, -50%) rotate(45deg);
|
||||
}
|
||||
label.close_croice::after {
|
||||
transform: translate(-50%, -50%) rotate(-45deg);
|
||||
}
|
||||
|
||||
|
||||
/* * * * * * * * * * * * * *
|
||||
DIRECT MESSAGES
|
||||
*/
|
||||
|
||||
/* show action board and _create */
|
||||
input#new_room_form:focus ~ #chat_box #action_board ._create,
|
||||
#action_board ._create:focus-within {
|
||||
/*
|
||||
display: flex;
|
||||
visibility: visible;
|
||||
*/
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* settings */
|
||||
#action_board ._create {
|
||||
height: 100%;
|
||||
}
|
||||
#action_board ._create ._title {
|
||||
text-align: center;
|
||||
}
|
||||
#action_board ._create ._search {
|
||||
position: sticky;
|
||||
top: 0px;
|
||||
margin: 10px;
|
||||
}
|
||||
#action_board ._create ._list {
|
||||
border: 1px solid red;
|
||||
}
|
||||
|
||||
@@ -1,24 +0,0 @@
|
||||
|
||||
.chat._item.controls_area {
|
||||
flex-direction: row;
|
||||
}
|
||||
.chat._item.controls_area .control {
|
||||
margin: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
.chat._item.controls_area .control p {
|
||||
margin: 0px;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.chat._item.controls_area .control label {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
.chat._item.controls_area .control p:hover {
|
||||
background-color: rgb(210, 210, 210);
|
||||
}
|
||||
.chat._item.controls_area .control p:active {
|
||||
background-color: rgb(180, 180, 180);
|
||||
}
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
|
||||
.chat_item#chat_panel_write {
|
||||
border: 1px solid black;
|
||||
#chat_box .chat_item#chat_panel_write {
|
||||
border: none;
|
||||
overflow: visible;
|
||||
}
|
||||
.chat_item#chat_panel_write .text_area {
|
||||
#chat_box .chat_item#chat_panel_write .text_area {
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
@@ -17,7 +18,8 @@
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
background-color: white;
|
||||
border: 1px solid black;
|
||||
}
|
||||
.chat_item#chat_panel_write .text_area div {
|
||||
#chat_box .chat_item#chat_panel_write .text_area div {
|
||||
display: block ruby;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user