This is a modified version of the login box that I'm using in my site.
1.- Build a HTML block and add the code:
<vb:if condition="$show['member']">
<table align="right" cellspacing="0" cellpadding="0" border="0" style="font-size: 9pt;">
<tr>
<td colspan="2" style="padding-top:5px; text-align:center;">
{vb:rawphrase welcome_x_link_y, {vb:raw bbuserinfo.username}, {vb:link member, {vb:raw bbuserinfo}}}
</td>
</tr>
<vb:if condition="$notifications_total">
<tr>
<td colspan="2" style="padding-top:5px; text-align:center;">
<a class="emailnotify" href="usercp.php{vb:raw session.sessionurl_q}">
<font color="#003399"><b>{vb:raw notifications_total}</b></font></a>
</td>
</tr>
</vb:if>
<tr>
<td width="50%" style="padding-top:5px; text-align:center;">
<a href="usercp.php{vb:raw session.sessionurl_q}"><img border="0" src="images/usercp.png" alt=""></a>
</td>
<td width="50%" style="padding-top:5px; text-align:center;">
<a href="login.php?{vb:raw session.sessionurl}do=logout&logouthash={vb:raw bbuserinfo.logouthash}" onclick="return log_out('{vb:rawphrase sure_you_want_to_log_out}')">
<img border="0" src="images/logout.png" alt=""></a>
</td>
</tr>
</table>
<vb:else />
<form id="navbar_loginform" action="login.php?{vb:raw session.sessionurl}do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, {vb:raw show.nopasswordempty})">
<input type="hidden" name="s" value="{vb:raw session.sessionhash}" />
<input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" />
<input type="hidden" name="do" value="login" />
<input type="hidden" name="vb_login_md5password" />
<input type="hidden" name="vb_login_md5password_utf" />
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="logincell">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td><img border="0" src="images/username.png" alt=""></td>
<td>
<input type="text" class="logininput" name="vb_login_username" id="navbar_username" accesskey="u" tabindex="101" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="logincell">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td><img border="0" src="images/password.png" alt=""></td>
<td>
<input type="password" class="logininput" tabindex="102" name="vb_login_password" id="navbar_password" />
<input type="text" class="textbox default-value" tabindex="102" name="vb_login_password_hint" id="navbar_password_hint" size="10" value="{vb:rawphrase password}" style="display:none;" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="logincell">
<table align="center" cellspacing="0" cellpadding="0" border="0">
<tr>
<td>
<input type="checkbox" name="cookieuser" value="1" id="cb_cookieuser_navbar" class="cb_cookieuser_navbar" accesskey="c" tabindex="103" />
</td>
<td width="2"><img border="0" src="images/spacer.png" width="5"></td>
<td>
<img border="0" src="images/remember.png" alt="">
</td>
<td width="5"><img border="0" src="images/spacer.png" width="5"></td>
<td>
<input type="image" tabindex="104" src="images/login.png" accesskey="s" />
</td>
<vb:if condition="$show['registerbutton']">
<td width="5"><img border="0" src="images/spacer.png" width="5"></td>
<td>
<a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">
<img border="0" src="images/register.png"></a>
</td>
</vb:if>
</tr>
</table>
</td>
</tr>
</table>
</form>
</vb:if>
2.- Upload the attached icons to your images/ directory
3.- Open additional.css (even if I prefer to add them to vbulletin.css) and add:
td.logincell {
border: 1px solid #DDDDDD;
padding: 2px;
}
input.logininput {
border: 0;
width: 60px;
}
a.emailnotify
{
display: block;
background: #FFFFFF url(images/email.png);
width: 26px;
height:26px;
text-align: center;
}
4.- Add the widget to your layout
Chris