Login.php
Greetings.
Today i want you to pass some edited files for Modern Aac.
This topic will be dedicated ( account/login form ) how to make a better look of the table.
There will be 2 examples.. The Real Tibia and my. As we know so far the files are "blank" just text and input.
All modifications made by me can be found here. OtLand - Threads Tagged with modern aac kavvson
Where to find the file?
system/application/views/login.php
So here we start.
Real Tibia login (only the button is not real :] - but its up to you and to. You might change it to fit your layout)
That should you paste in your login.php file (not during the time the functions might change for example the latest change was the keyboard was added. So just simply look at the latest SVN and if it changed just paste the content below the
<?php echo form_open('account/login'); ?> tag.
HTML:
<?php echo error(validation_errors()); ?>
<script type="text/javascript" src="<?php echo WEBSITE; ?>/public/js/keyboard.js" charset="UTF-8"></script>
<link rel="stylesheet" type="text/css" href="<?php echo WEBSITE; ?>/public/css/keyboard.css">
<?php echo form_open('account/login'); ?>
<div class="TableContainer" >
<table class="Table1" cellpadding="0" cellspacing="0" >
<div class="CaptionContainer" >
<div class="CaptionInnerContainer" >
<div class="Text" >Account Login</div>
</div>
</div>
<tr>
<td>
<div class="InnerTableContainer" >
<table style="width:100%;" >
<tr>
<td><td class="LabelV"><span>Account Name:</span></td></td><td style="width:100%;" ><input type="password" value="<?php echo set_value('name'); ?>" class="keyboardInput" name="name" ></td></tr>
<tr><td><td class="LabelV"><span>Password:</span></td></td><td><input type="password"" value="<?php echo set_value('pass'); ?>" class="keyboardInput" name="pass" ></td></tr>
</table>
</div>
</table>
</div>
</td>
</tr>
<br>
<TD><input type="submit" value="Login"/></TD>
</FORM>Also if you want that it work you will have to add some css staff.
The Css file you can find in the templates/ and a file .css . Since its hard to say where you have the file :]
HTML:
.TableContainer {
border: 1px solid black;
position: relative;
width: 100%;
font-size: 12px;
}
.TableContainer .CaptionContainer {
position: relative;
font-size: 1pt;
background-color: #5f4d41 !important;
height: 4%;
width: 100%;
text-align: left;
}
.TableContainer .CaptionContainer .CaptionInnerContainer {
position: relative;
background-color: #5f4d41;
width: 100%;
height: 100%;
padding-top: 3px;
padding-bottom: 4px;
}
.TableContainer .CaptionContainer .Text {
font-family: Verdana, Arial, Times New Roman, sans-serif;
font-size: 10pt;
font-weight: bold;
text-align: left;
color: white;
padding-left: 10px;
padding-top: 0px;
padding-bottom: 0px;
}
.TableContainer .Table1 {
width: 100%;
background-color: #d4c0a1;
border: 2px solid #55636c;
}
.TableContainer .Table1 .InnerTableContainer {
padding: 5px;
}
.LabelV {
font-weight: bold;
padding-right: 10px;
white-space: nowrap;
vertical-align: top;
}And it should work :]
Hint 1. Now lets see a simple edit. That just create a table. You might change the color(background) of the filling of the table. If you want have the same result please follow this post http://otland.net/803349-post22.html. Its just a simple version how to use a image as a background for the filling of the table content.
The same goes here i didnt fixed the button since i dont have a idea for now :]
My version is much shorter.. Follow the steps above where to place the content ( this is the full login.php file for my version )
TABLE VERSION
PHP:
<?php echo error(validation_errors()); ?>
<script type="text/javascript" src="<?php echo WEBSITE; ?>/public/js/keyboard.js" charset="UTF-8"></script>
<link rel="stylesheet" type="text/css" href="<?php echo WEBSITE; ?>/public/css/keyboard.css">
<?php echo form_open('account/login'); ?>
<TABLE CELLSPACING=1 CELLPADDING=4 BORDER=0 WIDTH=400>
<TD class="vdarkBorder" ><center><label for="name">Account Access</label></center></TD>
</TABLE>
<TABLE CELLSPACING=1 CELLPADDING=4 BORDER=0 WIDTH=400>
<TR class="darkBorder" ><TD width="100" valign="center" ><center><label for="name">Account Name:</label></center></TD><TD colspan="2"><input type="password" value="<?php echo set_value('name'); ?>" class="keyboardInput" name="name"/></TD></TR>
<TR class="darkBorder" ><TD width="100" valign="center"><center><label for="name">Password:</label></center><TD colspan="2"><input type="password"" value="<?php echo set_value('pass'); ?>" class="keyboardInput" name="pass"/></TD></TR>
</FORM>
</TABLE>############################################################
DIV VERSION
############################################################
PHP:
<?php echo error(validation_errors()); ?>
<script type="text/javascript" src="<?php echo WEBSITE; ?>/public/js/keyboard.js" charset="UTF-8"></script>
<link rel="stylesheet" type="text/css" href="<?php echo WEBSITE; ?>/public/css/keyboard.css">
<?php echo form_open('account/login'); ?>
<div class="tabela1">
<div class="bg-h"><div class="title">Account Access</div></div>
<div class="bg-t"><div class="title">Account Name:</div><input type="password" value="<?php echo set_value('name'); ?>" class="keyboardInput" name="name"/><br></div>
<div class="bg-t"><div class="title">Password:</div><input type="password"" value="<?php echo set_value('pass'); ?>" class="keyboardInput" name="pass"/><br></div>
<input class='sub' type="submit" value="Login"/>
</div>
</form>ALSO ADD IN CSS but only if you use DIV version
Code:
/** Table **/
.tabela1 {
position: relative;
width: 100%;
font-size: 12px;
}
.tabela1 .bg-t {
position: relative;
height: 100%;
width: 100%;
font-size: 12px;
padding-top: 6px;
padding-bottom: 6px;
margin-bottom: 1px;
background:#DBB96A url(images/backgrounds/header-2.gif) repeat-x scroll center top;
}
.tabela1 .bg-t .title {
float:left;
font-weight:bold;
margin-top:6px;
margin-right:2px;
margin-left:6px;
text-align:center;
width:120px;
}
.tabela1 .bg-h {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#AA5900 url('images/header-3.gif') repeat-x scroll center top;
width: 100%;
font-size: 16px;
font-weight: bold;
padding: 2px 0 2px 0px;
margin-bottom: 2px;
font: Verdana, sans-serif;
}
.tabela1 .bg-h .title {
padding: 2px 0 2px 25px;
}
/** Table **/############################################################
DIV VERSION END
############################################################
As you see to make it working you need to follow Hint 1. . And thats all.. You can change it anyway.
Dont forget to rep me++
Regards.
Kavvson
Last edited by a moderator:
