75 lines
942 B
CSS
75 lines
942 B
CSS
html,
|
|
body,
|
|
#root {
|
|
height: 100%;
|
|
overscroll-behavior: none;
|
|
}
|
|
|
|
*::selection {
|
|
color: #fff;
|
|
background: hsla(229, 71%, 57%, 1);
|
|
}
|
|
|
|
#app {
|
|
height: 100%;
|
|
display: grid;
|
|
grid-template-columns: 352px 1fr auto;
|
|
}
|
|
|
|
#main {
|
|
position: relative;
|
|
display: grid;
|
|
grid-template-rows: 56px 1fr 100px;
|
|
height: 100vh;
|
|
}
|
|
|
|
/* #main,
|
|
#sidebar,
|
|
#members,
|
|
#main > div {
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
} */
|
|
|
|
.composer-input::placeholder {
|
|
transition: color 0.2s ease-in-out;
|
|
}
|
|
|
|
#sidebar {
|
|
overflow: auto;
|
|
height: 100vh;
|
|
}
|
|
|
|
#content {
|
|
position: relative;
|
|
overflow: auto;
|
|
padding: 40px 0px 0px 0px;
|
|
height: 100vh;
|
|
margin-top: -56px;
|
|
}
|
|
|
|
#messages {
|
|
padding: 32px 8px;
|
|
}
|
|
|
|
#composer {
|
|
position: sticky;
|
|
bottom: 0;
|
|
left: 0;
|
|
z-index: 100;
|
|
}
|
|
|
|
#members {
|
|
width: 352px;
|
|
overflow: auto;
|
|
}
|
|
|
|
@media screen and (max-width: 768px) {
|
|
#app {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
#sidebar {
|
|
display: none;
|
|
}
|
|
}
|