style button back
This commit is contained in:
@@ -6,7 +6,6 @@
|
|||||||
@import 'action_board.css';
|
@import 'action_board.css';
|
||||||
*/
|
*/
|
||||||
|
|
||||||
@import 'chat_buttons.css';
|
|
||||||
@import 'layout_close.css';
|
@import 'layout_close.css';
|
||||||
@import 'layout_home.css';
|
@import 'layout_home.css';
|
||||||
@import 'layout_room.css';
|
@import 'layout_room.css';
|
||||||
@@ -17,6 +16,8 @@
|
|||||||
@import 'layout_create.css';
|
@import 'layout_create.css';
|
||||||
@import 'layout_user.css';
|
@import 'layout_user.css';
|
||||||
@import 'layout_mute.css';
|
@import 'layout_mute.css';
|
||||||
|
@import 'chat_buttons.css';
|
||||||
|
@import 'chat_back.css';
|
||||||
|
|
||||||
|
|
||||||
/* vanish elements wihtout display:none;
|
/* vanish elements wihtout display:none;
|
||||||
@@ -97,47 +98,3 @@ input.vanish {
|
|||||||
border: 1px solid black;
|
border: 1px solid black;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/*
|
|
||||||
* COLLAPSE
|
|
||||||
|
|
||||||
.chat._item:not(.open_close) {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#chat_input:checked ~
|
|
||||||
#chat_box {
|
|
||||||
gap: 5px;
|
|
||||||
padding: 5px;
|
|
||||||
width: 300px;
|
|
||||||
height: 400px;
|
|
||||||
}
|
|
||||||
#chat_input:checked ~
|
|
||||||
#chat_box .chat._item {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
#chat_input:checked ~
|
|
||||||
#chat_box .chat._item.open_close p {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#chat_input:checked ~
|
|
||||||
#chat_box .chat._item.open_close {
|
|
||||||
width: 30px;
|
|
||||||
height: 20px;
|
|
||||||
padding: 0px;
|
|
||||||
justify-self: end;
|
|
||||||
background-color: transparent;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
#chat_input:checked ~
|
|
||||||
#chat_box .chat._item.open_close::before {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
height: 2px;
|
|
||||||
width: 15px;
|
|
||||||
background-color: black;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
|
|||||||
16
tests_hugo/chat_node/chat_client/style/chat_back.css
Normal file
16
tests_hugo/chat_node/chat_client/style/chat_back.css
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
#chat_box .chat_item.chat_back {
|
||||||
|
width: 30px;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
.chat_back::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: calc(50% - 10px - 1px);
|
||||||
|
left: 10px;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border-left: 1px solid black;
|
||||||
|
border-bottom: 1px solid black;
|
||||||
|
transform: rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
@@ -8,11 +8,10 @@
|
|||||||
border: none;
|
border: none;
|
||||||
background-color: rgb(220, 220, 220);
|
background-color: rgb(220, 220, 220);
|
||||||
}
|
}
|
||||||
#chat_box button:focus,
|
|
||||||
#chat_box button:hover {
|
#chat_box button:hover {
|
||||||
background-color: rgb(200, 200, 200);
|
background-color: rgb(200, 200, 200);
|
||||||
}
|
}
|
||||||
.chat_box button:active {
|
#chat_box button:active {
|
||||||
background-color: rgb(220, 220, 220);
|
background-color: rgb(190, 190, 190);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -12,3 +12,47 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
* COLLAPSE
|
||||||
|
|
||||||
|
.chat._item:not(.open_close) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#chat_input:checked ~
|
||||||
|
#chat_box {
|
||||||
|
gap: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
width: 300px;
|
||||||
|
height: 400px;
|
||||||
|
}
|
||||||
|
#chat_input:checked ~
|
||||||
|
#chat_box .chat._item {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
#chat_input:checked ~
|
||||||
|
#chat_box .chat._item.open_close p {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#chat_input:checked ~
|
||||||
|
#chat_box .chat._item.open_close {
|
||||||
|
width: 30px;
|
||||||
|
height: 20px;
|
||||||
|
padding: 0px;
|
||||||
|
justify-self: end;
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
#chat_input:checked ~
|
||||||
|
#chat_box .chat._item.open_close::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
height: 4px;
|
||||||
|
width: 15px;
|
||||||
|
background-color: black;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user