react-jwchat
Version:
This is an easy-to-use web chat component, based on react.
51 lines (49 loc) • 1.1 kB
CSS
@import '../../style/common.css';
.wrapper_content {
position: relative;
display: flex;
box-sizing: border-box;
border-top: solid 1px rgb(226, 226, 226);
border-bottom: solid 1px rgb(226, 226, 226);
}
.list_block {
flex: auto;
box-sizing: border-box;
overflow: auto;
overflow-x: hidden;
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* IE 10+ */
}
.list_block::-webkit-scrollbar {
display: none; /* Chrome Safari */
}
.scroll_bar_block {
box-sizing: border-box;
width: 8px;
/* border-radius: 4px; */
overflow: hidden;
background-color: white;
transition: all 0.3s;
}
.scroll_bar_block:hover {
background-color: #eee;
}
.scroll_thumb {
display: block;
width: 100%;
background-color: #aaa;
border-radius: 4px;
}
.scroll_thumb:hover {
cursor: pointer;
}
.shadow_top {
box-shadow: inset 0px 5px 10px -5px rgba(0, 0, 0, 0.2);
}
.shadow_bottom {
box-shadow: inset 0px -5px 10px -5px rgba(0, 0, 0, 0.2);
}
.shadow_vertical {
box-shadow: inset 0px 5px 10px -5px rgba(0, 0, 0, 0.2),
inset 0px -5px 10px -5px rgba(0, 0, 0, 0.2);
}