| 1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r |
| 2 | <html xmlns="http://www.w3.org/1999/xhtml">\r |
| 3 | <head>\r |
| 4 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />\r |
| 5 | <title>Kiwi IRC</title>\r |
| 6 | <style type="text/css">\r |
| 7 | * { margin:0px; padding:0px; }\r |
| 8 | body {\r |
| 9 | background:#1b1b1b;\r |
| 10 | font: 14px Tahoma, Geneva, sans-serif;\r |
| 11 | color: #D4D4D4;\r |
| 12 | height:100%;\r |
| 13 | }\r |
| 14 | \r |
| 15 | a {\r |
| 16 | color: #8D9713;\r |
| 17 | text-decoration:none;\r |
| 18 | }\r |
| 19 | \r |
| 20 | \r |
| 21 | \r |
| 22 | .logo { display:block; width:264px; height:90px; text-indent:-1000px; margin:70px auto 100px; background:url(img/logo.png) no-repeat; }\r |
| 23 | #login { width:665px; margin:0px auto; }\r |
| 24 | #login ul { list-style:none; }\r |
| 25 | #login ul li { overflow:hidden; margin-bottom:10px; }\r |
| 26 | #login ul li label { float:left; text-align:right; padding-right:.5em; }\r |
| 27 | #login input { border:none; }\r |
| 28 | #login .more { border-top: 1px dotted #888888; }\r |
| 29 | #login .more_link {\r |
| 30 | font-size:12px;\r |
| 31 | position:relative;\r |
| 32 | top:-16px;\r |
| 33 | background: url(img/more.png) no-repeat right 5px;\r |
| 34 | padding-right: 12px;\r |
| 35 | color:#888;\r |
| 36 | }\r |
| 37 | \r |
| 38 | #login .content.top {\r |
| 39 | width:470px;\r |
| 40 | margin:30px auto 60px;\r |
| 41 | }\r |
| 42 | #login .content.top ul { font-size:27px; }\r |
| 43 | #login .content.top label { width:40%; }\r |
| 44 | #login .content.top input {\r |
| 45 | width:240px; padding:.2em .5em;\r |
| 46 | font-size:.8em; text-align:center;\r |
| 47 | background:#D4D4D4;\r |
| 48 | border-radius:8px; -moz-border-radius:8px;\r |
| 49 | }\r |
| 50 | #login .content.top a { display:block; text-align:right; font-size:22px; margin-top:30px; }\r |
| 51 | \r |
| 52 | #login .content.bottom { width:350px; margin:30px auto; display:none; }\r |
| 53 | #login .content.bottom ul { font-size:20px; }\r |
| 54 | #login .content.bottom label { width:25%; }\r |
| 55 | #login .content.bottom input { width:216px; font-size:.8em; no-repeat; padding:.2em .5em; background:#D4D4D4; border-radius:8px; -moz-border-radius:8px; }\r |
| 56 | #login .content.bottom a { display:block; text-align:right; font-size:16px; margin-top:30px; }\r |
| 57 | </style>\r |
| 58 | \r |
| 59 | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>\r |
| 60 | <script type="text/javascript"> \r |
| 61 | \r |
| 62 | $(document).ready(function(){\r |
| 63 | addEvents();\r |
| 64 | $('.nick').focus();\r |
| 65 | });\r |
| 66 | \r |
| 67 | \r |
| 68 | function addEvents(){\r |
| 69 | $('.more_link').click(function(){ $('.content.bottom').slideDown('fast'); $('.network').focus(); return false; });\r |
| 70 | $('.formconnectwindow').submit(function(){ alert("logging in.."); return false; });\r |
| 71 | $('a.connect').click(function(){ $('.formconnectwindow').submit(); return false; });\r |
| 72 | }\r |
| 73 | </script>\r |
| 74 | </head>\r |
| 75 | \r |
| 76 | <body>\r |
| 77 | \r |
| 78 | <div class="connectwindow">\r |
| 79 | <h1 class="logo">Kiwi IRC</h1>\r |
| 80 | <div id="login">\r |
| 81 | <form class="formconnectwindow">\r |
| 82 | <div class="content top">\r |
| 83 | <ul>\r |
| 84 | <li><label for="nick">Your nickname:</label>\r |
| 85 | <input type="text" id="nick" name="nick" class="nick" /></li>\r |
| 86 | </ul>\r |
| 87 | <a class="connect" href="">Connect »</a>\r |
| 88 | </div>\r |
| 89 | \r |
| 90 | <div class="more">\r |
| 91 | <a href="" class="more_link">More</a>\r |
| 92 | <div class="content bottom">\r |
| 93 | <ul>\r |
| 94 | <li><label for="network">Server:</label>\r |
| 95 | <input type="text" id="network" name="network" class="network" value="irc.anonnet.org" /></li>\r |
| 96 | <li><label for="channel">Channel:</label>\r |
| 97 | <input type="text" id="channel" name="channel" class="channel" value="#kiwi" /></li>\r |
| 98 | </ul>\r |
| 99 | <a class="connect" href="">Connect »</a>\r |
| 100 | </div>\r |
| 101 | </div>\r |
| 102 | </form>\r |
| 103 | </div>\r |
| 104 | </div>\r |
| 105 | \r |
| 106 | </body>\r |
| 107 | </html>\r |