1 <!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns=
"http://www.w3.org/1999/xhtml">
4 <meta http-equiv=
"Content-Type" content=
"text/html; charset=utf-8" />
5 <title>Kiwi IRC
</title>
6 <style type=
"text/css">
7 * { margin:
0px; padding:
0px; }
10 font:
14px Tahoma, Geneva, sans-serif;
22 .logo { display:block; width:
264px; height:
90px; text-indent:-
1000px; margin:
70px auto
100px; background:url(img/logo.png) no-repeat; }
23 #login { width:
665px; margin:
0px auto; }
24 #login ul { list-style:none; }
25 #login ul li { overflow:hidden; margin-bottom:
10px; }
26 #login ul li label { float:left; text-align:right; padding-right:
.5em; }
27 #login input { border:none; }
28 #login .more { border-top:
1px dotted #
888888; }
33 background: url(img/more.png) no-repeat right
5px;
40 margin:
30px auto
60px;
42 #login .content.top ul { font-size:
27px; }
43 #login .content.top label { width:
40%; }
44 #login .content.top input {
45 width:
240px; padding:
.2em
.5em;
46 font-size:
.8em; text-align:center;
48 border-radius:
8px; -moz-border-radius:
8px;
50 #login .content.top a { display:block; text-align:right; font-size:
22px; margin-top:
30px; }
52 #login .content.bottom { width:
350px; margin:
30px auto; display:none; }
53 #login .content.bottom ul { font-size:
20px; }
54 #login .content.bottom label { width:
25%; }
55 #login .content.bottom input { width:
216px; font-size:
.8em; no-repeat; padding:
.2em
.5em; background:#D4D4D4; border-radius:
8px; -moz-border-radius:
8px; }
56 #login .content.bottom a { display:block; text-align:right; font-size:
16px; margin-top:
30px; }
59 <script type=
"text/javascript" src=
"http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
60 <script type=
"text/javascript">
62 $(document).ready(function(){
69 $('.more_link').click(function(){ $('.content.bottom').slideDown('fast'); $('.network').focus(); return false; });
70 $('.formconnectwindow').submit(function(){ alert(
"logging in.."); return false; });
71 $('a.connect').click(function(){ $('.formconnectwindow').submit(); return false; });
78 <div class=
"connectwindow">
79 <h1 class=
"logo">Kiwi IRC
</h1>
81 <form class=
"formconnectwindow">
82 <div class=
"content top">
84 <li><label for=
"nick">Your nickname:
</label>
85 <input type=
"text" id=
"nick" name=
"nick" class=
"nick" /></li>
87 <a class=
"connect" href=
"">Connect »
</a>
91 <a href=
"" class=
"more_link">More
</a>
92 <div class=
"content bottom">
94 <li><label for=
"network">Server:
</label>
95 <input type=
"text" id=
"network" name=
"network" class=
"network" value=
"irc.anonnet.org" /></li>
96 <li><label for=
"channel">Channel:
</label>
97 <input type=
"text" id=
"channel" name=
"channel" class=
"channel" value=
"#kiwi" /></li>
99 <a class=
"connect" href=
"">Connect »
</a>