1
0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-02-19 14:54:47 +01:00
nes.css/style.css

107 lines
1.6 KiB
CSS

body {
padding: 0 2rem;
margin: 2rem;
}
.nes-container:not(:last-child) {
margin-bottom: 1rem;
}
i.brand {
margin-right: 1rem;
}
div.containers > .nes-container {
display: inline-block;
max-width: 400px;
}
div.tables {
display: flex;
flex-wrap: wrap;
}
div.tables > .nes-table {
min-width: 350px;
max-width: calc(50% - 2rem);
}
div.tables > .nes-table:first-child {
margin-right: 2rem;
margin-bottom: 2rem;
}
.balloon.nes-container .nes-balloon {
max-width: 600px;
margin: 2rem 2rem;
}
.balloon.nes-container .messages {
display: flex;
flex-direction: column;
}
.balloon.nes-container .message {
display: flex;
}
.balloon.nes-container .message i {
align-self: flex-end;
}
.balloon.nes-container .message.-left {
align-self: flex-start;
}
.balloon.nes-container .message.-right {
align-self: flex-end;
}
.form.nes-container > .nes-field:not(:last-child) {
margin-bottom: 1rem;
}
.footer {
text-align: center;
}
.footer a {
color: #333;
text-decoration: none;
}
.github-link {
position: fixed;
top: 10px;
right: 10px;
z-index: 999;
display: flex;
height: 100px;
color: #333;
text-decoration: none;
}
.github-link:hover {
text-decoration: none;
}
.github-link > p.nes-balloon {
align-self: flex-start;
padding: 0.2rem 0.5rem;
font-size: 0.8rem;
color: #333;
}
.github-link > i.nes-octocat {
align-self: flex-end;
}
@media screen and (max-width: 768px) {
body {
padding: 0;
margin: 2rem 0.2rem;
}
div.tables > .nes-table {
max-width: 100%;
margin-right: 0;
}
.balloon.nes-container .nes-balloon {
max-width: 70%;
}
.github-link {
display: none;
}
}