Clone the login page

This commit is contained in:
Ian Gulliver
2026-08-15 17:12:59 -07:00
parent f2f784fd63
commit cf32c09ab6
5 changed files with 32 additions and 15 deletions
+1 -1
View File
@@ -46,7 +46,7 @@ func (a *Auth) Register(mux *http.ServeMux) {
func (a *Auth) Wrap(next http.Handler) http.Handler { func (a *Auth) Wrap(next http.Handler) http.Handler {
return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) { return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
if r.URL.Path == "/auth/login" { if r.URL.Path == "/auth/login" || strings.HasPrefix(r.URL.Path, "/static/") {
next.ServeHTTP(w, r) next.ServeHTTP(w, r)
return return
} }
+1
View File
@@ -66,6 +66,7 @@ func main() {
authn.Register(mux) authn.Register(mux)
directory.Register(mux, cache) directory.Register(mux, cache)
mux.Handle("GET /{$}", http.RedirectHandler("/directory/", http.StatusFound)) mux.Handle("GET /{$}", http.RedirectHandler("/directory/", http.StatusFound))
mux.Handle("GET /static/", http.StripPrefix("/static/", http.FileServer(http.Dir("web/static"))))
port := os.Getenv("PORT") port := os.Getenv("PORT")
if port == "" { if port == "" {
port = "8080" port = "8080"
+30 -14
View File
@@ -2,9 +2,12 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="theme-color" content="#014E54"> <meta name="theme-color" content="#014E54">
<title>Helios</title> <title>Helios Who?</title>
<link rel="icon" href="/static/brand/icon-192.png">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap">
<style> <style>
body { body {
margin: 0; margin: 0;
@@ -12,37 +15,50 @@ body {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: #014E54; background: #014E54 url('/static/brand/login-art.jpg') center / cover no-repeat;
font-family: Inter, system-ui, sans-serif; font-family: Inter, system-ui, sans-serif;
} }
.panel { .panel {
background: rgba(255, 255, 255, 0.07); width: 20rem;
border-radius: 1rem; max-width: calc(100vw - 3rem);
padding: 3rem 3.5rem; background: rgba(23, 46, 48, 0.55);
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
border-radius: 1.25rem;
padding: 2.5rem 2rem 2rem;
text-align: center; text-align: center;
color: white; color: white;
box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.35);
}
.panel img {
width: 4rem;
height: 4rem;
border-radius: 0.9rem;
} }
.panel h1 { .panel h1 {
margin: 0 0 0.5rem; margin: 1rem 0 1.5rem;
font-size: 2rem; font-size: 1.375rem;
font-weight: 700;
} }
.panel p { .divider {
color: #cfe0e2; border-top: 1px solid rgba(255, 255, 255, 0.18);
margin: 0 0 2rem; margin: 0 0 1.5rem;
} }
.button-holder { .button-holder {
display: flex; display: flex;
justify-content: center; justify-content: center;
min-height: 44px;
} }
</style> </style>
</head> </head>
<body> <body>
<div class="panel"> <div class="panel">
<h1>Helios</h1> <img src="/static/brand/icon-192.png" alt="">
<p>Sign in with your school Google account.</p> <h1>Helios Who?</h1>
<div class="divider"></div>
<div id="g_id_onload" data-client_id="{{.ClientID}}" data-login_uri="{{.LoginURI}}" data-auto_prompt="false"></div> <div id="g_id_onload" data-client_id="{{.ClientID}}" data-login_uri="{{.LoginURI}}" data-auto_prompt="false"></div>
<div class="button-holder"> <div class="button-holder">
<div class="g_id_signin" data-type="standard" data-theme="filled_black" data-size="large" data-text="continue_with"></div> <div class="g_id_signin" data-type="standard" data-theme="filled_black" data-size="large" data-shape="pill" data-text="continue_with" data-width="300"></div>
</div> </div>
</div> </div>
<script src="https://accounts.google.com/gsi/client" async></script> <script src="https://accounts.google.com/gsi/client" async></script>
Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 149 KiB