Skip to content

Instantly share code, notes, and snippets.

@bleonard252

bleonard252/file.html

Created February 14, 2020 01:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save bleonard252/67bec617280659924ec858eb16031cb0 to your computer and use it in GitHub Desktop.
Save bleonard252/67bec617280659924ec858eb16031cb0 to your computer and use it in GitHub Desktop.
Download ZIP
Caddy http.login / loginsrv Example Template File
Raw
file.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link uic-remove rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link uic-remove rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-social/5.1.1/bootstrap-social.min.css">
<link uic-remove rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
<style>
.vertical-offset-100{
padding-top:100px;
}
.login-or-container {
text-align: center;
margin: 0;
margin-bottom: 10px;
clear: both;
color: #6a737c;
font-variant: small-caps;
}
.login-or-hr {
margin-bottom: 0;
position: relative;
top: 28px;
height: 0;
border: 0;
border-top: 1px solid #e4e6e8;
}
.login-or {
display: inline-block;
position: relative;
padding: 10px;
background-color: #FFF;
}
.login-picture {
height: 120px;
border-radius: 3px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<uic-fragment name="content">
<div class="container">
<div class="row vertical-offset-100">
<div class="col-md-4 col-md-offset-4">
{{ if .Error}}
<div class="alert alert-danger" role="alert">
<strong>Internal Error. </strong> Please try again later.
</div>
{{end}}
{{if .Authenticated}}
{{with .UserInfo}}
<h1>Welcome {{.Sub}}!</h1>
<br/>
{{if .Picture}}<img class="login-picture" src="{{.Picture}}?s=120">{{end}}
{{if .Name}}<h3>{{.Name}}</h3>{{end}}
{{end}}
<br/>
<a class="btn btn-md btn-danger" href="{{ .Config.LoginPath }}?logout=true">Logout</a>
{{else}}
{{ range $providerName, $opts := .Config.Oauth }}
<a class="btn btn-block btn-lg btn-social btn-{{ $providerName }}" href="{{ $.Config.LoginPath }}/{{ $providerName }}">
<span class="fa fa-{{ $providerName }}"></span> Sign in with {{ $providerName | ucfirst }}
</a>
{{end}}
{{if and (not (eq (len .Config.Backends) 0)) (not (eq (len .Config.Oauth) 0))}}
<div class="login-or-container">
<hr class="login-or-hr">
<div class="login-or lead">or</div>
</div>
{{end}}
{{if not (eq (len .Config.Backends) 0) }}
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-title">
<h4>Sign in</h4>
{{ if .Failure}}<div class="alert alert-warning" role="alert">Invalid credentials</div>{{end}}
</div>
</div>
<div class="panel-body">
<form accept-charset="UTF-8" role="form" method="POST" action="{{.Config.LoginPath}}">
<fieldset>
<div class="form-group">
<input class="form-control" placeholder="Username" name="username" value="{{.UserInfo.Sub}}" type="text">
</div>
<div class="form-group">
<input class="form-control" placeholder="Password" name="password" type="password" value="">
</div>
<input class="btn btn-lg btn-success btn-block" type="submit" value="Login">
</fieldset>
</form>
</div>
</div>
{{end}}
{{end}}
</div>
</div>
</div>
</uic-fragment>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment