You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
333 lines
7.1 KiB
333 lines
7.1 KiB
@media (max-width: 991.98px) {
|
|
#userNameRow,
|
|
#firstNameRow {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
#passwordButton {
|
|
margin-bottom: 50px;
|
|
}
|
|
}
|
|
|
|
.card-hover {
|
|
background-color: #f8f9fa!important;
|
|
}
|
|
|
|
#game-table {
|
|
border-radius: .25rem !important;
|
|
border-collapse: separate !important;
|
|
border-spacing: 0 !important;
|
|
border: 1px solid rgba(0,0,0,.125) !important;
|
|
}
|
|
|
|
#game-table thead {
|
|
color: #495057;
|
|
background-color: #e9ecef;
|
|
border-color: #dee2e6;
|
|
}
|
|
|
|
.game-link {
|
|
color: #000;
|
|
}
|
|
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
body {
|
|
background-color: #111 !important;
|
|
color: #eee;
|
|
}
|
|
|
|
.jumbotron {
|
|
background-color: #333 !important;
|
|
}
|
|
|
|
.modal-content {
|
|
background-color: #111 !important;
|
|
color: #eee;
|
|
}
|
|
|
|
.modal-header {
|
|
border-bottom: 1px solid #555 !important;
|
|
}
|
|
|
|
.modal-header .close {
|
|
color: #eee !important;
|
|
text-shadow: 0 1px 0 #555 !important;
|
|
}
|
|
|
|
.modal-footer {
|
|
border-top: 1px solid #555 !important;
|
|
}
|
|
|
|
.bg-light {
|
|
background-color: #333 !important;
|
|
}
|
|
|
|
.bg-white {
|
|
background-color: #000 !important;
|
|
}
|
|
|
|
.bg-black {
|
|
background-color: #eee !important;
|
|
}
|
|
|
|
.form-control {
|
|
display: block;
|
|
width: 100%;
|
|
height: calc(1.5em + 0.75rem + 2px);
|
|
padding: 0.375rem 0.75rem;
|
|
font-size: 1rem;
|
|
font-weight: 400;
|
|
line-height: 1.5;
|
|
color: #dee2e6;
|
|
background-color: #000;
|
|
background-clip: padding-box;
|
|
border: 1px solid #6c757d;
|
|
border-radius: 0.25rem;
|
|
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
|
}
|
|
|
|
.card {
|
|
background-color: #000;
|
|
border: 1px solid #6c757d;
|
|
}
|
|
|
|
.card-hover {
|
|
background-color: #343a40!important;
|
|
color: white !important;
|
|
}
|
|
|
|
#game-table {
|
|
border-radius: 5px !important;
|
|
border-collapse: separate !important;
|
|
border-spacing: 0 !important;
|
|
background-color: #000 !important;
|
|
border: 1px solid #6c757d !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
#game-table thead {
|
|
color: #fff;
|
|
background-color: #343a40;
|
|
border-color: #454d55;
|
|
}
|
|
|
|
.game-link {
|
|
color: #fff;
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.form-control {
|
|
transition: none;
|
|
}
|
|
}
|
|
|
|
.form-control::-ms-expand {
|
|
background-color: transparent;
|
|
border: 0;
|
|
}
|
|
|
|
.form-control:-moz-focusring {
|
|
color: transparent;
|
|
text-shadow: 0 0 0 #dee2e6;
|
|
}
|
|
|
|
.form-control:focus {
|
|
color: #dee2e6;
|
|
background-color: #191d21;
|
|
border-color: #b3d7ff;
|
|
outline: 0;
|
|
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
|
|
}
|
|
|
|
.form-control::-webkit-input-placeholder {
|
|
color: #6c757d;
|
|
opacity: 1;
|
|
}
|
|
|
|
.form-control::-moz-placeholder {
|
|
color: #6c757d;
|
|
opacity: 1;
|
|
}
|
|
|
|
.form-control::-ms-input-placeholder {
|
|
color: #6c757d;
|
|
opacity: 1;
|
|
}
|
|
|
|
.form-control::placeholder {
|
|
color: #6c757d;
|
|
opacity: 1;
|
|
}
|
|
|
|
.form-control:disabled,
|
|
.form-control[readonly] {
|
|
background-color: #343a40;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes flicker {
|
|
0% {
|
|
opacity: 0.27861;
|
|
}
|
|
5% {
|
|
opacity: 0.34769;
|
|
}
|
|
10% {
|
|
opacity: 0.23604;
|
|
}
|
|
15% {
|
|
opacity: 0.90626;
|
|
}
|
|
20% {
|
|
opacity: 0.18128;
|
|
}
|
|
25% {
|
|
opacity: 0.83891;
|
|
}
|
|
30% {
|
|
opacity: 0.65583;
|
|
}
|
|
35% {
|
|
opacity: 0.67807;
|
|
}
|
|
40% {
|
|
opacity: 0.26559;
|
|
}
|
|
45% {
|
|
opacity: 0.84693;
|
|
}
|
|
50% {
|
|
opacity: 0.96019;
|
|
}
|
|
55% {
|
|
opacity: 0.08594;
|
|
}
|
|
60% {
|
|
opacity: 0.20313;
|
|
}
|
|
65% {
|
|
opacity: 0.71988;
|
|
}
|
|
70% {
|
|
opacity: 0.53455;
|
|
}
|
|
75% {
|
|
opacity: 0.37288;
|
|
}
|
|
80% {
|
|
opacity: 0.71428;
|
|
}
|
|
85% {
|
|
opacity: 0.70419;
|
|
}
|
|
90% {
|
|
opacity: 0.7003;
|
|
}
|
|
95% {
|
|
opacity: 0.36108;
|
|
}
|
|
100% {
|
|
opacity: 0.24387;
|
|
}
|
|
}
|
|
@keyframes textShadow {
|
|
0% {
|
|
text-shadow: 0.4389924193300864px 0 1px rgba(0,30,255,0.5), -0.4389924193300864px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
5% {
|
|
text-shadow: 2.7928974010788217px 0 1px rgba(0,30,255,0.5), -2.7928974010788217px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
10% {
|
|
text-shadow: 0.02956275843481219px 0 1px rgba(0,30,255,0.5), -0.02956275843481219px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
15% {
|
|
text-shadow: 0.40218538552878136px 0 1px rgba(0,30,255,0.5), -0.40218538552878136px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
20% {
|
|
text-shadow: 3.4794037899852017px 0 1px rgba(0,30,255,0.5), -3.4794037899852017px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
25% {
|
|
text-shadow: 1.6125630401149584px 0 1px rgba(0,30,255,0.5), -1.6125630401149584px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
30% {
|
|
text-shadow: 0.7015590085143956px 0 1px rgba(0,30,255,0.5), -0.7015590085143956px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
35% {
|
|
text-shadow: 3.896914047650351px 0 1px rgba(0,30,255,0.5), -3.896914047650351px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
40% {
|
|
text-shadow: 3.870905614848819px 0 1px rgba(0,30,255,0.5), -3.870905614848819px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
45% {
|
|
text-shadow: 2.231056963361899px 0 1px rgba(0,30,255,0.5), -2.231056963361899px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
50% {
|
|
text-shadow: 0.08084290417898504px 0 1px rgba(0,30,255,0.5), -0.08084290417898504px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
55% {
|
|
text-shadow: 2.3758461067427543px 0 1px rgba(0,30,255,0.5), -2.3758461067427543px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
60% {
|
|
text-shadow: 2.202193051050636px 0 1px rgba(0,30,255,0.5), -2.202193051050636px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
65% {
|
|
text-shadow: 2.8638780614874975px 0 1px rgba(0,30,255,0.5), -2.8638780614874975px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
70% {
|
|
text-shadow: 0.48874025155497314px 0 1px rgba(0,30,255,0.5), -0.48874025155497314px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
75% {
|
|
text-shadow: 1.8948491305757957px 0 1px rgba(0,30,255,0.5), -1.8948491305757957px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
80% {
|
|
text-shadow: 0.0833037308038857px 0 1px rgba(0,30,255,0.5), -0.0833037308038857px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
85% {
|
|
text-shadow: 0.09769827255241735px 0 1px rgba(0,30,255,0.5), -0.09769827255241735px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
90% {
|
|
text-shadow: 3.443339761481782px 0 1px rgba(0,30,255,0.5), -3.443339761481782px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
95% {
|
|
text-shadow: 2.1841838852799786px 0 1px rgba(0,30,255,0.5), -2.1841838852799786px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
100% {
|
|
text-shadow: 2.6208764473832513px 0 1px rgba(0,30,255,0.5), -2.6208764473832513px 0 1px rgba(255,0,80,0.3), 0 0 3px;
|
|
}
|
|
}
|
|
.crt::after {
|
|
content: " ";
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
background: rgba(18, 16, 16, 0.1);
|
|
opacity: 0;
|
|
z-index: 2;
|
|
pointer-events: none;
|
|
animation: flicker 0.15s infinite;
|
|
}
|
|
.crt::before {
|
|
content: " ";
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
|
|
z-index: 2;
|
|
background-size: 100% 2px, 3px 100%;
|
|
pointer-events: none;
|
|
}
|
|
.crt {
|
|
animation: textShadow 1.6s infinite;
|
|
}
|
|
|
|
.colon {
|
|
font-size: 40px;
|
|
}
|