mnml/html-client/cryps.css
2019-03-28 16:57:48 +11:00

165 lines
2.5 KiB
CSS

body {
background-color: #000000;
font-family: 'Jura';
color: whitesmoke;
font-size: 16pt;
padding: 1em;
}
button, input {
font-family: 'Jura';
height: auto;
color: whitesmoke;
border-width: 2px;
border-color: whitesmoke;
border-radius: 0;
}
/*colour necesary to bash skellington*/
button:hover {
color: whitesmoke;
animation: whiteglow 2000ms infinite;
border-color: whitesmoke;
}
@keyframes whiteglow {
0% {
box-shadow: 0 0 0px whitesmoke;
}
20% {
box-shadow: 0 0 20px whitesmoke;
}
60% {
box-shadow: 0 0 20px whitesmoke;
}
100% {
box-shadow: 0 0 0px whitesmoke;
}
}
@keyframes greenglow {
0% {
box-shadow: 0 0 -20px forestgreen;
}
100% {
box-shadow: 0 0 30px forestgreen;
color: forestgreen;
border-color: forestgreen;
}
}
@keyframes whiteblackglow {
0% {
box-shadow: 0 0 0px black;
}
100% {
box-shadow: 0 0 -30px black;
}
}
.green-btn:hover {
animation: greenglow 2s ease 0s 1 normal forwards;
animation-iteration-count: 1;
}
.instance-btn {
font-size: 150%;
min-width: 20%;
border-width: 2px;
padding: 0.5em;
display: block;
}
.instance-ui-btn {
font-size: 100%;
min-width: 100%;
padding: 0;
}
.vbox-btn {
margin: 0;
padding: 0.5em;
background-color: whitesmoke;
color: black;
}
.vbox-btn:hover {
color: black;
animation: whiteblackglow 2s ease 0s 1 normal forwards;
}
.header {
margin-bottom: 2em;
}
.home-cryp {
}
.background {
min-height: 100%;
min-width: 100%;
position: absolute;
z-index: -1000;
background-color: #000000
}
.cryps-title {
font-size: 200%;
display: inline;
}
.login {
display: inline;
margin-right: 0;
}
.header-username {
display: inline;
}
.header-status {
text-align: right;
}
.vbox-table {
table-layout: fixed;
width: 100%;
}
.vbox-table td {
border: 1px solid whitesmoke;
padding: 0.5em;
text-align: center;
height: 40px;
}
.vbox-table th:first-child, td:first-child {
padding: 0.5em;
}
.ping-svg {
background-color: black;
height: 1em;
margin-right: 1em;
}
.ping-path {
stroke: #f5f5f5;
fill: none;
stroke-width: 4;
stroke-dasharray: 121, 242;
animation: pulse 2s infinite linear;
}
@keyframes pulse {
0% {
stroke-dashoffset: 363;
}
100% {
stroke-dashoffset: 0;
}
}
.spacer {
min-width: 100%;
}