Preston_PLB
/
Capstone
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

B: get to login page

This commit is contained in:
Preston Baxter 2023-10-28 11:34:11 -05:00
parent 43d111cb0e
commit db799805f9
7 changed files with 150 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/.air.toml
View File

@ -5,7 +5,7 @@ tmp_dir = "tmp"
[build]
args_bin = []
bin = "./tmp/main"
cmd = "templ generate && go build -o ./tmp/main ."
cmd = "rm **/*_templ.go && templ generate && go build -o ./tmp/main ."
delay = 1000
exclude_dir = ["assets", "tmp", "vendor", "testdata", "dist"]
exclude_file = []

8
ui/main.go
View File

@ -15,6 +15,14 @@ func main() {
templates.LandingPage(false).Render(c.Request.Context(), buf)
c.Data(200, "text/html", []byte(buf.String()))
})
r.GET("/login", func(c *gin.Context) {
raw := []byte{}
buf := bytes.NewBuffer(raw)
templates.LoginPage().Render(c.Request.Context(), buf)
c.Data(200, "text/html", []byte(buf.String()))
})
r.Run() // listen and serve on 0.0.0.0:8080 (for windows "localhost:8080")

46
ui/templates/footer.templ Normal file
View File

@ -0,0 +1,46 @@
package templates
templ Footer() {
<footer class="absolute w-full bottom-0 bg-gray-900 pb-6">
<div class="container mx-auto px-4">
<hr class="mb-6 border-b-1 border-gray-700"/>
<div
class="flex flex-wrap items-center md:justify-between justify-center"
>
<div class="w-full md:w-4/12 px-4">
<div class="text-sm text-white font-semibold py-1">
Copyright © 2023
<a
href="https://git.preston-baxter.com"
class="text-white hover:text-gray-400 text-sm font-semibold py-1"
>Preston Baxter</a>
</div>
</div>
<div class="w-full md:w-8/12 px-4">
<ul
class="flex flex-wrap list-none md:justify-end justify-center"
>
<li>
<a
href="https://git.preston-baxter.com"
class="text-white hover:text-gray-400 text-sm font-semibold block py-1 px-3"
>Preston Baxter</a>
</li>
<li>
<a
href="/about-us"
class="text-white hover:text-gray-400 text-sm font-semibold block py-1 px-3"
>About Us</a>
</li>
<li>
<a
href="https://github.com/creativetimofficial/argon-design-system/blob/master/LICENSE.md"
class="text-white hover:text-gray-400 text-sm font-semibold block py-1 px-3"
>MIT License</a>
</li>
</ul>
</div>
</div>
</div>
</footer>
}

2
ui/templates/content.templ → ui/templates/landing_content.templ
View File

@ -1,6 +1,6 @@
package templates
templ Content() {
templ LandingContent() {
<main>
<div class="relative pt-16 pb-32 flex content-center items-center justify-center" style="min-height: 75vh;">
<div

3
ui/templates/landing_page.templ
View File

@ -35,8 +35,9 @@ templ LandingPage(auth bool) {
@Head()
<body class="text-gray-800 antialiased">
@Nav(auth)
@Content()
@LandingContent()
</body>
@Footer()
@toggleNavBar()
</html>
}

78
ui/templates/login_content.templ Normal file
View File

@ -0,0 +1,78 @@
package templates
templ LoginContent() {
<main>
<section class="absolute w-full h-full">
<div
class="absolute top-0 w-full h-full bg-gray-900"
style="background-image: url(./assets/img/register_bg_2.png); background-size: 100%; background-repeat: no-repeat;"
></div>
<div class="container mx-auto px-4 h-full">
<div class="flex content-center items-center justify-center h-full">
<div class="w-full lg:w-4/12 px-4">
<div
class="relative flex flex-col min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-gray-300 border-0"
>
<div class="flex-auto px-4 lg:px-10 py-10 pt-10">
<div class="text-gray-500 text-center mb-3 font-bold">
<small>Sign in</small>
</div>
<form>
<div class="relative w-full mb-3">
<label
class="block uppercase text-gray-700 text-xs font-bold mb-2"
for="grid-password"
>Email</label><input
type="email"
class="border-0 px-3 py-3 placeholder-gray-400 text-gray-700 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full"
placeholder="Email"
style="transition: all 0.15s ease 0s;"
/>
</div>
<div class="relative w-full mb-3">
<label
class="block uppercase text-gray-700 text-xs font-bold mb-2"
for="grid-password"
>Password</label><input
type="password"
class="border-0 px-3 py-3 placeholder-gray-400 text-gray-700 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full"
placeholder="Password"
style="transition: all 0.15s ease 0s;"
/>
</div>
<div>
<label class="inline-flex items-center cursor-pointer">
<input
id="customCheckLogin"
type="checkbox"
class="form-checkbox border-0 rounded text-gray-800 ml-1 w-5 h-5"
style="transition: all 0.15s ease 0s;"
/><span class="ml-2 text-sm font-semibold text-gray-700">Remember me</span>
</label>
</div>
<div class="text-center mt-6">
<button
class="bg-gray-900 text-white active:bg-gray-700 text-sm font-bold uppercase px-6 py-3 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1 w-full"
type="button"
style="transition: all 0.15s ease 0s;"
>
Sign In
</button>
</div>
</form>
</div>
</div>
<div class="flex flex-wrap mt-6">
<div class="w-1/2">
<a href="#pablo" class="text-gray-300"><small>Forgot password?</small></a>
</div>
<div class="w-1/2 text-right">
<a href="#pablo" class="text-gray-300"><small>Create new account</small></a>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
}

14
ui/templates/login_page.templ Normal file
View File

@ -0,0 +1,14 @@
package templates
templ LoginPage() {
<!DOCTYPE html>
<html>
@Head()
<body class="text-gray-800 antialiased">
@Nav(false)
@LoginContent()
</body>
@Footer()
@toggleNavBar()
</html>
}