Skip to content

Commit

Permalink
Merge pull request #67 from adamadavidson/responsive-css
Browse files Browse the repository at this point in the history 
Adjusted HTML files to make them responsive for better viewing on mobile (addressing issue #51)
  • Loading branch information
@aceberg
aceberg authored Jan 4, 2024
2 parents 184440d + de19da0 commit 3d4f613
Show file tree
Hide file tree
Showing 10 changed files with 105 additions and 97 deletions.
8 changes: 4 additions & 4 deletions internal/web/templates/auth.html
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
{{ define "auth" }}

<body>
<div class="container mt-5">
<div class="container-lg mt-5">
<div class="row">
<div class="col">
<div class="col-md-6">
<table class="table">
<form action="/auth_save/" method="post">
<tr>
Expand Down Expand Up @@ -37,7 +37,7 @@
</form>
</table>
</div>
<div class="col">
<div class="col-md-6">
<div class="alert alert-info" role="alert">
<p>● <b>WARNING!</b> Authentication is only safe when used over <b>https</b> and with a strong password.</p>
<p>● <b>Expire after</b> - when user session expires. Can be set with suffixes <b>m</b>(minute), <b>h</b>(hour), <b>d</b>(day) or <b>M</b>(month). Default: <b>7d</b>.</p>
Expand All @@ -50,4 +50,4 @@


{{ template "footer" }}
{{ end }}
{{ end }}
8 changes: 4 additions & 4 deletions internal/web/templates/config.html
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
{{ define "config" }}

<body>
<div class="container mt-5">
<div class="container-lg mt-5">
<div class="row">
<div class="col">
<div class="col-md-6">
<table class="table">
<form action="/save_config/" method="post">
<tr>
Expand Down Expand Up @@ -98,7 +98,7 @@
</tr>
</table>
</div>
<div class="col">
<div class="col-md-6">
<p>Current version: {{ .Version }}</p>
<div class="alert alert-info" role="alert">
<p>● There can be one or more <b>Interfaces</b>, space separated</p>
Expand All @@ -120,4 +120,4 @@


{{ template "footer" }}
{{ end }}
{{ end }}
3 changes: 2 additions & 1 deletion internal/web/templates/footer.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
{{ define "footer"}}
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
</body>
</html>
{{ end }}
{{ end }}
31 changes: 15 additions & 16 deletions internal/web/templates/header.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
<head>
<title>Watch Your LAN</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Favicon-->
<link href="data:image/x-icon;base64,{{ .Config.Icon }}" rel="icon" type="image/x-icon" />
{{ if eq .Config.NodePath "" }}
Expand All @@ -16,9 +17,13 @@
{{ end }}
</head>
<body>
<nav class="navbar navbar-expand-sm navbar-dark bg-primary">
<div class="container">
<ul class="navbar-nav">
<nav class="navbar navbar-expand-md navbar-dark bg-primary">
<div class="container-lg">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarContent">
<ul class="navbar-nav me-auto mb-2 mb-md-0">
<li class="nav-item">
<a class="nav-link active" href="/">Home</a>
</li>
Expand All @@ -43,18 +48,12 @@
</li>
{{ end }}
</ul>
<ul class="nav navbar-nav navbar-right">
<form action="/search_hosts/" method="post">
<li class="input-group nav-item">
<input name="search" type="text" class="form-control text-dark" placeholder="Search">
<button type="submit" class="btn btn-primary">Search</button>
</li>
</form>
&nbsp;&nbsp;&nbsp;
<li class="nav-item"><a class="nav-link active" target="_blank" href="https://github.com/aceberg/WatchYourLAN">
<h3><i class="bi bi-github"></i></h3>
</a></li>
</ul>
<form action="/search_hosts/" method="post" class="d-flex mb-md-0 mb-3">
<input name="search" type="text" class="form-control text-dark me-2" placeholder="Search">
<button type="submit" class="btn btn-primary">Search</button>
</form>
</div>
<a class="ms-md-2" target="_blank" href="https://github.com/aceberg/WatchYourLAN"><i class="bi-github" style="font-size: 2rem;"></i></a>
</div>
</nav>
{{ end }}
{{ end }}
18 changes: 9 additions & 9 deletions internal/web/templates/history.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<!--Auto refresh (seconds)-->
<meta http-equiv="refresh" content="{{ .Config.Timeout }}">
<body>
<div class="container mt-3">
<div class="container-lg mt-3 table-responsive">
<table class="table table-striped">
<tr>
<th>Name</th>
Expand All @@ -15,19 +15,19 @@
</tr>
{{ range .Hist }}
<tr>
<td>{{ .Name }}</td>
<td><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td><a href="/host?id={{ .Host }}">{{ .Mac }}</a></td>
<td>{{ .Hw }}</td>
<td>{{ .Date }}</td>
<td>
<td class="align-middle">{{ .Name }}</td>
<td class="align-middle"><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td class="align-middle"><a href="/host?id={{ .Host }}">{{ .Mac }}</a></td>
<td class="align-middle">{{ .Hw }}</td>
<td class="align-middle">{{ .Date }}</td>
<td class="align-middle">
{{ if eq .Known 1 }}
Yes
{{ else }}
No
{{ end }}
</td>
<td>
<td class="align-middle">
{{ if eq .State 1 }}
<i class="bi bi-circle-fill text-success"></i>
{{ else }}
Expand All @@ -40,4 +40,4 @@
</div>

{{ template "footer" }}
{{ end }}
{{ end }}
68 changes: 34 additions & 34 deletions internal/web/templates/host.html
View file
Original file line number Diff line number Diff line change
@@ -1,38 +1,38 @@
{{ define "host" }}

<body>
<div class="container mt-5">
<div class="container-lg mt-5">
<div class="row">
<div class="col">
<div class="col table-responsive">
<table class="table">
{{ range .Hosts }}
<tr>
<td>ID</td>
<td>{{ .ID }}</td>
<td class="align-middle">ID</td>
<td class="align-middle">{{ .ID }}</td>
</tr>
<tr>
<td>Name</td>
<td>{{ .Name }}</td>
<td class="align-middle">Name</td>
<td class="align-middle">{{ .Name }}</td>
</tr>
<tr>
<td>IP</td>
<td><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td class="align-middle">IP</td>
<td class="align-middle"><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
</tr>
<tr>
<td>Mac</td>
<td>{{ .Mac }}</td>
<td class="align-middle">Mac</td>
<td class="align-middle">{{ .Mac }}</td>
</tr>
<tr>
<td>Hw</td>
<td>{{ .Hw }}</td>
<td class="align-middle">Hw</td>
<td class="align-middle">{{ .Hw }}</td>
</tr>
<tr>
<td>Date</td>
<td>{{ .Date }}</td>
<td class="align-middle">Date</td>
<td class="align-middle">{{ .Date }}</td>
</tr>
<tr>
<td>Known</td>
<td>
<td class="align-middle">Known</td>
<td class="align-middle">
{{ if eq .Known 1 }}
Yes
{{ else }}
Expand All @@ -41,8 +41,8 @@
</td>
</tr>
<tr>
<td>Now</td>
<td>
<td class="align-middle">Now</td>
<td class="align-middle">
{{ if eq .Now 1 }}
Online
{{ else }}
Expand All @@ -51,21 +51,21 @@
</td>
</tr>
<tr>
<td>
<td class="align-middle">
<form action="/del_host/" method="post">
<input name="id" type="hidden" class="form-control" value="{{ .ID }}"><button type="submit" class="btn btn-danger">Delete host</button>
</form>
</td>
<td></td>
<td class="align-middle"></td>
</tr>
{{ end }}
</table>
</div>
<div class="col">
<table class="table">
<tr>
<td>Domain name</td>
<td>
<td class="align-middle">Domain name</td>
<td class="align-middle">
{{ range .Themes }}
<a href="http://{{ . }}" target="_blank">{{ . }}</a>
{{ end }}
Expand All @@ -81,16 +81,16 @@
<form action="/port_scan/" method="post">
<input name="ip" type="hidden" class="form-control" value="{{ .IP }}">
<tr>
<td>Start port</td>
<td><input name="begin" type="text" class="form-control" placeholder="1"></td>
<td class="align-middle">Start port</td>
<td class="align-middle"><input name="begin" type="text" class="form-control" placeholder="1"></td>
</tr>
<tr>
<td>End port</td>
<td><input name="end" type="text" class="form-control" placeholder="65535"></td>
<td class="align-middle">End port</td>
<td class="align-middle"><input name="end" type="text" class="form-control" placeholder="65535"></td>
</tr>
<tr>
<td><button type="submit" class="btn btn-success">Scan host</button></td>
<td></td>
<td class="align-middle"><button type="submit" class="btn btn-success">Scan host</button></td>
<td class="align-middle"></td>
</tr>
</form>
</table>
Expand All @@ -109,17 +109,17 @@
</tr>
{{ range .Hist }}
<tr>
<td>{{ .Name }}</td>
<td><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td>{{ .Date }}</td>
<td>
<td class="align-middle">{{ .Name }}</td>
<td class="align-middle"><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td class="align-middle">{{ .Date }}</td>
<td class="align-middle">
{{ if eq .Known 1 }}
Yes
{{ else }}
No
{{ end }}
</td>
<td>
<td class="align-middle">
{{ if eq .State 1 }}
<i class="bi bi-circle-fill text-success"></i>
{{ else }}
Expand All @@ -134,4 +134,4 @@


{{ template "footer" }}
{{ end }}
{{ end }}
42 changes: 25 additions & 17 deletions internal/web/templates/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,13 @@
<meta http-equiv="refresh" content="{{ .Config.Timeout }}">
</head>
<body>
<div class="container mt-3">
<div class="container-lg mt-3">
<div class="row">
<div class="col">
<h2>Online</h2>
<p>Scanning interfaces: {{ .Config.Iface }}</p>
<table class="table table-striped">
<div class="table-responsive">
<table class="table table-striped">
<tr>
<th>Name</th>
<th>IP</th>
Expand All @@ -17,11 +20,11 @@ <h2>Online</h2>
{{ range .Hosts }}
{{ if eq .Now 1 }}
<tr>
<td>{{ .Name }}</td>
<td><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td><a href="/host?id={{ .ID }}">{{ .Mac }}</a></td>
<td>{{ .Hw }}</td>
<td>
<td class="align-middle">{{ .Name }}</td>
<td class="align-middle"><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td class="align-middle"><a href="/host?id={{ .ID }}">{{ .Mac }}</a></td>
<td class="align-middle">{{ .Hw }}</td>
<td class="align-middle">
{{ if eq .Known 1 }}
<button type="button" class="btn btn-success" disabled>Yes</button>
{{ else }}
Expand All @@ -31,9 +34,11 @@ <h2>Online</h2>
</tr>
{{ end }}
{{ end }}
</table>
</table>
</div>
<h2>Log</h2>
<table class="table table-striped">
<div class="table-responsive">
<table class="table table-striped">
<tr>
<th>Name</th>
<th>IP</th>
Expand All @@ -46,14 +51,14 @@ <h2>Log</h2>
<form action="/update_host/" method="post">
<input name="id" type="hidden" class="form-control" value="{{ .ID }}">
<tr>
<td>
<td class="align-middle">
<input name="name" type="text" class="form-control text-dark" value="{{ .Name }}">
</td>
<td><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td><a href="/host?id={{ .ID }}">{{ .Mac }}</a></td>
<td>{{ .Hw }}</td>
<td>{{ .Date }}</td>
<td>
<td class="align-middle"><a href="http://{{ .IP }}" target="_blank">{{ .IP }}</a></td>
<td class="align-middle"><a href="/host?id={{ .ID }}">{{ .Mac }}</a></td>
<td class="align-middle">{{ .Hw }}</td>
<td class="align-middle">{{ .Date }}</td>
<td class="align-middle">
{{ if eq .Known 1 }}
<button value="off" name="known" type="submit" class="btn btn-success">Yes</button>
{{ else }}
Expand All @@ -63,8 +68,11 @@ <h2>Log</h2>
</tr>
</form>
{{ end }}
</table>
</table>
</div>
</div>
</div>
</div>

{{ template "footer" }}
{{ end }}
{{ end }}
Loading

0 comments on commit 3d4f613

Please sign in to comment.