Added : New admin area login

This commit is contained in:
Arslan Hassan 2012-06-29 10:58:11 +00:00
parent 666479ede7
commit 84a3d18718
5 changed files with 126 additions and 45 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

View file

@ -18,7 +18,7 @@
<div class="header-top"> <div class="header-top">
<div class="logo"> <div class="logo">
<div class="logo-text">Hello World</div> <div class="logo-text">{$title}</div>
</div> </div>
</div> </div>

View file

@ -1,41 +1,70 @@
<style>
body,html{
background: #efefef !important;
}
</style>
<body> <body>
<div class="login-page">
<div class="header_grey_bar"> <div class="back-to-website gradient">
<img src="{$imageurl}/dot.gif" class="cbicon" /> {$title} &#8212; <a href="{$baseurl}">Back To Main Website</a> <a href="{$baseurl}">Go to main website</a>
<div class="clearfix"></div>
</div> </div>
{include file="$style_dir/msg.html" } <!-- Logo -->
<div class="login-logo">
<img src="{$imageurl}/login-logo.png">
</div>
<div class="login-msg">
{include file="$style_dir/msg.html" }
</div>
<!-- Login Box -->
<div class="login-box">
<form name="login-form" class="form-vertical" method="post">
<div class="control-group">
<label class="control-label" for="username">Username</label>
<div class="controls">
<input class="input-xlarge focused" id="username"
name="username" type="text" value="" placeholder="username...">
</div>
</div>
<div class="control-group">
<label class="control-label" for="password">Password</label>
<div class="controls">
<input type="password" class="input-xlarge focused"
id="password" type="text" value="" name="password"
placeholder="password">
</div>
</div>
<div class="control-group inlineblock">
<div class="controls">
<label class="checkbox">
<input type="checkbox" name="remember" value="option1">
Remember me
</label>
</div>
</div>
<div class="inlineblock pull-right" align="right">
<input type="submit" name="login" value="Login to admin area" class="btn btn-primary">
</div>
<div class="clearfix"></div>
<div align="right">
Forgot password?
</div>
<div style="height:400px; background-image:url({$imageurl}/bgs/login.png); background-repeat:repeat-x" align="center">
<div id="login_box">
<form name="form1" method="post" action="">
<table width="78%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="left"><label for="username">Username</label></td>
</tr>
<tr>
<td align="left">
<input type="text" name="username" id="username" class="textfield">
</td>
</tr>
<tr>
<td align="left"><label for="password">Password</label></td>
</tr>
<tr>
<td>
<input type="password" name="password" id="password" class="textfield">
</td>
</tr>
<tr>
<td align="center"><label>
<input type="submit" name="login" class="button" value=" Login ">
</label></td>
</tr>
</table>
</form> </form>
</div> </div>
<!-- Login Footer -->
<div class="login-footer">
Forged by ClipBucket | Arslan Hassan | v3.0
</div>
</div> </div>
<div align="center" class="login_footer">&copy; ClipBucket Copyright 2007 &#8211; {$smarty.now|date_format:"%Y"} | Arslan Hassan</div>
</body> </body>
</html>

View file

@ -4,10 +4,10 @@
{if $err.0 neq '' || $err.1 neq ''} {if $err.0 neq '' || $err.1 neq ''}
<div class="msg error"> <div class="alert alert-danger">
<ul> <ul>
{foreach from=$err item=show_msg} {foreach from=$err item=show_msg}
<li><img src="{$imageurl}/cross.png" />{$show_msg}</li> <li>{$show_msg}</li>
{/foreach} {/foreach}
</ul> </ul>
</div> </div>
@ -15,20 +15,20 @@
{/if} {/if}
{if $msg.0 neq ''} {if $msg.0 neq ''}
<div class="msg blue"> <div class="alert alert-success">
<ul> <ul>
{foreach from=$msg item=show_msg} {foreach from=$msg item=show_msg}
<li><img src="{$imageurl}/ok.png" />{$show_msg}</li> <li>{$show_msg}</li>
{/foreach} {/foreach}
</ul> </ul>
</div> </div>
{/if} {/if}
{if $war.0 neq ''} {if $war.0 neq ''}
<div class="msg blue"> <div class="alert">
<ul> <ul>
{foreach from=$war item=show_msg} {foreach from=$war item=show_msg}
<li><img src="{$imageurl}/error.png" />{$show_msg}</li> <li>{$show_msg}</li>
{/foreach} {/foreach}
</ul> </ul>
</div> </div>

View file

@ -135,3 +135,55 @@ font-weight: bold; font-size: 12px; color: #626262}
.well-compact{padding: 10px} .well-compact{padding: 10px}
.loading_pointer{ vertical-align: middle; display: none} .loading_pointer{ vertical-align: middle; display: none}
/* Login Page */
.login-page{background-color: #efefef}
.back-to-website a{color: #fff}
.back-to-website{
background: #4f4f4f;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRmNGY0ZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwZTBlMGUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #4f4f4f 0%, #0e0e0e 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4f4f4f), color-stop(100%,#0e0e0e));
background: -webkit-linear-gradient(top, #4f4f4f 0%,#0e0e0e 100%);
background: -o-linear-gradient(top, #4f4f4f 0%,#0e0e0e 100%);
background: -ms-linear-gradient(top, #4f4f4f 0%,#0e0e0e 100%);
background: linear-gradient(to bottom, #4f4f4f 0%,#0e0e0e 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f4f4f', endColorstr='#0e0e0e',GradientType=0 );
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
font-size: 12px; color: #fff;
font-weight: bold; text-align: center; padding: 3px 8px;
width:150px; margin: auto;
}
.login-logo{text-align: center; margin: 30px 0px 10px}
.login-box{
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
padding: 15px; border:1px solid #aeaeae;
box-shadow: 1px 1px 0px #fff;
width: 280px; margin: auto;
background: #ffffff;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI3MSUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZWZlZmVmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top, #ffffff 71%, #efefef 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(71%,#ffffff), color-stop(100%,#efefef));
background: -webkit-linear-gradient(top, #ffffff 71%,#efefef 100%);
background: -o-linear-gradient(top, #ffffff 71%,#efefef 100%);
background: -ms-linear-gradient(top, #ffffff 71%,#efefef 100%);
background: linear-gradient(to bottom, #ffffff 71%,#efefef 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}
.login-msg{width: 310px; margin: auto;}
.login-box .control-label{font-size: 14px; font-weight: bold}
.login-footer{margin-top: 15px;
font-size: 12px; color: #222l;text-align: center}
.login-footer .version{font-size: 12px; font-weight: normal}