86 lines
1.4 KiB
CSS
86 lines
1.4 KiB
CSS
.nav {
|
|
background-color: lightgreen;
|
|
border: 5px solid #19A974;
|
|
border-radius: 15px;
|
|
grid-area: nav;
|
|
padding: 1rem;
|
|
}
|
|
|
|
.peers {
|
|
background-color: lightblue;
|
|
border: 5px solid #357EDD;
|
|
border-radius: 15px;
|
|
grid-area: peers;
|
|
}
|
|
|
|
.posts {
|
|
background-color: bisque;
|
|
border: 5px solid #FF6300;
|
|
border-radius: 15px;
|
|
grid-area: posts;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.post > ul {
|
|
padding-left: 25px;
|
|
padding-right: 25px;
|
|
}
|
|
|
|
.content {
|
|
background-color: lightyellow;
|
|
border: 5px solid #FFD700;
|
|
border-radius: 15px;
|
|
grid-area: content;
|
|
padding: 1.5rem;
|
|
overflow-y: scroll;
|
|
word-wrap: anywhere;
|
|
}
|
|
|
|
.container {
|
|
height: 100%;
|
|
width: 100%;
|
|
margin: 0;
|
|
}
|
|
|
|
/*
|
|
.flex-container {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
*/
|
|
|
|
.grid-container {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 1fr);
|
|
grid-template-rows: 1fr 3fr 4fr;
|
|
grid-template-areas:
|
|
'nav nav nav nav nav'
|
|
'peers posts posts posts posts'
|
|
'peers content content content content';
|
|
grid-gap: 10px;
|
|
padding-left: 15px;
|
|
padding-right: 15px;
|
|
padding-top: 5px;
|
|
overflow: hidden;
|
|
height: 85vh;
|
|
}
|
|
|
|
.grid-container > div {
|
|
/* background-color: rgba(255, 255, 255, 0.8); */
|
|
/* text-align: center; */
|
|
/* padding: 20px 0; */
|
|
/* font-size: 30px; */
|
|
}
|
|
|
|
.flex-container {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.flex-container > input {
|
|
margin: 5px;
|
|
}
|
|
|
|
a { text-decoration: none; color: black; }
|