2023-01-16 12:08:24 +00:00
|
|
|
html,
|
|
|
|
body,
|
|
|
|
#root {
|
|
|
|
height: 100%;
|
|
|
|
overscroll-behavior: none;
|
|
|
|
}
|
|
|
|
|
2023-01-19 22:54:39 +00:00
|
|
|
*::selection {
|
|
|
|
color: #fff;
|
|
|
|
background: hsla(229, 71%, 57%, 1);
|
|
|
|
}
|
|
|
|
|
2023-01-16 12:08:24 +00:00
|
|
|
#app {
|
|
|
|
height: 100%;
|
|
|
|
display: grid;
|
2023-01-18 15:43:23 +00:00
|
|
|
grid-template-columns: 352px 1fr auto;
|
2023-01-16 12:08:24 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
#main {
|
2023-02-14 16:36:38 +00:00
|
|
|
position: relative;
|
2023-01-16 12:08:24 +00:00
|
|
|
display: grid;
|
|
|
|
grid-template-rows: 56px 1fr 100px;
|
2023-01-18 15:43:23 +00:00
|
|
|
height: 100vh;
|
2023-01-16 12:08:24 +00:00
|
|
|
}
|
2023-01-18 13:15:51 +00:00
|
|
|
|
2023-01-19 22:54:39 +00:00
|
|
|
/* #main,
|
|
|
|
#sidebar,
|
|
|
|
#members,
|
|
|
|
#main > div {
|
|
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
} */
|
|
|
|
|
2023-02-10 16:25:13 +00:00
|
|
|
.composer-input::placeholder {
|
|
|
|
transition: color 0.2s ease-in-out;
|
|
|
|
}
|
|
|
|
|
2023-01-18 13:15:51 +00:00
|
|
|
#sidebar {
|
|
|
|
overflow: auto;
|
|
|
|
height: 100vh;
|
|
|
|
}
|
2023-01-18 15:43:23 +00:00
|
|
|
|
|
|
|
#content {
|
|
|
|
overflow: auto;
|
2023-02-10 16:25:13 +00:00
|
|
|
padding: 72px 8px 132px 8px;
|
|
|
|
height: 100vh;
|
|
|
|
margin-top: -56px;
|
2023-01-18 15:43:23 +00:00
|
|
|
}
|
|
|
|
|
2023-02-14 16:36:38 +00:00
|
|
|
#composer {
|
|
|
|
position: absolute;
|
|
|
|
bottom: 0;
|
|
|
|
left: 0;
|
|
|
|
right: 0;
|
|
|
|
}
|
|
|
|
|
2023-01-18 15:43:23 +00:00
|
|
|
#members {
|
|
|
|
width: 352px;
|
2023-01-19 22:54:39 +00:00
|
|
|
overflow: auto;
|
2023-01-18 15:43:23 +00:00
|
|
|
}
|
2023-02-14 16:36:38 +00:00
|
|
|
|
|
|
|
@media screen and (max-width: 768px) {
|
|
|
|
#app {
|
|
|
|
grid-template-columns: 1fr;
|
|
|
|
}
|
|
|
|
|
|
|
|
#sidebar {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
}
|