Merge pull request 'Fix CSS Formatting' (#5) from cleanup_css into main
Reviewed-on: #5
This commit is contained in:
commit
125211cabc
|
@ -1,6 +1,6 @@
|
||||||
diagrams
|
diagrams
|
||||||
next
|
next
|
||||||
notes
|
notes
|
||||||
screenshots/lykin_gui_*
|
screenshots/lykin_*
|
||||||
/target
|
/target
|
||||||
src/*.bak
|
src/*.bak
|
||||||
|
|
|
@ -1,157 +1,153 @@
|
||||||
.content {
|
.content {
|
||||||
background-color: lightyellow;
|
background-color: lightyellow;
|
||||||
border: 5px solid #ffd700;
|
border: 5px solid #ffd700;
|
||||||
border-radius: 1rem;
|
border-radius: 1rem;
|
||||||
grid-area: content;
|
grid-area: content;
|
||||||
padding: 1.5rem;
|
padding: 1.5rem;
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
word-wrap: anywhere;
|
word-wrap: anywhere;
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.disabled {
|
.disabled {
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flash-message {
|
.flash-message {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
color: red;
|
color: red;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-container {
|
.flex-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-container > input {
|
.flex-container > input {
|
||||||
margin: 0.3rem;
|
margin: 0.3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.grid-container {
|
.grid-container {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
grid-template-rows: 1fr 1fr 1fr 3fr;
|
grid-template-rows: 1fr 1fr 1fr 3fr;
|
||||||
grid-template-areas:
|
grid-template-areas: 'nav' 'peers' 'posts' 'content';
|
||||||
'nav'
|
grid-gap: 0.5rem;
|
||||||
'peers'
|
padding-left: 1rem;
|
||||||
'posts'
|
padding-right: 1rem;
|
||||||
'content';
|
padding-top: 0.2rem;
|
||||||
grid-gap: 0.5rem;
|
overflow: hidden;
|
||||||
padding-left: 1rem;
|
height: 85vh;
|
||||||
padding-right: 1rem;
|
|
||||||
padding-top: 0.2rem;
|
|
||||||
overflow: hidden;
|
|
||||||
height: 85vh;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (min-width: 600px) {
|
@media only screen and (min-width: 600px) {
|
||||||
.grid-container {
|
.grid-container {
|
||||||
grid-template-columns: repeat(4, 1fr);
|
grid-template-columns: repeat(4, 1fr);
|
||||||
grid-template-rows: 1fr 3fr 4fr;
|
grid-template-rows: 1fr 3fr 4fr;
|
||||||
grid-template-areas:
|
grid-template-areas:
|
||||||
'nav nav nav nav nav'
|
'nav nav nav nav nav'
|
||||||
'peers posts posts posts posts'
|
'peers posts posts posts posts'
|
||||||
'peers content content content content';
|
'peers content content content content';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
margin-left: 1rem;
|
margin-left: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav {
|
.nav {
|
||||||
background-color: lightgreen;
|
background-color: lightgreen;
|
||||||
border: 5px solid #19a974;
|
border: 5px solid #19a974;
|
||||||
border-radius: 1rem;
|
border-radius: 1rem;
|
||||||
grid-area: nav;
|
grid-area: nav;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.peers {
|
.peers {
|
||||||
background-color: lightblue;
|
background-color: lightblue;
|
||||||
border: 5px solid #357edd;
|
border: 5px solid #357edd;
|
||||||
border-radius: 1rem;
|
border-radius: 1rem;
|
||||||
grid-area: peers;
|
grid-area: peers;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.peers > ul {
|
.peers > ul {
|
||||||
padding-left: 1rem;
|
padding-left: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.peers > ul > li > a {
|
.peers > ul > li > a {
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
.peers > ul > li > a > p {
|
.peers > ul > li > a > p {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding-right: 1rem;
|
padding-right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post > ul {
|
.post > ul {
|
||||||
padding-left: 1rem;
|
padding-left: 1rem;
|
||||||
padding-right: 1rem;
|
padding-right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.posts {
|
.posts {
|
||||||
background-color: bisque;
|
background-color: bisque;
|
||||||
border: 5px solid #ff6300;
|
border: 5px solid #ff6300;
|
||||||
border-radius: 1rem;
|
border-radius: 1rem;
|
||||||
grid-area: posts;
|
grid-area: posts;
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
.posts > ul {
|
.posts > ul {
|
||||||
padding-left: 1rem;
|
padding-left: 1rem;
|
||||||
padding-right: 1rem;
|
padding-right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.posts > ul > li > a {
|
.posts > ul > li > a {
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
.posts > ul > li > a > p {
|
.posts > ul > li > a > p {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.selected {
|
.selected {
|
||||||
background-color: #f9c587;
|
background-color: #f9c587;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
|
|
||||||
code {
|
code {
|
||||||
word-wrap: anywhere;
|
word-wrap: anywhere;
|
||||||
}
|
}
|
||||||
|
|
||||||
form {
|
form {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: 0.5rem;
|
margin-right: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
margin-left: 1rem;
|
margin-left: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
img {
|
img {
|
||||||
width: 3rem;
|
width: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue