FediBooks/app/static/style.css

214 lines
2.9 KiB
CSS

body {
font-family: "Roboto", sans-serif;
margin: 2%;
background-color: #282c37;
color: white;
}
* {
box-sizing: border-box;
}
.container {
background-color: #444a5c;
padding: 10px;
}
.light {
background-color: #4d5366;
}
.column {
flex-grow: 1;
flex-basis: 0;
padding: 10px;
}
.large {
font-size: 1.2em;
}
.small {
font-size: 0.8em;
}
.tiny {
font-size: 0.5em;
}
.centred {
text-align: center;
}
.thin {
font-weight: 300;
}
.subtle {
color: #ccc;
}
.row {
display: flex;
}
.full-width {
width: 100%;
}
.no-margin {
margin: 0;
}
.left-align {
text-align: left;
}
.panel-icon {
width: 100px;
height: 100px;
background: center/contain url("/img/bot_generic.png");
background-repeat: no-repeat;
}
.panel-icon.large {
width: 150px;
height: 150px;
}
.panel-icon.online, .panel-icon.offline {
width: 105px;
}
.panel-icon.online {
border-left: 5px #5c5 solid;
}
.panel-icon.offline {
border-left: 5px #c33 solid;
}
.panel-icon, .panel-text, .panel-actions {
display: inline-block;
align-self: center;
}
.panel-text {
flex-grow: 1;
margin: 0 0 10px 15px;
}
.panel-name {
font-size: 1.8em;
margin: 10px 0;
}
.panel-actions {
margin-right: 10px;
}
.button {
color: white;
line-height: 1.2em;
padding: 10px;
text-decoration: none;
display: inline-block;
margin: 5px 0;
transition: 0.2s linear;
border: none;
}
.button:visited {
color: white;
}
input.button, button.button {
font-size: 1em;
cursor: pointer;
}
.btn-primary {
background-color: #9370db;
border-color: #9370db;
}
.btn-primary:hover {
background-color: #7859b6;
border-color: #7859b6;
}
.btn-secondary {
background-color: #999;
}
.btn-secondary:hover {
background-color: #777;
}
.btn-large, button.btn-large {
font-size: 1.6em;
}
.btn-dangerous {
background-color: #e22;
}
.btn-dangerous:hover {
background-color: #c22;
}
a {
color: mediumpurple;
text-decoration: none;
}
a:visited {
color: mediumpurple;
}
p {
line-height: 1.4em;
}
h1 {
font-size: 4em;
margin-top: 10px !important;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 400;
margin: 0;
}
form {
display: inline-block;
}
label.important {
font-size: 1.4em;
margin: 10px 0;
font-weight: 300;
display: block;
}
input, select, textarea {
font-size: 1.2em;
line-height: 1.4em;
border: 3px grey solid;
border-radius: none;
padding: 3px;
font-family: "Roboto", sans-serif;
}
input:focus, select:focus, textarea:focus {
border: 3px mediumpurple solid;
}
input[type="checkbox"] {
height: 1.4em;
}
label, input {
flex-basis: 0;
text-align: left;
}
label {
flex-grow: 1;
}
form .row {
margin: 10px 0;
}
.coming-soon {
height: 200px;
width: 200px;
background: center/contain url("https://lynnesbian.space/img/bune.png");
display: inline-block;
}
.error, .success {
color: white;
text-align: center;
font-size: 1.6em;
padding: 10px;
}
.error {
background-color: #e66;
}
.error.err-small {
font-size: 1.0em;
}
.success {
background-color: #6e6;
}