chore: fix WebWolf UI (#1686)
Fix-ups after the Bootstrap 5 upgrade for WebWolf.
This commit is contained in:
Nanne Baars
GitHub
parent
7fea42afe9
commit
b7f657ad2c
@ -75,7 +75,6 @@ textarea {
|
||||
/*Mailbox*/
|
||||
body {
|
||||
margin: 0 0 10px;
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-size: medium;
|
||||
}
|
||||
.nav-tabs .glyphicon:not(.no-margin) { margin-right:10px; }
|
||||
|
||||
@ -9,16 +9,15 @@
|
||||
|
||||
<script type="text/javascript" th:src="@{/js/fileUpload.js}"></script>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div class="container mt-1">
|
||||
<div class="alert alert-info alert-dismissible fade show" role="alert">
|
||||
<div>
|
||||
<p>
|
||||
Upload a file which you need to host as an attacker.
|
||||
Upload a file which you need to host as an attacker.
|
||||
</p>
|
||||
<p>
|
||||
Each file will be available under the following url:
|
||||
<span th:text="${webwolf_url}">http://localhost:9090/WebWolf/</span>/files/{username}/{filename}.
|
||||
Each file will be available under the following url:
|
||||
<span th:text="${webwolf_url}">http://localhost:9090/WebWolf/</span>/files/{username}/{filename}.
|
||||
</p>
|
||||
<p>
|
||||
You can copy and paste the location from the table below.
|
||||
@ -28,25 +27,24 @@
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-heading"><strong>Upload a file</strong>
|
||||
<small></small>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
||||
<!-- Standard Form -->
|
||||
<h5 class="card-title"><strong>Upload a file</strong></h5>
|
||||
<form th:action="@{/fileupload}" method="post" enctype="multipart/form-data">
|
||||
<div class="form-inline">
|
||||
<div class="form-group">
|
||||
<input type="file" name="file"/>
|
||||
<fieldset>
|
||||
<div class="mb-3">
|
||||
<input type="file" class="form-control" name="file"/>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-md btn-primary">Upload files</button>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<button type="submit" class="btn btn-md btn-primary">Upload files</button>
|
||||
</div>
|
||||
</fieldset>
|
||||
</form>
|
||||
<div class="fileUploadAlert alert-success top10" role="alert">
|
||||
<span th:text="${uploadSuccess}"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="container mt-3">
|
||||
|
||||
<table class="table">
|
||||
<thead class="thead-inverse">
|
||||
@ -61,12 +59,11 @@
|
||||
<td th:text="${f.name}">filename</td>
|
||||
<td th:text="${f.size}">size</td>
|
||||
<td><a th:id="fileLink" th:href="@{'/' + ${f.link}}">link</a>
|
||||
<span class="fa fa-files-o" title="Click to copy to clipboard"></span>
|
||||
<span class="fa fa-files-o" title="Click to copy to clipboard"></span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -13,33 +13,29 @@
|
||||
<body>
|
||||
<div th:fragment="header">
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-item">
|
||||
<a class="navbar-brand" th:href="@{/home}">WebWolf</a>
|
||||
</div>
|
||||
<a class="navbar-brand" th:href="@{/home}">WebWolf</a>
|
||||
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/home}">Home</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/files}">Files</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/mail}">Mailbox</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/requests}">Incoming requests</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/jwt}">JWT</a></li>
|
||||
</ul>
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
|
||||
<li class="nav-item"><a class="nav-link" href="#">
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/home}">Home</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/files}">Files</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/mail}">Mailbox</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/requests}">Incoming requests</a></li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/jwt}">JWT</a></li>
|
||||
</ul>
|
||||
<ul class="navbar-nav position-absolute end-0 mx-3">
|
||||
<li class="nav-item"><a class="nav-link" href="#">
|
||||
<span sec:authorize="isAuthenticated()">
|
||||
<span class="glyphicon glyphicon-user"></span>
|
||||
<span th:text="${#authentication.name}"></span></span></a>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/logout}">
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" th:href="@{/logout}">
|
||||
<span sec:authorize="isAuthenticated()">
|
||||
Sign out</span></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
<h1 class="h2">WebWolf</h1>
|
||||
<br/>
|
||||
<p>
|
||||
Some challenges requires to have a local web server running. WebWolf is for you the attacker it
|
||||
Some challenges require to have a local web server running. WebWolf is for you the attacker it
|
||||
helps you while solving some assignments and challenges within
|
||||
WebGoat. An assignment might for example require you to serve a file or connect back to your own
|
||||
environment or to receive an e-mail.
|
||||
|
||||
@ -10,7 +10,7 @@
|
||||
<script type="text/javascript" th:src="@{/js/jwt.js}"></script>
|
||||
|
||||
|
||||
<div class="container">
|
||||
<div class="container mt-3">
|
||||
|
||||
<div class="alert alert-info alert-dismissible fade show">
|
||||
<div>
|
||||
@ -23,7 +23,7 @@
|
||||
|
||||
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
|
||||
<div class="form-group">
|
||||
<label for="token">Encoded</label>
|
||||
<label for="token"><strong>Encoded</strong></label>
|
||||
<form id="decodeForm">
|
||||
<textarea class="form-control" style="font-size: 14pt; font-family:monospace;" id="token" name="token"
|
||||
rows="4"
|
||||
@ -31,8 +31,8 @@
|
||||
</form>
|
||||
</div>
|
||||
<form id="encodeForm">
|
||||
<div class="form-group">
|
||||
<label>Decoded</label>
|
||||
<div class="form-group mt-2">
|
||||
<label><strong>Decoded</strong></label>
|
||||
<div class="row">
|
||||
<div class="col-xs-6 col-md-5">Header</div>
|
||||
<div class="col-xs-6 col-md-7">Payload</div>
|
||||
@ -52,13 +52,12 @@
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<br/>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">Secret key</span>
|
||||
<input type="text" placeholder="Enter your secret key" class="form-control" id="secretKey">
|
||||
<div class="input-group input-group-sm mb-3 mt-3">
|
||||
<span class="input-group-text" id="inputGroup-sizing-sm">Secret key</span>
|
||||
<input type="text" class="form-control" id="secretKey" placeholder="Enter your secret key" aria-describedby="inputGroup-sizing-sm">
|
||||
</div>
|
||||
|
||||
<div class="input-group">
|
||||
<div class="input-group mt-2">
|
||||
<h4 id="signatureValid">Invalid signature</h4>
|
||||
</div>
|
||||
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
<div class="container">
|
||||
|
||||
|
||||
<div class="alert alert-info alert-dismissible fade show">
|
||||
<div class="alert alert-info alert-dismissible fade show mt-3">
|
||||
<div>
|
||||
<The mailbox of you as an attacker, all the mail send to <th:block th:text="${username}" />@webgoat.org will be send to this mailbox.
|
||||
</p>
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
<div class="container">
|
||||
|
||||
|
||||
<div class="alert alert-info alert-dismissible fade show">
|
||||
<div class="alert alert-info alert-dismissible fade show mt-3">
|
||||
<div>
|
||||
<p>
|
||||
Challenges in which you need to call your hacker machine WebWolf offers a simple httpd
|
||||
@ -29,16 +29,16 @@
|
||||
|
||||
|
||||
<h3>Requests</h3>
|
||||
<div th:each="trace,iter : ${traces}" class="card-group" id="accordion" role="tablist" aria-multiselectable="true">
|
||||
<div th:each="trace,iter : ${traces}" class="card-group mt-1" id="accordion" role="tablist" aria-multiselectable="true">
|
||||
<div class="card">
|
||||
<div class="card-heading" role="tab" th:id="'heading' + ${iter.index}">
|
||||
<h4 class="card-title">
|
||||
<strong class="card-title">
|
||||
<a class="collapsed" role="button" data-bs-toggle="collapse" data-bs-parent="#accordion"
|
||||
th:href="'#collapse' + ${iter.index}" aria-expanded="false" th:aria-controls="'collapse' + ${iter.index}">
|
||||
<i class="bi bi-chevron-down"></i> <!-- FontAwesome icon -->
|
||||
<span th:utext="${trace.date}"/> | <span th:utext="${trace.path}"/>
|
||||
</a>
|
||||
</h4>
|
||||
</strong>
|
||||
</div>
|
||||
<div th:id="'collapse' + ${iter.index}" class="card-collapse collapse" role="tabcard"
|
||||
th:aria-labelledby="'heading' + ${iter.index}">
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div class="row" style="margin-top:20px">
|
||||
<div class="row" style="margin-top:100px">
|
||||
<div class="col-xs-12 col-sm-8 col-md-6 col-sm-offset-2 col-md-offset-3" th:style="'background:url(' + @{/images/wolf.png} + ') no-repeat right;'">
|
||||
<form th:action="@{/login}" method="post">
|
||||
<fieldset>
|
||||
@ -28,12 +28,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input type="text" name="username" id="username" class="form-control input-lg"
|
||||
<div class="input-group mb-3">
|
||||
<input type="text" name="username" id="username" class="form-control"
|
||||
placeholder="Username WebGoat" required="true" autofocus="true"/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input type="password" name="password" id="password" class="form-control input-lg"
|
||||
<div class="input-group mb-3">
|
||||
<input type="password" name="password" id="password" class="form-control"
|
||||
placeholder="Password WebGoat" required="true"/>
|
||||
</div>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user