Advertisement
MaHarder

bootstrap: login

Sep 8th, 2017
196
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 4.54 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="ru">
  3.  
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  8.     <title>Login</title>
  9.     <link rel="stylesheet" href="http://static.maxim-harder.de/extra/jquery-ui/jquery-ui.min.css">
  10.     <link href="http://static.maxim-harder.de/css/bootstrap-purple-blue.min.css" rel="stylesheet">
  11.     <style>
  12. .login {
  13.     max-width: 750px;
  14.     width: 100%;
  15.     margin-top: 30%;
  16.     margin-right: auto;
  17.     margin-left: auto;
  18. }
  19. </style>
  20.     <link href="http://fonts.googleapis.com/css?family=Lato:100,300,400,700,100italic,300italic,400italic,700italic" rel="stylesheet" type="text/css">
  21. </head>
  22.  
  23. <body>
  24. <nav class="navbar navbar-default navbar-fixed">
  25.         <div class="container">
  26.             <div class="navbar-header">
  27.                 <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navi" aria-expanded="false">
  28.                     <span class="sr-only">Меню</span>
  29.                     <span class="icon-bar"></span>
  30.                     <span class="icon-bar"></span>
  31.                     <span class="icon-bar"></span>
  32.                 </button>
  33.                 <a class="navbar-brand" href="#">MT</a>
  34.             </div>
  35.  
  36.             <div class="collapse navbar-collapse" id="navi">
  37.                 <ul class="nav navbar-nav">
  38.                     <li class="dropdown active">
  39.                         <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">ZeroToHero [Altai] <span class="caret"></span></a>
  40.                         <ul class="dropdown-menu">
  41.                             <li><a href="#">Смена пользователя</a></li>
  42.                         </ul>
  43.                     </li>
  44.                     <li class="dropdown">
  45.                         <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Пользовательские данные <span class="caret"></span></a>
  46.                         <ul class="dropdown-menu">
  47.                             <li><a href="#">Основная информация</a></li>
  48.                             <li><a href="#">Статистика расходов</a></li>
  49.                             <li><a href="#">Приобретённые карты</a></li>
  50.                             <li><a href="#">Доступные комбинации</a></li>
  51.                             <li><a href="#">Неосвоенные комбинации</a></li>
  52.                             <li><a href="#">Создание колоды</a></li>
  53.                         </ul>
  54.                     </li>
  55.                     <li class="dropdown">
  56.                         <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Бот <span class="caret"></span></a>
  57.                         <ul class="dropdown-menu">
  58.                             <li><a href="#">Бот ежедневных заданий</a></li>
  59.                             <li><a href="#">Настройка бота приключений</a></li>
  60.                             <li><a href="#">Настройка бота рамбла</a></li>
  61.                             <li><a href="#">Настройка бота вызывов</a></li>
  62.                         </ul>
  63.                     </li>
  64.                 </ul>
  65.             </div>
  66.         </div>
  67.     </nav>
  68. <div class="container">
  69.     <div class="login">
  70.         <form role="form" action="">
  71.             <div class="form-group">
  72.                 <label for="login">Имя пользователя</label>
  73.                 <input type="text" class="form-control" id="login" placeholder="Введи свой логин">
  74.             </div>
  75.             <div class="form-group">
  76.                 <label for="password">Пароль</label>
  77.                 <input type="password" class="form-control" id="password" placeholder="Введи свой пароль">
  78.             </div>
  79.             <button type="submit" class="btn btn-default">Войти</button>
  80.         </form>
  81.     </div>
  82. </div>
  83.  
  84.     <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
  85.     <script>
  86.         window.jQuery || document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">\x3C/script>')
  87.     </script>
  88.     <script src="http://static.maxim-harder.de/extra/jquery-ui/jquery-ui.min.js"></script>
  89.     <script src="http://static.maxim-harder.de/js/bootstrap.min.js"></script>
  90. </body>
  91.  
  92. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement