API tools faq
paste
Advertisement
Guest User

Probando Chico UI - Modal

a guest
Nov 8th, 2012
77
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 3.73 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!doctype html>
  3.  
  4. <!--[if lt IE 7]> <html class="no-js lt-ie10 lt-ie9 lt-ie8 lt-ie7 ie6" lang="en"> <![endif]-->
  5.  
  6. <!--[if IE 7]>    <html class="no-js lt-ie10 lt-ie9 lt-ie8 ie7" lang="en"> <![endif]-->
  7.  
  8. <!--[if IE 8]>    <html class="no-js lt-ie10 lt-ie9 ie8" lang="en"> <![endif]-->
  9.  
  10. <!--[if IE 9]>    <html class="no-js lt-ie10 ie9" lang="en"> <![endif]-->
  11.  
  12. <!--[if gt IE 9]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
  13.  
  14. <head>
  15.  
  16. <meta charset="utf-8">
  17.  
  18. <title>Chubut Store</title>
  19.  
  20. <link rel="stylesheet" href="css/chico-min-0.11.1.css">
  21.  
  22. <style>
  23.  
  24. body {background:#f2f2f2}
  25.  
  26. #header {height:40px;line-height:40px}
  27.  
  28. #user_options{float:right}
  29.  
  30. #user_options a{color:blue}
  31.  
  32. #user_options a:hover{text-decoration:none;color:orange}
  33.  
  34. .logo {float:left;background-image:url(css/img/header.jpg);height:32px;width:160px;}
  35.  
  36. </style>
  37.  
  38. <script src="js/jquery.js"></script>
  39.  
  40. <script src="js/chico-min-0.11.1.js"></script>
  41.  
  42. </head>
  43.  
  44. <body>
  45.  
  46.  
  47.  
  48. <div id="header" class="ch-box-lite">
  49.  
  50.     <div class="logo"></div>
  51.  
  52.     <div id="user_options">
  53.  
  54.         <a href="#" id="mm">Ingresar</a> |
  55.  
  56.         <a href="?option=registrarse">Registrarme</a>
  57.  
  58.     </div>
  59.  
  60. </div>
  61.  
  62. <script>
  63.  
  64. var foo = $("#mm").modal("<p>Rich content.</p>");
  65.  
  66. </script><div class="ch-box">
  67.  
  68.     <h1 class="ch-box-container">Formulario de Registro</h1>
  69.  
  70.     <p class="ch-form-hint">Todos los campos son requeridos</p>
  71.  
  72.     <form method="post" action="registrarse.php" id="regForm" class="ch-form">
  73.  
  74.         <p class="ch-form-row ch-form-required">
  75.  
  76.             <label for="nombre">Nombre Real</label>
  77.  
  78.             <input type="text" id="nombre" name="nombre" placeholder="Escriba su nombre" autocomplete="off"  required="required">
  79.  
  80.         </p>
  81.  
  82.         <p class="ch-form-row ch-form-required">
  83.  
  84.             <label for="apellido">Apellido</label>
  85.  
  86.             <input type="text" id="apellido" name="apellido" placeholder="Escriba su apellido" autocomplete="off" required="required">
  87.  
  88.         </p>
  89.  
  90.         <p class="ch-form-row ch-form-required">
  91.  
  92.             <label for="sexo">Sexo</label>
  93.  
  94.             <select id="sexo" name="sexo" required="required" pattern="[^-1]" class="ch-points-ltrt">
  95.  
  96.                 <option value="">Indique su sexo...</option>
  97.  
  98.                 <option value="1">Masculino</option>
  99.  
  100.                 <option value="2">Femenino</option>
  101.  
  102.             </select>
  103.  
  104.         </p>
  105.  
  106.         <p class="ch-form-row ch-form-required">
  107.  
  108.             <label for="nick">Nombre de Usuario</label>
  109.  
  110.             <input type="text" id="nick" name="nick" placeholder="Su alias en el sistema" autocomplete="off" required="required">
  111.  
  112.         </p>
  113.  
  114.         <p class="ch-form-row ch-form-required">
  115.  
  116.             <label for="email">Correo Electronico</label>
  117.  
  118.             <input type="email" id="email" name="email" placeholder="Su direccion de E-mail" autocomplete="on" class="ch-points-ltrt" required="required">
  119.  
  120.         </p>
  121.  
  122.         <p class="ch-form-row ch-form-required">
  123.  
  124.             <label for="passw">Contrase&ntilde;a</label>
  125.  
  126.             <input type="password" id="passw" name="passw" placeholder="Elija un clave" autocomplete="off" required="required">
  127.  
  128.         </p>
  129.  
  130.         <p class="ch-form-row ch-form-required">
  131.  
  132.             <label for="passw2">Repetir Contrase&ntilde;a</label>
  133.  
  134.             <input type="password" id="passw2" name="passw2" placeholder="Repita su clave" autocomplete="off" required="required">
  135.  
  136.         </p>
  137.  
  138.         <p class="ch-form-actions">
  139.  
  140.             <a href="/" class="ch-btn ch-btn-small">Cancelar</a>
  141.  
  142.             <button type="submit" id="registroSubmit" class="ch-btn">Registrarse</button>
  143.  
  144.         </p>
  145.  
  146.     </form>
  147.  
  148. </div>
  149.  
  150. <div id="footer" class="ch-box-lite" style="text-align:center">
  151.  
  152.     <h5>
  153.  
  154.         <p>Pagina generada en 0.00 segundos</p>
  155.  
  156.         <p>Chubut Store &copy; 2012 - Todos los Derechos Reservados | Desarrollado por <a href="#" class="ch-link">Facundo N. Lopez</a></p>
  157.  
  158.     </h5>
  159.  
  160. </div>
  161.  
  162. <style>
  163.  
  164. input {
  165.  
  166.     width:240px;
  167.  
  168. }
  169.  
  170. </style>
  171.  
  172. </body>
  173.  
  174. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!