Add theme for core-beta

core-beta-crt-dark/footer.html

@@ -0,0 +1 @@
+<div class="scan-bar"></div>

core-beta-crt-dark/header.html

@@ -0,0 +1,249 @@
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
+<style id="theme">
+  :root {
+    --cyber-green: #1CFF49;
+    --cyber-green-hover: #14ca38;
+    --cyber-active-dark: #17c239;
+
+    --bs-emphasis-color: #fff
+    --cyber-green-rgb: 28,255,73;
+    --cyber-green-hover-rgb: 20,202,56;
+    --bs-primary-rgb: var(--cyber-green-hover-rgb);
+  }
+
+  * {
+    font-family: "Press Start 2P";
+    font-weight: 1 !important;
+    font-size: 93%;
+  }
+
+  @keyframes scan {
+    0% {
+      top: -40px;
+    }
+
+    50% {
+      top: calc(100% - 20px);
+      opacity: 0;
+    }
+
+    100% {
+      top: calc(100% - 20px);
+      opacity: 0;
+    }
+  }
+
+  .scan-bar {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 20px;
+    background: grey;
+    animation: scan 8s linear infinite;
+    z-index: 9999;
+    opacity: 0.1
+  }
+
+  @keyframes flicker {
+    0% {
+      opacity: 0.27861;
+    }
+
+    5% {
+      opacity: 0.34769;
+    }
+
+    10% {
+      opacity: 0.23604;
+    }
+
+    15% {
+      opacity: 0.80626;
+    }
+
+    20% {
+      opacity: 0.18128;
+    }
+
+    25% {
+      opacity: 0.73891;
+    }
+
+    30% {
+      opacity: 0.55583;
+    }
+
+    35% {
+      opacity: 0.57807;
+    }
+
+    40% {
+      opacity: 0.36559;
+    }
+
+    45% {
+      opacity: 0.74693;
+    }
+
+    50% {
+      opacity: 0.86019;
+    }
+
+    55% {
+      opacity: 0.18594;
+    }
+
+    60% {
+      opacity: 0.20313;
+    }
+
+    65% {
+      opacity: 0.61988;
+    }
+
+    70% {
+      opacity: 0.53455;
+    }
+
+    75% {
+      opacity: 0.47288;
+    }
+
+    80% {
+      opacity: 0.71428;
+    }
+
+    85% {
+      opacity: 0.70419;
+    }
+
+    90% {
+      opacity: 0.7003;
+    }
+
+    95% {
+      opacity: 0.46108;
+    }
+
+    100% {
+      opacity: 0.34387;
+    }
+  }
+
+  body::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 3s infinite;
+  }
+
+  body::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;
+  }
+
+  .table-striped * {
+    font-size: 1em;
+  }
+
+  input {
+    color: black !important;
+    background-color: white !important;
+  }
+
+  input:focus {
+    color: black !important;
+    background-color: #8f8f8f !important;
+  }
+
+  :root {
+    --bs-heading-color: white;
+    --bs-body-color: white;
+    --bs-body-bg: black;
+    --bs-dark: black;
+    --bs-dark-rgb: black;
+    --bs-secondary-color: rgb(115 115 115 / 75%);
+  }
+
+  .table {
+    --bs-table-color: white;
+    --bs-table-striped-color: white;
+    --bs-table-color-state: white;
+    --bs-table-bg: #212121;
+  }
+
+  .alert span {
+    background-color: var(--bs-info-bg-subtle);
+  }
+
+  .challenge-desc * {
+    font-size: 1.6em;
+  }
+
+  .badge {
+    --bs-badge-font-size: 1.5em;
+  }
+
+  .challenge-desc p a {
+    font-size: 1em;
+  }
+
+  strong {
+    font-size: 2em
+  }
+
+  a {
+    color: var(--cyber-green);
+  }
+
+  .btn-primary {
+    --bs-btn-bg: var(--cyber-green);
+    --bs-btn-border-color: var(--cyber-green);
+    --bs-btn-disabled-bg: var(--cyber-green);
+    --bs-btn-disabled-border-color: var(--cyber-green);
+
+    --bs-btn-hover-bg: var(--cyber-green-hover);
+    --bs-btn-hover-border-color: var(--cyber-green-hover);
+    --bs-btn-active-bg: var(--cyber-green-hover);
+    --bs-btn-active-border-color: var(--cyber-green-hover);
+  }
+
+  .nav-pills {
+    --bs-nav-pills-link-active-bg: var(--cyber-active-dark);
+  }
+
+  .nav {
+    --bs-nav-link-color: var(--cyber-green);
+    --bs-link-hover-color: var(--cyber-green-hover);
+  }
+  .challenge-connection-info {
+    font-size: 2.85em;
+  }
+  .footer a {
+    font-size:0.7em;
+  }
+  .form-check-input {
+    width: 2em;
+	  appearance: auto;
+  }
+</style>