summaryrefslogtreecommitdiffstats
path: root/site/content/docs/5.2/examples/sign-in
diff options
context:
space:
mode:
Diffstat (limited to 'site/content/docs/5.2/examples/sign-in')
-rw-r--r--site/content/docs/5.2/examples/sign-in/index.html32
-rw-r--r--site/content/docs/5.2/examples/sign-in/signin.css33
2 files changed, 65 insertions, 0 deletions
diff --git a/site/content/docs/5.2/examples/sign-in/index.html b/site/content/docs/5.2/examples/sign-in/index.html
new file mode 100644
index 0000000..8772ba3
--- /dev/null
+++ b/site/content/docs/5.2/examples/sign-in/index.html
@@ -0,0 +1,32 @@
+---
+layout: examples
+title: Signin Template
+extra_css:
+ - "signin.css"
+body_class: "text-center"
+include_js: false
+---
+
+<main class="form-signin w-100 m-auto">
+ <form>
+ <img class="mb-4" src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo.svg" alt="" width="72" height="57">
+ <h1 class="h3 mb-3 fw-normal">Please sign in</h1>
+
+ <div class="form-floating">
+ <input type="email" class="form-control" id="floatingInput" placeholder="name@example.com">
+ <label for="floatingInput">Email address</label>
+ </div>
+ <div class="form-floating">
+ <input type="password" class="form-control" id="floatingPassword" placeholder="Password">
+ <label for="floatingPassword">Password</label>
+ </div>
+
+ <div class="checkbox mb-3">
+ <label>
+ <input type="checkbox" value="remember-me"> Remember me
+ </label>
+ </div>
+ <button class="w-100 btn btn-lg btn-primary" type="submit">Sign in</button>
+ <p class="mt-5 mb-3 text-muted">&copy; 2017–{{< year >}}</p>
+ </form>
+</main>
diff --git a/site/content/docs/5.2/examples/sign-in/signin.css b/site/content/docs/5.2/examples/sign-in/signin.css
new file mode 100644
index 0000000..89deea4
--- /dev/null
+++ b/site/content/docs/5.2/examples/sign-in/signin.css
@@ -0,0 +1,33 @@
+html,
+body {
+ height: 100%;
+}
+
+body {
+ display: flex;
+ align-items: center;
+ padding-top: 40px;
+ padding-bottom: 40px;
+ background-color: #f5f5f5;
+}
+
+.form-signin {
+ max-width: 330px;
+ padding: 15px;
+}
+
+.form-signin .form-floating:focus-within {
+ z-index: 2;
+}
+
+.form-signin input[type="email"] {
+ margin-bottom: -1px;
+ border-bottom-right-radius: 0;
+ border-bottom-left-radius: 0;
+}
+
+.form-signin input[type="password"] {
+ margin-bottom: 10px;
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+}