]> git.immae.eu Git - github/shaarli/Shaarli.git/blobdiff - tpl/default/loginform.html
Add classes to default template to avoid using IDs in SCSS
[github/shaarli/Shaarli.git] / tpl / default / loginform.html
index 84176385765837973d77be29941db622ccad1f6a..3cdab65ac367b47fb08b61c3030aff1a6660c1f3 100644 (file)
@@ -1,38 +1,51 @@
 <!DOCTYPE html>
 <html>
-<head>{include="includes"}</head>
-<body
-{if="ban_canLogin($conf)"}
-  {if="empty($username)"}
-    onload="document.loginform.login.focus();"
-  {else}
-    onload="document.loginform.password.focus();"
-  {/if}
-{/if}>
-<div id="pageheader">
-  {include="page.header"}
-
-  <div id="headerform">
-    {if="!ban_canLogin($conf)"}
-      You have been banned from login after too many failed attempts. Try later.
-    {else}
+<head>
+  {include="includes"}
+</head>
+<body>
+{include="page.header"}
+{if="!$user_can_login"}
+<div class="pure-g pure-alert pure-alert-error pure-alert-closable center">
+  <div class="pure-u-2-24"></div>
+  <div class="pure-u-20-24">
+    {'You have been banned after too many failed login attempts. Try again later.'|t}
+  </div>
+  <div class="pure-u-2-24">
+    <i class="fa fa-times pure-alert-close"></i>
+  </div>
+</div>
+{else}
+  <div class="pure-g">
+    <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+    <div id="login-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24 login-form-container">
       <form method="post" name="loginform">
-        <label for="login">Login: <input type="text" id="login" name="login" tabindex="1"
-           {if="!empty($username)"}value="{$username}"{/if}>
-        </label>
-        <label for="password">Password: <input type="password" id="password" name="password" tabindex="2">
-        </label>
-        <input type="submit" value="Login" class="bigbutton" tabindex="4">
-        <label for="longlastingsession">
-          <input type="checkbox" name="longlastingsession" id="longlastingsession" tabindex="3">
-          Stay signed in (Do not check on public computers)</label>
+        <h2 class="window-title">{'Login'|t}</h2>
+        <div>
+          <input type="text" name="login" placeholder="{'Username'|t}"
+             {if="!empty($username)"}value="{$username}"{/if} class="autofocus" tabindex="20">
+        </div>
+        <div>
+          <input type="password" name="password" placeholder="{'Password'|t}" class="autofocus" tabindex="21">
+        </div>
+        <div class="remember-me">
+          <input type="checkbox" name="longlastingsession" id="longlastingsessionform"
+             {if="$remember_user_default"}checked="checked"{/if}
+             tabindex="22">
+          <label for="longlastingsessionform">{'Remember me'|t}</label>
+        </div>
+        <div>
+          <input type="submit" value="{'Login'|t}" class="bigbutton" tabindex="23">
+        </div>
         <input type="hidden" name="token" value="{$token}">
         {if="$returnurl"}<input type="hidden" name="returnurl" value="{$returnurl}">{/if}
       </form>
-    {/if}
+    </div>
+    <div class="pure-u-lg-1-3 pure-u-1-8"></div>
   </div>
-</div>
+{/if}
 
 {include="page.footer"}
 </body>
 </html>
+