344 lines
5.4 KiB
CSS
344 lines
5.4 KiB
CSS
/*
|
|
* envs.net - CSS Style
|
|
* © 2019-2021
|
|
* thanks envs.net for such nice css! ~grizzly
|
|
*/
|
|
|
|
/* @import "https://grizzly.tilde.institute/fonts/jetbrains-mono/font.css"; */
|
|
|
|
* { font-family: 'JetBrains Mono', 'monospace'; }
|
|
|
|
|
|
body, input, select, textarea {
|
|
color: #333;
|
|
font-size: 10pt;
|
|
line-height: 1.65em;
|
|
letter-spacing: -0.015em;
|
|
}
|
|
|
|
body {
|
|
background: #f5f5f5;
|
|
}
|
|
|
|
footer {
|
|
position: fixed;
|
|
text-align: center;
|
|
bottom: 0;
|
|
width: 100%;
|
|
padding: 1em;
|
|
background: #f5f5f5;
|
|
}
|
|
|
|
#main {
|
|
float: left;
|
|
margin: 0 0 2em 4em;
|
|
padding-bottom: 4em;
|
|
}
|
|
|
|
#header_sub { margin-left: 6em; }
|
|
|
|
#sidebar {
|
|
float: right;
|
|
padding: 0 2.5em 2.5em 0;
|
|
}
|
|
|
|
#left_box {
|
|
float: left;
|
|
padding-right: 1em;
|
|
}
|
|
|
|
a {
|
|
outline: none;
|
|
border-bottom-color: transparent;
|
|
text-decoration: none;
|
|
color: #10A0A0;
|
|
}
|
|
a:hover { border-bottom: dotted 1px; }
|
|
|
|
summary.menu { outline: none; }
|
|
summary.menu:hover {
|
|
cursor: pointer;
|
|
color: #10A0A0;
|
|
}
|
|
|
|
blockquote {
|
|
border-left: solid 4px #e5e5e5;
|
|
font-style: italic;
|
|
margin: 0;
|
|
padding: 0 0 1.5em 4em;
|
|
}
|
|
|
|
code {
|
|
font-family: monospace;
|
|
background: #e5e5e5;
|
|
color: #333;
|
|
}
|
|
|
|
pre {
|
|
margin-bottom: 0;
|
|
padding: 0;
|
|
}
|
|
pre.clean {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
pre.banner {
|
|
line-height: 1.2em;
|
|
margin-bottom: 1em;
|
|
padding: 0;
|
|
}
|
|
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
display: block;
|
|
line-height: 0;
|
|
margin: 0;
|
|
padding: 0.8em 0 0.4em 0;
|
|
}
|
|
|
|
hr.half {
|
|
width:50%;
|
|
text-align:left;
|
|
margin-left:0;
|
|
}
|
|
|
|
li {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
ol, ul {
|
|
margin: 0;
|
|
padding: 0 0 0 2em;
|
|
}
|
|
|
|
.ol.userlist, ul.userlist {
|
|
list-style-type: none;
|
|
margin: 0;
|
|
padding: 0 0 0 1.2em;
|
|
}
|
|
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
width: 100%;
|
|
}
|
|
|
|
tr, th, td {
|
|
text-align: left;
|
|
padding: 0;
|
|
}
|
|
|
|
.table_pkg tbody tr:nth-child(even) {
|
|
background: #e5e5e5;
|
|
}
|
|
|
|
.tw20 { width: 20px; }
|
|
.tw25 { width: 25px; }
|
|
.tw80 { width: 80px; }
|
|
.tw100 { width: 100px; }
|
|
.tw110 { width: 110px; }
|
|
.tw130 { width: 130px; }
|
|
.tw140 { width: 140px; }
|
|
.tw160 { width: 160px; }
|
|
.tw280 { width: 280px; }
|
|
|
|
|
|
form {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
textarea {
|
|
padding: 0.3em 1em 0.3em 1em;
|
|
margin: 0 0 -0.5em 0;
|
|
border: solid 1px #333;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
input {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
input[type=button], input[type=submit], input[type=text] {
|
|
background-color: #e5e5e5;
|
|
color: #333;
|
|
border-radius: 10px;
|
|
border: solid 1px #333;
|
|
text-decoration: none;
|
|
padding: 0.3em 1em 0.3em 1em;
|
|
}
|
|
|
|
input[type=button]:hover, input[type=submit]:hover {
|
|
background-color: #211921;
|
|
color: #ddd;
|
|
}
|
|
|
|
input[type=file] {
|
|
color: #333;
|
|
background-color: #f5f5f5;
|
|
padding: 0.3em 1em 0.3em 0;
|
|
}
|
|
|
|
button {
|
|
border-radius: 10px;
|
|
border: none;
|
|
text-decoration: none;
|
|
background-color: #e5e5e5;
|
|
color: #333;
|
|
}
|
|
button:hover {
|
|
background-color: #211921;
|
|
color: #FFF5EE;
|
|
}
|
|
|
|
|
|
.clean { margin: 0; padding: 0; }
|
|
|
|
.clear { clear:both; }
|
|
|
|
.mark { color: #10A0A0; }
|
|
|
|
.alert {
|
|
color: #333;
|
|
background: #e5e5e5;
|
|
margin: 0 0 1.5em 0;
|
|
padding: 0.5em 1em 1.5em 1em;
|
|
}
|
|
|
|
.block {
|
|
border-left: solid 4px #e5e5e5;
|
|
margin: 0.8em 0 1em 0;
|
|
padding: 0.8em 0 0.8em 4em;
|
|
}
|
|
|
|
.center {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translateX(-50%) translateY(-50%);
|
|
}
|
|
|
|
.button_back {
|
|
float: left;
|
|
margin-top: 1em;
|
|
margin-left: 0.4em;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
|
|
/*
|
|
* LIGHT MODE
|
|
*/
|
|
body.light-mode {
|
|
background: #f5f5f5;
|
|
color: #333;
|
|
}
|
|
body.light-mode footer {
|
|
border-top: solid 2px #e5e5e5;
|
|
background: #f5f5f5;
|
|
}
|
|
body.light-mode blockquote {
|
|
border-left: solid 4px #e5e5e5;
|
|
}
|
|
body.light-mode code {
|
|
color: #333;
|
|
background: #e5e5e5;
|
|
}
|
|
body.light-mode .table_pkg tbody tr:nth-child(even) {
|
|
background: #e5e5e5;
|
|
}
|
|
body.light-mode input[type=button], body.light-mode input[type=submit], body.light-mode input[type=text] {
|
|
background-color: #e5e5e5;
|
|
color: #333;
|
|
border: solid 1px #333;
|
|
}
|
|
body.light-mode input[type=button]:hover, body.light-mode input[type=submit]:hover {
|
|
background-color: #211921;
|
|
color: #FFF5EE;
|
|
}
|
|
body.light-mode input[type=file] {
|
|
color: #333;
|
|
background-color: #f5f5f5;
|
|
}
|
|
body.light-mode textarea {
|
|
background: #e5e5e5;
|
|
color: #333;
|
|
border: solid 1px #333;
|
|
}
|
|
body.light-mode button {
|
|
background-color: #e5e5e5;
|
|
color: #333;
|
|
}
|
|
body.light-mode button:hover {
|
|
background-color: #211921;
|
|
color: #FFF5EE;
|
|
}
|
|
body.light-mode .alert {
|
|
color: #333;
|
|
background: #e5e5e5;
|
|
}
|
|
body.light-mode .block, body.light-mode .block_head {
|
|
border-left: solid 4px #e5e5e5;
|
|
}
|
|
|
|
|
|
/*
|
|
* DARK MODE
|
|
*/
|
|
body.dark-mode {
|
|
color: #FFF5EE;
|
|
background: #040304;
|
|
}
|
|
body.dark-mode footer {
|
|
border-top: solid 2px #211921;
|
|
background: #040304;
|
|
}
|
|
body.dark-mode blockquote {
|
|
border-left: solid 4px #211921;
|
|
}
|
|
body.dark-mode code {
|
|
color: #ddd;
|
|
background: #211921;
|
|
}
|
|
body.dark-mode .table_pkg tbody tr:nth-child(even) {
|
|
background: #211921;
|
|
}
|
|
body.dark-mode input[type=button], body.dark-mode input[type=submit], body.dark-mode input[type=text] {
|
|
background-color: #211921;
|
|
color: #ddd;
|
|
border: solid 1px #ddd;
|
|
}
|
|
body.dark-mode input[type=button]:hover, body.dark-mode input[type=submit]:hover {
|
|
background-color: #e5e5e5;
|
|
color: #333;
|
|
}
|
|
body.dark-mode input[type=file] {
|
|
color: #ddd;
|
|
background-color: #040304;
|
|
}
|
|
body.dark-mode textarea {
|
|
color: #ddd;
|
|
background: #211921;
|
|
border: solid 1px #ddd;
|
|
}
|
|
body.dark-mode button {
|
|
background-color: #211921;
|
|
color: #ddd;
|
|
}
|
|
body.dark-mode button:hover {
|
|
background-color: #e5e5e5;
|
|
color: #333;
|
|
}
|
|
body.dark-mode .alert {
|
|
color: #ddd;
|
|
background: #211921;
|
|
}
|
|
body.dark-mode .block, body.dark-mode .block_head {
|
|
border-left: solid 4px #211921;
|
|
}
|