mirror of
https://github.com/donaldzou/WGDashboard.git
synced 2024-11-22 15:20:09 +01:00
86 lines
3.5 KiB
HTML
86 lines
3.5 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<title>Wireguard Dashboard</title>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
|
|
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='dashboard.css') }}">
|
|
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
|
|
</head>
|
|
|
|
<body>
|
|
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
|
|
<a class="navbar-brand col-md-3 col-lg-2 mr-0 px-3" href="#">Wireguard Dashboard</a>
|
|
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse"
|
|
data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
</nav>
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="row">
|
|
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
|
|
<div class="sidebar-sticky pt-3">
|
|
<ul class="nav flex-column">
|
|
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
|
|
</ul>
|
|
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
|
|
<span>Configurations</span>
|
|
</h6>
|
|
<ul class="nav flex-column">
|
|
{% for i in conf%}
|
|
<li class="nav-item"><a class="nav-link" href="/configuration/{{i['conf']}}">{{i['conf']}}</a></li>
|
|
{%endfor%}
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
|
|
{% for i in conf%}
|
|
<div class="card mt-3">
|
|
<div class="card-body">
|
|
|
|
<div class="row">
|
|
<div class="col-sm">
|
|
<a href="/configuration/{{i['conf']}}">
|
|
<h5 class="card-title">{{i['conf']}}</h5>
|
|
</a>
|
|
</div>
|
|
|
|
|
|
<div class="w-100"></div>
|
|
<div class="col-sm">
|
|
<small class="text-muted"><strong>STATUS</strong></small>
|
|
<h6 style="text-transform: uppercase;">{{i['status']}}<span class="dot dot-{{i['status']}}"></span></h6>
|
|
</div>
|
|
<div class="col-sm">
|
|
<small class="text-muted"><strong>PUBLIC KEY</strong></small>
|
|
<h6 style="text-transform: uppercase;"><samp>{{i['public_key']}}</samp></h6>
|
|
</div>
|
|
<div class="col-sm">
|
|
<input class="mt-2 switch" id="{{i['conf']}}" type="checkbox" data-toggle="toggle" {{i['checked']}} data-height="15">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{%endfor%}
|
|
</main>
|
|
</div>
|
|
</body>
|
|
<script src="https://code.jquery.com/jquery-3.5.1.min.js"
|
|
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
|
|
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
|
|
crossorigin="anonymous"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"
|
|
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
|
|
crossorigin="anonymous"></script>
|
|
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
|
|
<script>
|
|
$('.switch').change(function() {
|
|
location.replace("/switch/"+$(this).attr('id'))
|
|
})
|
|
</script>
|
|
</html> |