mirror of
https://github.com/pi-hole/web.git
synced 2024-12-06 19:36:21 +01:00
New design for new login page
This commit is contained in:
+52
-55
@@ -1,65 +1,62 @@
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-sm-offset-3">
|
||||
<center>
|
||||
<svg width="100%" viewBox="-60 -5 220 140" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="max-width: 400px;"><!-- " border: 1px solid black;" > -->
|
||||
<defs>
|
||||
<style type="text/css">
|
||||
<![CDATA[
|
||||
.bluranddarken{
|
||||
filter: url(#bluranddarken);
|
||||
}
|
||||
.blurslightly{
|
||||
filter: url(#blurslightly);
|
||||
}
|
||||
]]>
|
||||
</style>
|
||||
<filter id="bluranddarken">
|
||||
<!-- Add blur -->
|
||||
<feGaussianBlur in="SourceGraphic" stdDeviation="3,3" />
|
||||
<feComponentTransfer> <!-- Make it darker -->
|
||||
<feFuncR type="linear" slope="0.5"/>
|
||||
<feFuncG type="linear" slope="0.5"/>
|
||||
<feFuncB type="linear" slope="0.5"/>
|
||||
</feComponentTransfer>
|
||||
</filter>
|
||||
<filter id="blurslightly">
|
||||
<feGaussianBlur in="SourceGraphic" stdDeviation="2,2" />
|
||||
</filter>
|
||||
</defs>
|
||||
<g class="bluranddarken">
|
||||
<image x="0" y="0" width="100" height="100" xlink:href="img/logo.svg"/>
|
||||
</g>
|
||||
<g class="blurslightly">
|
||||
<text font-family="Verdana" x="-18" y="130" font-size="24" class="protected">Protected area</text>
|
||||
</g>
|
||||
|
||||
<!--
|
||||
M is moveto
|
||||
|
||||
A is a general elliptical arc command.
|
||||
|
||||
L is lineto
|
||||
-->
|
||||
</svg>
|
||||
</center>
|
||||
</div>
|
||||
<div class="col-sm-12">
|
||||
<center><img src="img/logo.svg" width="20%"></center>
|
||||
</div>
|
||||
<div class="col-sm-12">
|
||||
<center><span class="logo-lg" style="font-size: 25px;"><b>Pi</b>-hole</span></center>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-sm-offset-3">
|
||||
<div class="login-box">
|
||||
<!-- <div class="col-sm-6 col-sm-offset-3">
|
||||
<form action="" method="POST">
|
||||
<div class="form-group <?php if($wrongpassword){ ?>has-error<?php } ?> input-group-lg">
|
||||
<?php if($wrongpassword){ ?><center><label class="control-label" for="inputError"><i class="fa fa-times-circle-o"></i> Wrong password!</label></center><?php } ?>
|
||||
<div class="input-group">
|
||||
<input type="password" class="form-control " name="pw" placeholder="Enter password to unlock">
|
||||
<span class="input-group-btn">
|
||||
<button type="submit" class="btn btn-info btn-flat <?php if($wrongpassword){ ?>btn-danger<?php } ?>">Submit</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group has-feedback">
|
||||
<input type="password" class="form-control" placeholder="Password">
|
||||
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-4">
|
||||
<button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button>
|
||||
</div>
|
||||
</form>
|
||||
</center>
|
||||
</div>
|
||||
</center> -->
|
||||
<div class="login-box-body">
|
||||
<p class="login-box-msg">Sign in to start your session</p>
|
||||
<?php if($wrongpassword){ ?>
|
||||
<div class="form-group has-error login-box-msg">
|
||||
<label class="control-label"><i class="fa fa-times-circle-o"></i> Wrong password!</label>
|
||||
</div>
|
||||
<?php } ?>
|
||||
|
||||
<form action="" method="post">
|
||||
<div class="form-group has-feedback <?php if($wrongpassword){ ?>has-error<?php } ?> ">
|
||||
<input type="password" name="pw" class="form-control" placeholder="Password">
|
||||
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-4 col-xs-offset-8">
|
||||
<button type="submit" class="btn btn-primary btn-block btn-flat">Log In</button>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="box box-info collapsed-box box-solid">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Forgot password</h3>
|
||||
|
||||
<div class="box-tools pull-right"><button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i></button></div>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
After installing Pi-Hole for the first time, a password is generated and displayed to the user. The password cannot be retrived later on, but it is possible to set a new password (or explicitly disable the password) using the command <pre>sudo pihole -a -p newpassword</pre>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<style type="text/css">
|
||||
.protected {
|
||||
|
||||
Reference in New Issue
Block a user