Catalyst / admin/Synapse-NetscanXi 14.8 GB / 57.8 GB 40.0 GB free
Help Sign in

admin / Synapse-NetscanXi

public

Network Scanning, Vulnerability and Compliance Application

Code Issues Pull requests Pipelines Packages Security Insights Wiki Settings
Synapse-NetscanXi / NetscanXiVersion13 / app / templates / login.html 5887 B · main 
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>NetscanXi Version 13 - Login</title>
  <script>
    /* Apply saved theme before first paint to avoid a flash. */
    (function(){
      try {
        var t = localStorage.getItem("netscan-theme");
        if (!t) t = window.matchMedia && window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : "dark";
        document.documentElement.setAttribute("data-theme", t);
      } catch(e) { document.documentElement.setAttribute("data-theme", "dark"); }
    })();
  </script>
  <style>
    :root, :root[data-theme="dark"] {
      --bg:#0f1419; --panel:#1a212b; --border:#2c3744; --text:#e6edf3;
      --muted:#8b97a5; --accent:#3fb950; --deep:#0d1117; --danger:#f85149;
    }
    :root[data-theme="light"] {
      --bg:#f4f6f8; --panel:#ffffff; --border:#d4dae0; --text:#1c2430;
      --muted:#5a6675; --accent:#1f9d3a; --deep:#f0f3f6; --danger:#d12d24;
    }
    body { margin:0; height:100vh; display:flex; align-items:center; justify-content:center;
      background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
      transition:background .2s ease, color .2s ease; }
    .box { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:28px 32px 32px; width:340px; position:relative; }
    .logo { display:block; width:100%; max-width:280px; height:auto; margin:0 auto 14px; border-radius:8px; }
    .app-name { display:block; text-align:center; font-size:30px; font-weight:800; letter-spacing:.5px; margin:0 0 4px; }
    .app-name .x { color:var(--accent); }
    .sub { color:var(--muted); font-size:13px; margin-bottom:20px; text-align:center; }
    .version-badge { display:block; width:fit-content; margin:0 auto 12px; padding:1px 9px;
      font-size:11px; font-weight:700; letter-spacing:.5px; color:#fff; background:var(--accent);
      border-radius:999px; }
    input { width:100%; background:var(--deep); border:1px solid var(--border); color:var(--text); padding:10px 12px;
      border-radius:8px; font-size:14px; margin-bottom:12px; }
    button.signin { width:100%; background:var(--accent); color:#fff; border:none; padding:10px; border-radius:8px;
      font-size:14px; font-weight:600; cursor:pointer; }
    .err { color:var(--danger); font-size:13px; margin-bottom:12px; }
    .theme-toggle { position:absolute; top:12px; right:12px; background:transparent; color:var(--muted);
      border:1px solid var(--border); border-radius:8px; padding:3px 9px; font-size:12px; cursor:pointer; }
    .theme-toggle:hover { border-color:var(--accent); color:var(--accent); }
  </style>
</head>
<body>
  {% if mfa_stage %}
  <form class="box" method="post" action="{{ url_for('login_mfa') }}">
    <button type="button" class="theme-toggle" onclick="toggleTheme()" title="Switch light/dark mode">
      <span id="themeIcon">☾</span>
    </button>
    <div class="app-name"><span class="x">N</span>etscanXi</div>
    <div class="version-badge">Version 13</div>
    <div class="sub">Two-factor authentication{% if mfa_username %} for <b>{{ mfa_username }}</b>{% endif %}.<br>Enter the 6-digit code from your authenticator app.</div>
    {% if error %}<div class="err">{{ error }}</div>{% endif %}
    <input type="text" name="code" id="mfaCode" placeholder="123 456" inputmode="numeric"
           autocomplete="one-time-code" autofocus>
    <input type="hidden" name="backup" id="backupFlag" value="0">
    <button type="submit" class="signin">Verify</button>
    <div style="text-align:center;margin-top:12px">
      <a href="#" id="useBackup" style="color:var(--muted);font-size:12px">Use a backup code instead</a>
    </div>
  </form>
  <script>
    (function(){
      var link=document.getElementById("useBackup");
      var inp=document.getElementById("mfaCode");
      var flag=document.getElementById("backupFlag");
      var backup=false;
      link.addEventListener("click",function(e){
        e.preventDefault(); backup=!backup; flag.value=backup?"1":"0";
        if(backup){ inp.placeholder="abcde-12345"; inp.setAttribute("inputmode","text");
          link.textContent="Use an authenticator code instead"; }
        else { inp.placeholder="123 456"; inp.setAttribute("inputmode","numeric");
          link.textContent="Use a backup code instead"; }
        inp.value=""; inp.focus();
      });
    })();
  </script>
  {% else %}
  <form class="box" method="post">
    <button type="button" class="theme-toggle" onclick="toggleTheme()" title="Switch light/dark mode">
      <span id="themeIcon">☾</span>
    </button>
    <div class="app-name"><span class="x">N</span>etscanXi</div>
    <div class="version-badge">Version 13</div>
    <div class="sub">Sign in to your NetscanXi account.</div>
    {% if error %}<div class="err">{{ error }}</div>{% endif %}
    <input type="text" name="username" placeholder="Username" autocomplete="username" autofocus>
    <input type="password" name="password" placeholder="Password" autocomplete="current-password">
    <button type="submit" class="signin">Sign in</button>
  </form>
  {% endif %}
  <script>
    function applyTheme(t){
      document.documentElement.setAttribute("data-theme", t);
      var icon=document.getElementById("themeIcon");
      if(icon) icon.textContent = t==="light" ? "☀" : "☾";
    }
    function toggleTheme(){
      var cur=document.documentElement.getAttribute("data-theme")||"dark";
      var next=cur==="light"?"dark":"light";
      try { localStorage.setItem("netscan-theme", next); } catch(e){}
      applyTheme(next);
    }
    applyTheme(document.documentElement.getAttribute("data-theme")||"dark");
  </script>
</body>
</html>